/* ===== Galeri Kenangan Annur Prima — bingkai foto, hero dinding bingkai, album, lightbox. Hijau zamrud & emas. ===== */
:root{--gk-emas:#e9c46a;--gk-emas2:#f6e3a1;--gk-emas-tua:#8a6516;--gk-zamrud:#042d1f}

/* ---------- Bingkai (dipakai situs dan admin) ---------- */
.gk-bk{position:relative;display:block;transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s}
.gk-foto{position:relative;display:block;overflow:hidden;background:#0b3b2a}
.gk-foto img{display:block;width:100%;height:auto;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),filter .6s}
.gk-foto::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,#ffffff55 50%,transparent 65%);transform:translateX(-130%)}
.gk:hover .gk-foto img,.gk:focus-visible .gk-foto img{transform:scale(1.07)}
.gk:hover .gk-foto::after,.gk:focus-visible .gk-foto::after{transform:translateX(130%);transition:transform 1.1s}
.gk-s{display:none}
.gk-overlay{display:none}
/* 1. Klasik Emas */
.gk-f-emas{padding:9px;border-radius:4px;background:linear-gradient(135deg,#f6e3a1,#b8892b 28%,#fff3c4 50%,#b8892b 72%,#e9c46a);box-shadow:0 22px 34px -20px rgba(4,45,31,.75),inset 0 2px 0 #fff8}
.gk-f-emas .gk-foto{border:13px solid #fbf6e4;box-shadow:inset 0 0 0 1px #b8892b99,inset 0 4px 14px #0005}
/* 2. Polaroid */
.gk-f-polaroid{padding:12px 12px 62px;background:#fff;border-radius:3px;transform:rotate(var(--rot,-1.5deg));box-shadow:0 22px 34px -20px rgba(4,45,31,.75),0 0 0 1px #e9e2cf}
.gk-f-polaroid::before{content:"";position:absolute;left:50%;top:-12px;width:84px;height:24px;margin-left:-42px;background:#e9c46acc;transform:rotate(-3deg);box-shadow:0 2px 6px #0003;z-index:3}
.gk-f-polaroid .gk-foto{box-shadow:inset 0 0 0 1px #0002}
.gk-cap{position:absolute;left:14px;right:14px;bottom:14px;text-align:center;font:italic 600 1.02rem/1.3 var(--pd-serif,'Playfair Display',Georgia,serif);color:#3b3524;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gk:hover .gk-f-polaroid{transform:rotate(0deg) translateY(-8px)}
/* 3. Kaca Zamrud */
.gk-f-kaca{padding:9px;border-radius:24px;background:linear-gradient(145deg,#0f9a6b,#064b32 60%,#042d1f);box-shadow:0 0 0 1px #e9c46a,0 0 0 6px #0b6a4530,0 26px 40px -22px rgba(4,45,31,.8)}
.gk-f-kaca::after{content:"";position:absolute;inset:0;border-radius:24px;pointer-events:none;background:linear-gradient(125deg,#ffffff40 0,transparent 32%);}
.gk-f-kaca .gk-foto{border-radius:16px}
/* 4. Ornamen Islami */
.gk-f-ornamen{padding:19px;border-radius:6px;background:linear-gradient(145deg,#064b32,#032619);box-shadow:inset 0 0 0 1.5px #e9c46a,inset 0 0 0 6px #032619,inset 0 0 0 7px #e9c46a66,0 26px 40px -22px rgba(4,45,31,.85)}
.gk-f-ornamen .gk-foto{box-shadow:0 0 0 1.5px #e9c46a}
.gk-f-ornamen .gk-s{display:block;position:absolute;width:17%;max-width:58px;aspect-ratio:1;background:url(../bingkai/bawaan/sudut.svg) center/contain no-repeat;z-index:3}
.gk-f-ornamen .gk-s.a{left:3px;top:3px}.gk-f-ornamen .gk-s.b{right:3px;top:3px;transform:rotate(90deg)}.gk-f-ornamen .gk-s.c{right:3px;bottom:3px;transform:rotate(180deg)}.gk-f-ornamen .gk-s.d{left:3px;bottom:3px;transform:rotate(270deg)}
/* 5. Roll Film */
.gk-f-film{padding:30px 13px;border-radius:6px;background:#0c0c0c;box-shadow:0 22px 34px -20px #000c}
.gk-f-film::before,.gk-f-film::after{content:"";position:absolute;left:9px;right:9px;height:11px;border-radius:2px;background:repeating-linear-gradient(90deg,#f3efe0 0 13px,transparent 13px 28px);opacity:.92}
.gk-f-film::before{top:10px}.gk-f-film::after{bottom:10px}
.gk-f-film .gk-foto{filter:sepia(.35) contrast(1.06);transition:filter .6s}
.gk:hover .gk-f-film .gk-foto{filter:none}
/* 6. Lengkung Masjid */
.gk-f-lengkung{padding:10px;border-radius:50% 50% 14px 14px/37% 37% 14px 14px;background:linear-gradient(160deg,#f6e3a1,#b8892b 35%,#fff3c4 55%,#b8892b 80%);box-shadow:0 26px 40px -22px rgba(4,45,31,.8)}
.gk-f-lengkung .gk-foto{aspect-ratio:3/4;border-radius:50% 50% 8px 8px/37% 37% 8px 8px;border:5px solid #fbf6e4}
.gk-f-lengkung .gk-foto img{height:100%;object-fit:cover}
/* 7. Kustom (berkas di assets/bingkai/) */
.gk-f-kustom{padding:var(--pad,8%);background:none}
.gk-f-kustom .gk-overlay{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;z-index:4}
.gk:hover .gk-bk:not(.gk-f-polaroid){transform:translateY(-7px)}

/* ---------- Hero: jendela kenangan (lengkungan masjid, fanous, bintang khatam) ---------- */
.hzs-galeri{background:radial-gradient(560px 480px at 80% 30%,#e9c46a47,transparent 70%),radial-gradient(640px 520px at 0 100%,#d9772b26,transparent 70%),radial-gradient(500px 400px at 40% 0,#0f9a6b40,transparent 70%),linear-gradient(135deg,#032619 0%,#064b32 58%,#0b7a4d 130%)}
.hzs-galeri .hz-latar{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cg fill='none' stroke='%23e9c46a' stroke-opacity='.16' stroke-width='1'%3E%3Crect x='21' y='21' width='42' height='42'/%3E%3Crect x='21' y='21' width='42' height='42' transform='rotate(45 42 42)'/%3E%3Ccircle cx='42' cy='42' r='13'/%3E%3Cpath d='M0 0l21 21M84 0L63 21M0 84l21-21M84 84L63 63'/%3E%3C/g%3E%3C/svg%3E") 0 0/84px;-webkit-mask-image:radial-gradient(ellipse 70% 90% at 78% 40%,#000 15%,transparent 75%);mask-image:radial-gradient(ellipse 70% 90% at 78% 40%,#000 15%,transparent 75%);animation:ghGeserPola 90s linear infinite}
.gh-siluet{position:absolute;z-index:-1;left:0;right:0;bottom:4.2rem;width:100%;height:112px;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 45%);mask-image:linear-gradient(180deg,transparent,#000 45%)}
.gh-bintang{position:absolute;z-index:-1;width:6px;height:6px;border-radius:50%;background:var(--gk-emas2);box-shadow:0 0 12px var(--gk-emas),0 0 28px #e9c46a99;animation:ghKelip 4s ease-in-out infinite}
.gh-bintang.b2{width:3px;height:3px;box-shadow:0 0 8px var(--gk-emas)}
.gh-aksi{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.gh-btn{display:inline-flex;align-items:center;gap:.55rem;padding:.8rem 1.6rem;border-radius:999px;border:1.5px solid transparent;cursor:pointer;font:700 .95rem 'DM Sans',sans-serif;color:#2f2200;background:linear-gradient(135deg,#f6e3a1,#e9c46a);transition:transform .3s,box-shadow .3s,background .3s}
.gh-btn:hover{transform:translateY(-3px);box-shadow:0 14px 26px -12px #e9c46a}
.gh-btn.garis{background:#ffffff10;color:#fff;border-color:#e9c46a88;backdrop-filter:blur(6px)}
.gh-btn.garis:hover{background:#e9c46a22;box-shadow:none}

.gh-dinding{position:relative;justify-self:end;width:min(100%,470px);aspect-ratio:1/1.1}
/* cincin bintang khatam */
.gh-khatam{position:absolute;z-index:0;left:-4%;top:2%;width:100%;aspect-ratio:1;transform:translate(var(--mx,0),var(--my,0));opacity:.9}
.gh-khatam svg{display:block;width:100%;height:100%;animation:ghPutar 110s linear infinite}
/* lampu fanous */
.gh-fanus{position:absolute;z-index:4;top:-9%;transform-origin:50% 0;animation:ghAyun 6.5s ease-in-out infinite;filter:drop-shadow(0 0 16px #e9c46a99)}
.gh-fanus svg{display:block;width:100%;height:auto}
.gh-fanus.f1{left:2%;width:54px}
.gh-fanus.f2{right:9%;width:44px;top:-12%;animation-duration:7.8s;animation-delay:-2.4s}
.gh-nyala{animation:ghNyala 2.6s ease-in-out infinite;transform-origin:30px 112px}
/* lengkungan masjid berbingkai emas */
.gh-lengkung{position:absolute;z-index:2;left:15%;top:10%;width:62%;aspect-ratio:3/4.05;padding:9px;border-radius:50% 50% 16px 16px/34% 34% 16px 16px;background:linear-gradient(160deg,#f6e3a1,#b8892b 30%,#fff3c4 52%,#b8892b 78%,#e9c46a);box-shadow:0 0 0 1px #fff3c466,0 0 70px #e9c46a50,0 40px 60px -28px #000d;transform:translate(var(--mx,0),var(--my,0));animation:ghApung 9s ease-in-out infinite}
.gh-lengkung::after{content:"";position:absolute;inset:4px;border-radius:inherit;border:1px solid #fff8;pointer-events:none}
.gh-lk-isi{position:relative;display:block;width:100%;height:100%;overflow:hidden;border-radius:50% 50% 8px 8px/34% 34% 8px 8px;background:#052e22;box-shadow:inset 0 0 0 3px #fbf6e4,inset 0 6px 22px #0007}
.gh-lk-isi>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.gh-lk-isi img.gh-s{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.02);transition:opacity 1.4s ease}
.gh-lk-isi img.gh-s.aktif{opacity:1;animation:ghZoom 9s ease-out forwards}
.gh-lk-kilap{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 38%,#ffffff40 50%,transparent 62%);transform:translateX(-130%);animation:ghKilap 7s 1.5s ease-in-out infinite}
.gh-kunci{position:absolute;z-index:5;left:50%;top:-15px;width:30px;height:30px;margin-left:-15px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#fff3c4,#e9c46a);color:#3a2c00;font-style:normal;font-size:.95rem;box-shadow:0 0 0 3px #064b32,0 0 18px #e9c46a}
/* adegan: bintang, burung, cahaya */
.gh-st{animation:ghKelip 3.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.gh-kipas{transform-origin:150px 318px;animation:ghPutar 120s linear infinite}
.gh-b{animation:ghTerbang 16s linear infinite}
.gh-jendela{animation:ghJendela 5s ease-in-out infinite}
/* polaroid bergambar */
.gh-pol{position:absolute;z-index:3;padding:9px 9px 0;border-radius:3px;background:#fffdf5;box-shadow:0 26px 40px -20px #000d,0 0 0 1px #e9e2cf;transform:translate(var(--mx,0),var(--my,0)) rotate(var(--r,0deg));animation:ghApung 8s ease-in-out infinite;animation-delay:var(--d,0s)}
.gh-pol::before{content:"";position:absolute;left:50%;top:-11px;width:62px;height:22px;margin-left:-31px;background:#e9c46acc;transform:rotate(-3deg);box-shadow:0 2px 6px #0003}
.gh-pol-foto{display:block;aspect-ratio:4/3;overflow:hidden;background:#0b3b2a;box-shadow:inset 0 0 0 1px #0002}
.gh-pol-foto svg,.gh-pol-foto img{display:block;width:100%;height:100%;object-fit:cover}
.gh-pol-cap{display:block;padding:.5rem .2rem .6rem;text-align:center;font:italic 600 .92rem/1.25 var(--pd-serif,'Playfair Display',Georgia,serif);color:#3b3524;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gh-p1{left:-9%;bottom:-4%;width:36%;--r:-7deg;--d:-3s}
.gh-p2{right:-7%;top:41%;width:32%;--r:6deg;--d:-5s}
.gh-lencana{position:absolute;z-index:4;right:1%;bottom:-3%;display:flex;align-items:center;gap:.6rem;padding:.6rem 1rem .6rem .7rem;border-radius:16px;background:#fff;color:#042d1f;box-shadow:0 22px 40px -18px #000c;animation:ghApung 7s ease-in-out infinite -2s}
.gh-lencana b{display:block;font:700 1rem var(--pd-serif,Georgia,serif)}.gh-lencana small{color:#51677a;font-size:.74rem}
.gh-lencana i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#f6e3a1,#e9c46a);font-style:normal;font-weight:800;color:#3a2c00}

/* ---------- Album (kenangan / kegiatan / keseruan) ---------- */
.ga-album{position:relative;z-index:5;display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;max-width:1150px;margin:-4.2rem auto 3rem;padding:0 1.5rem}
.ga-tile{--ak:#0e8f63;position:relative;display:grid;grid-template-columns:118px 1fr;gap:1.2rem;align-items:center;padding:1.2rem 1.3rem 1.2rem 1.2rem;border-radius:24px;background:var(--kartu);border:1px solid var(--garis);border-top:4px solid var(--ak);box-shadow:0 30px 50px -34px rgba(4,45,31,.7);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .3s}
.ga-tile:hover{transform:translateY(-8px);box-shadow:0 40px 56px -32px rgba(4,45,31,.85)}
.ga-tile.aktif{outline:3px solid var(--gk-emas);outline-offset:3px}
.ga-mini{width:118px}.ga-mini .gk-bk{pointer-events:none}.ga-mini .gk-f-polaroid{padding:6px 6px 24px}.ga-mini .gk-cap{font-size:.62rem;bottom:5px;left:6px;right:6px}.ga-mini .gk-f-emas{padding:5px}.ga-mini .gk-f-emas .gk-foto{border-width:7px}.ga-mini .gk-f-film{padding:17px 7px}.ga-mini .gk-f-film::before,.ga-mini .gk-f-film::after{height:6px;left:5px;right:5px;background:repeating-linear-gradient(90deg,#f3efe0 0 8px,transparent 8px 17px)}.ga-mini .gk-f-film::before{top:6px}.ga-mini .gk-f-film::after{bottom:6px}.ga-mini .gk-f-ornamen{padding:11px}.ga-mini .gk-f-kaca{padding:5px;border-radius:14px}.ga-mini .gk-f-lengkung{padding:5px}
.ga-tile small{display:block;font:700 .72rem 'DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ak)}
.ga-tile h3{margin:.15rem 0 .3rem;font:700 1.45rem/1.15 var(--pd-serif,Georgia,serif);color:var(--gk-zamrud)}
.ga-tile p{margin:0 0 .6rem;font-size:.88rem;line-height:1.55;color:var(--redup)}
.ga-tile b{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .8rem;border-radius:999px;background:color-mix(in srgb,var(--ak) 14%,transparent);color:var(--ak);font-size:.8rem}
.ga-tile b em{font-style:normal;transition:transform .3s}.ga-tile:hover b em{transform:translateX(4px)}
.ga-kosong{display:grid;place-items:center;aspect-ratio:1;background:radial-gradient(circle at 30% 20%,#e9c46a55,transparent 60%),linear-gradient(135deg,#042d1f,#0b6a45)}
.ga-kosong img{width:46%;background:#fff;border-radius:50%;padding:.35rem}

/* ---------- Penyaring & kepala ---------- */
.gl-bagian{padding-top:0!important}
.gl-prog{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:0 0 2rem}
.gl-prog a{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem 1.05rem;border-radius:999px;border:1px solid var(--garis);background:var(--kartu);color:var(--teks);font:700 .86rem 'DM Sans',sans-serif;transition:.3s}
.gl-prog a b{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;padding:0 .35rem;border-radius:999px;background:#e0e8f0;color:#35506a;font-size:.72rem}
.gl-prog a:hover{border-color:var(--gk-emas);transform:translateY(-2px)}
.gl-prog a.aktif{background:linear-gradient(135deg,#042d1f,#0b6a45);border-color:#042d1f;color:var(--gk-emas2)}.gl-prog a.aktif b{background:var(--gk-emas);color:#3a2c00}
.gl-kepala{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:2rem;padding-bottom:.9rem;border-bottom:1px solid var(--garis);position:relative}
.gl-kepala::after{content:"";position:absolute;left:0;bottom:-1px;width:84px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--gk-emas),var(--gk-emas2))}
.gl-kepala h2{margin:0!important;font:700 clamp(1.5rem,2.8vw,2rem)/1.2 var(--pd-serif,Georgia,serif);color:var(--gk-zamrud)}
.gl-kepala h2::after{display:none!important}.gl-kepala span{color:var(--redup);font-size:.92rem}

/* ---------- Dinding foto ---------- */
.gk-grid{columns:3 280px;column-gap:2.2rem}
.gk{--rot:-1.5deg;margin:0 0 2.6rem;break-inside:avoid;cursor:zoom-in;outline:none}
.gk:nth-child(3n+2){--rot:1.8deg}.gk:nth-child(3n){--rot:-.6deg}
.gk-js .gk{opacity:0;transform:translateY(34px) scale(.97);transition:opacity .9s var(--tunda,0s),transform .9s var(--tunda,0s) cubic-bezier(.2,.8,.2,1)}
.gk-js .gk.tampil{opacity:1;transform:none}
.gk:focus-visible .gk-bk{outline:3px solid var(--gk-emas);outline-offset:6px}
.gk figcaption{display:grid;gap:.45rem;justify-items:center;margin-top:1.2rem;text-align:center}
.gk-meta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem .6rem;font-size:.76rem;font-weight:700;color:var(--redup)}
.gk-kat{display:inline-flex;align-items:center;gap:.4rem;padding:.15rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--ak,#0e8f63) 14%,transparent);color:var(--ak,#0e8f63)}
.gk-kat::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ak,#0e8f63)}
.gk-ket{font:600 1.04rem/1.4 var(--pd-serif,Georgia,serif);color:var(--gk-zamrud)}
.gk-f-polaroid~figcaption .gk-ket{display:none}
.gk[data-bingkai=polaroid] .gk-ket{display:none}
.gk-bintang{position:absolute;z-index:6;top:-8px;right:-8px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#f6e3a1,#e9c46a);color:#3a2c00;font-size:1rem;box-shadow:0 8px 16px -6px #0008}
.gl-hal{display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;margin-top:2.4rem}
.gl-hal a,.gl-hal span{display:grid;place-items:center;min-width:44px;height:44px;padding:0 .9rem;border-radius:14px;border:1px solid var(--garis);background:var(--kartu);color:var(--teks);font:700 .92rem 'DM Sans',sans-serif;transition:.3s}
.gl-hal a:hover{border-color:var(--gk-emas);transform:translateY(-3px)}.gl-hal .aktif{background:linear-gradient(135deg,#042d1f,#0b6a45);border-color:#042d1f;color:var(--gk-emas2)}.gl-hal span{border:0;background:none;min-width:auto}
.gl-kosong{max-width:560px;margin:2rem auto;padding:2.6rem 1.5rem;text-align:center;border:1.5px dashed var(--gk-emas);border-radius:26px;background:var(--kartu);color:var(--redup)}
.gl-kosong b{display:block;margin-bottom:.4rem;font:700 1.35rem var(--pd-serif,Georgia,serif);color:var(--gk-zamrud)}

/* ---------- Lightbox ---------- */
.gl-lb{position:fixed;inset:0;z-index:95;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(circle at 50% 35%,#0b3a29f5,#020c08fb);backdrop-filter:blur(8px);animation:glMasuk .4s both}
.gl-lb[hidden]{display:none}
.gl-atas{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.4rem;color:#d7efe3}
.gl-hitung{font:700 .9rem ui-monospace,monospace;letter-spacing:.1em;color:var(--gk-emas)}
.gl-alat{display:flex;gap:.5rem}
.gl-alat button,.gl-alat a{display:grid;place-items:center;min-width:42px;height:42px;padding:0 .9rem;border-radius:999px;border:1px solid #e9c46a66;background:#ffffff0f;color:#fff;font:700 .88rem 'DM Sans',sans-serif;cursor:pointer;transition:.3s}
.gl-alat button:hover,.gl-alat a:hover{background:var(--gk-emas);color:#2f2200;border-color:var(--gk-emas)}
.gl-alat .main{background:#e9c46a22}
.gl-panggung{position:relative;display:grid;place-items:center;padding:0 4.5rem;min-height:0;overflow:hidden}
.gl-kartu{width:fit-content;max-width:100%;animation:glFoto .55s cubic-bezier(.2,.8,.2,1) both}
.gl-kartu .gk-bk{width:fit-content;max-width:100%;transform:none!important}
.gl-kartu .gk-foto{width:fit-content;max-width:100%}
.gl-kartu .gk-foto img{width:auto;height:auto;max-width:min(88vw,1000px);max-height:62vh;margin:auto;object-fit:contain}
.gl-kartu .gk-f-lengkung .gk-foto{aspect-ratio:auto}.gl-kartu .gk-f-lengkung .gk-foto img{height:auto}
.gl-kartu .gk-foto::after{display:none}
.gl-nav{position:absolute;top:50%;translate:0 -50%;width:52px;height:52px;border-radius:50%;border:1px solid #e9c46a88;background:#032419cc;color:var(--gk-emas2);font-size:1.8rem;line-height:1;cursor:pointer;transition:.3s;z-index:4}
.gl-nav:hover{background:var(--gk-emas);color:#2f2200;transform:scale(1.1)}.gl-nav.k{left:1rem}.gl-nav.n{right:1rem}
.gl-bawah{display:grid;gap:.5rem;justify-items:center;padding:.4rem 1.4rem 1.6rem;text-align:center;color:#e3f4ea}
.gl-bawah .gk-meta{color:#b8d9c6}.gl-bawah .gk-kat{background:#e9c46a22;color:var(--gk-emas2)}.gl-bawah .gk-kat::before{background:var(--gk-emas)}
.gl-judul{font:italic 600 clamp(1.1rem,2.2vw,1.5rem)/1.4 var(--pd-serif,Georgia,serif);color:#fff;max-width:60ch;min-height:1.4em}
.gl-progres{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffff1a;opacity:0;transition:opacity .3s}.gl-lb.putar .gl-progres{opacity:1}
.gl-progres i{display:block;height:100%;width:0;background:linear-gradient(90deg,#e9c46a,#5eead4)}
.gl-lb.putar .gl-progres i{animation:glIsi var(--dur,4.5s) linear forwards}
body.gl-kunci{overflow:hidden}

/* ---------- Gerak ---------- */
@keyframes ghApung{0%,100%{translate:0 0}50%{translate:0 -13px}}
@keyframes ghZoom{to{transform:scale(1.12)}}
@keyframes ghPutar{to{rotate:360deg}}
@keyframes ghGeserPola{to{background-position:84px 84px}}
@keyframes ghAyun{0%,100%{rotate:-5deg}50%{rotate:5deg}}
@keyframes ghNyala{0%,100%{opacity:.8;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}
@keyframes ghKilap{0%,60%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
@keyframes ghTerbang{from{translate:-40px 0}to{translate:340px -34px}}
@keyframes ghJendela{0%,100%{opacity:1}50%{opacity:.72}}
@keyframes ghKelip{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.4)}}
@keyframes glMasuk{from{opacity:0}}
@keyframes glFoto{from{opacity:0;transform:translateY(26px) scale(.94)}}
@keyframes glIsi{to{width:100%}}

/* ---------- Tema gelap ---------- */
:root[data-tema=gelap] .ga-tile,:root[data-tema=gelap] .gl-prog a,:root[data-tema=gelap] .gl-hal a,:root[data-tema=gelap] .gl-kosong{background:#0e2a20;border-color:#1d4a38}
:root[data-tema=gelap] .ga-tile h3,:root[data-tema=gelap] .gl-kepala h2,:root[data-tema=gelap] .gk-ket,:root[data-tema=gelap] .gl-kosong b{color:#f6e3a1}
:root[data-tema=gelap] .ga-tile p,:root[data-tema=gelap] .gk-meta{color:#b9d0c4}
:root[data-tema=gelap] .gl-prog a{color:#e3efe8}:root[data-tema=gelap] .gl-prog a b{background:#17392c;color:#a8d5bf}
:root[data-tema=gelap] .gk-f-polaroid{background:#f3eee0}

/* ---------- Layar kecil ---------- */
@media(max-width:900px){
  .gh-dinding{justify-self:center;width:min(88%,380px)}
  .ga-album{grid-template-columns:1fr;margin-top:-3.4rem;gap:1rem}
}
@media(max-width:640px){
  .gk-grid{columns:2 150px;column-gap:1.2rem}.gk{margin-bottom:1.8rem}
  .gk-f-emas{padding:6px}.gk-f-emas .gk-foto{border-width:8px}.gk-f-polaroid{padding:8px 8px 46px}.gk-cap{font-size:.84rem;bottom:11px}.gk-f-ornamen{padding:13px}.gk-f-film{padding:24px 9px}.gk-ket{font-size:.92rem}
  .gl-panggung{padding:0 .6rem}.gl-nav{top:auto;bottom:-.2rem;translate:0 0;width:46px;height:46px}.gl-nav.k{left:1rem}.gl-nav.n{right:1rem}
  .gl-kartu .gk-foto img{max-height:56vh}.gl-bawah{padding-bottom:3.6rem}
  .gh-lencana{display:none}
  .gh-siluet{height:76px}
  .gh-fanus{top:-3%}.gh-fanus.f2{top:-5%}
  .gh-p1{width:34%;left:-6%}.gh-p2{width:30%;right:-5%}
  .gh-pol-cap{font-size:.78rem}
}
@media(prefers-reduced-motion:reduce){
  .gh-lengkung,.gh-pol,.gh-lencana,.gh-bintang,.gh-fanus,.gh-khatam svg,.gh-kipas,.gh-b,.gh-st,.gh-jendela,.gh-nyala,.gh-lk-kilap,.hzs-galeri .hz-latar,.gh-lk-isi img.gh-s.aktif{animation:none!important}
  .gk-js .gk{opacity:1;transform:none;transition:none}.gk-foto img,.gk-foto::after,.gk-bk,.ga-tile{transition:none!important}
  .gl-lb,.gl-kartu{animation:none}
}