@import url("_ev.css");
/* ==========================================================
   DInvite — Tema "Pelangi Unicorn" (koleksi Acara Spesial · Ulang Tahun Anak)
   Dunia pastel yang ajaib: unicorn bersurai warna-warni, pelangi, awan lembut, dan kilau bintang. Manis untuk pesta ulang tahun anak perempuan.
   Ilustrasi dari evkit.js, susunan di evpelangi.js.
   ========================================================== */
.t-evpelangi { --bg:#f6efff; --card:#ffffff; --ink:#5a4a7a; --muted:#8a7ba8; --line:rgba(184,161,255,.35); --accent:#b46fe0; --accent-2:#ff8fc1; --on-accent:#fff; --hero-rgb:90,74,122; --tint-a:.3; --hero-ink:#5a4a7a; --deep:#4a3c66; --soft:#ece0ff; --field:#fffbff;--k1:#b8a1ff; --k2:#ff9ecd; --k3:#5a4a7a; --k4:#ffd56b; --k5:#8be0d6; --k6:#ffffff;--fn:'Pacifico', cursive; --fh:'Quicksand', sans-serif; --fb:'Quicksand', sans-serif; --fn-w:400; --fn-k:.9; --fh-w:700; --card-r:28px; --cd-r:50%; --badge-bg:linear-gradient(135deg, var(--k2), var(--k1)); color-scheme: light; }
body.t-evpelangi .page { background: radial-gradient(60% 40% at 15% 15%, #ffe0f0, transparent 70%), radial-gradient(60% 40% at 85% 85%, #dff7f3, transparent 70%), linear-gradient(180deg, #f6efff, #fff4fb); }
.t-evpelangi .cover, .t-evpelangi .hero, .t-evpelangi .aside, .t-evpelangi .sec--closing, body.t-evpelangi .cover.has-photo, body.t-evpelangi .hero.has-photo, body.t-evpelangi .aside.has-photo { background: radial-gradient(60% 40% at 15% 15%, #ffe0f0, transparent 70%), radial-gradient(60% 40% at 85% 85%, #dff7f3, transparent 70%), linear-gradient(180deg, #f6efff, #fff4fb); color: var(--ink); }
.t-evpelangi .sec--tint, .t-evpelangi .sec--countdown { background: linear-gradient(var(--soft), var(--soft)); }
.t-evpelangi .cover, body.t-evpelangi .cover.has-photo { place-items: center; overflow: hidden; }
.t-evpelangi .cover__inner { gap: .5rem; max-width: 340px; }
.t-evpelangi .hero, .t-evpelangi .aside, body.t-evpelangi .cover.has-photo, body.t-evpelangi .hero.has-photo, body.t-evpelangi .aside.has-photo { min-height: 100svh; place-items: center; padding: 4rem 1.6rem; overflow: hidden; }
.t-evpelangi .sec--closing { overflow: hidden; padding-block: 6rem 9rem; }
.t-evpelangi .cover__to small { color: var(--muted); }
.t-evpelangi .cover__to strong { font: 700 1.4rem/1.2 var(--fh); color: var(--ink); }
.t-evpelangi .cover .ek-frame { animation: evUp 1s var(--ease) .2s both; }
.t-evpelangi .cover .names { animation: evUp 1.1s var(--ease) .45s both; }
.t-evpelangi .cover .cover__date, .t-evpelangi .cover .cover__to { animation: evUp 1s var(--ease) .65s both; }
.t-evpelangi .cover .ibtn { animation: evUp 1s var(--ease) .85s both; }
body.t-evpelangi:not(.is-locked) .hero .ek-frame { animation: evUp 1.1s var(--ease) .2s both; }
body.t-evpelangi .sec--tint .event p, body.t-evpelangi .sec--tint .event small, body.t-evpelangi .sec--tint .event span { color: var(--muted); }
@media (max-height: 760px) { .t-evpelangi .cover .ek-frame { --fw: min(124px, 34vw); } .t-evpelangi .cover .ev-badge { --bw: 74px; } .t-evpelangi .cover__to small:last-child { display: none; } .t-evpelangi .cover__inner { gap: .3rem; } }

.t-evpelangi .cover, body.t-evpelangi .cover.has-photo { padding: 6rem 1.6rem 4rem; }
body.t-evpelangi .names { color: var(--accent); }
body.t-evpelangi .names i { color: var(--k2); font-family: var(--fn); font-style: normal; }
.t-evpelangi .ek-frame { --frame-bg: radial-gradient(circle at 40% 35%, #fff, #ece0ff); --frame-sh: 0 0 0 7px #fff, 0 0 0 11px var(--k2), 0 0 0 15px #fff, 0 0 0 18px var(--k5), 0 20px 34px -16px rgba(90,74,122,.45); }
.t-evpelangi .cover__to { padding: .8rem 1rem; border-radius: 24px; background: rgba(255,255,255,.8); }
.t-evpelangi .cover.is-open { transform: scale(1.06); opacity: 0; filter: blur(6px); transition: transform 1s ease, opacity .9s ease, filter .9s ease; pointer-events: none; }
body.t-evpelangi .countdown div { aspect-ratio: 1; display: grid; place-content: center; background: linear-gradient(135deg, #fff, var(--soft)); border: 0; }
body.t-evpelangi .countdown b { color: var(--accent); }
body.t-evpelangi .event { border: 0; background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, var(--k2), var(--k1), var(--k5)) border-box; border: 3px solid transparent; }
body.t-evpelangi .event h3 { color: var(--accent); }
body.t-evpelangi .ibtn--solid { background: linear-gradient(135deg, var(--k2), var(--k1)); }
