@import url("_ev.css");
/* ==========================================================
   DInvite — Tema "Luar Angkasa" (koleksi Acara Spesial · Ulang Tahun Anak)
   Petualangan ke luar angkasa: roket yang meluncur, planet bercincin yang melayang, bintang berkelip, dan jendela foto bulat seperti kapal antariksa.
   Ilustrasi dari evkit.js, susunan di evangkasa.js.
   ========================================================== */
.t-evangkasa { --bg:#14163a; --card:rgba(255,255,255,.07); --ink:#f5f5ff; --muted:#b9bce6; --line:rgba(255,255,255,.16); --accent:#ff6b4a; --accent-2:#4ecdc4; --on-accent:#fff; --hero-rgb:13,15,43; --tint-a:.5; --hero-ink:#f5f5ff; --deep:#0b0c24; --soft:#24275a; --field:rgba(255,255,255,.07); --foot-brand:#f5f5ff;--k1:#ff6b4a; --k2:#4ecdc4; --k3:#0d0f2b; --k4:#ffd93d; --k5:#7b6cf6; --k6:#f5f5ff;--fn:'Bungee', sans-serif; --fh:'Bungee', sans-serif; --fb:'Quicksand', sans-serif; --fn-w:400; --fn-k:.62; --fh-w:400; --card-r:20px; --cd-r:50%; --badge-bg:var(--k4); --badge-ink:#0d0f2b; color-scheme: dark; }
body.t-evangkasa .page { background: radial-gradient(circle, rgba(255,255,255,.8) 1px, transparent 1.5px) 0 0 / 44px 44px, radial-gradient(circle, rgba(255,255,255,.5) 1px, transparent 1.5px) 22px 30px / 70px 70px, radial-gradient(80% 50% at 80% 10%, rgba(123,108,246,.4), transparent 70%), #14163a; }
.t-evangkasa .cover, .t-evangkasa .hero, .t-evangkasa .aside, .t-evangkasa .sec--closing, body.t-evangkasa .cover.has-photo, body.t-evangkasa .hero.has-photo, body.t-evangkasa .aside.has-photo { background: radial-gradient(circle, rgba(255,255,255,.8) 1px, transparent 1.5px) 0 0 / 44px 44px, radial-gradient(circle, rgba(255,255,255,.5) 1px, transparent 1.5px) 22px 30px / 70px 70px, radial-gradient(80% 50% at 80% 10%, rgba(123,108,246,.4), transparent 70%), #14163a; color: var(--ink); }
.t-evangkasa .sec--tint, .t-evangkasa .sec--countdown { background: linear-gradient(var(--soft), var(--soft)); }
.t-evangkasa .cover, body.t-evangkasa .cover.has-photo { place-items: center; overflow: hidden; }
.t-evangkasa .cover__inner { gap: .5rem; max-width: 340px; }
.t-evangkasa .hero, .t-evangkasa .aside, body.t-evangkasa .cover.has-photo, body.t-evangkasa .hero.has-photo, body.t-evangkasa .aside.has-photo { min-height: 100svh; place-items: center; padding: 4rem 1.6rem; overflow: hidden; }
.t-evangkasa .sec--closing { overflow: hidden; padding-block: 6rem 9rem; }
.t-evangkasa .cover__to small { color: var(--muted); }
.t-evangkasa .cover__to strong { font: 700 1.4rem/1.2 var(--fh); color: var(--ink); }
.t-evangkasa .cover .ek-frame { animation: evUp 1s var(--ease) .2s both; }
.t-evangkasa .cover .names { animation: evUp 1.1s var(--ease) .45s both; }
.t-evangkasa .cover .cover__date, .t-evangkasa .cover .cover__to { animation: evUp 1s var(--ease) .65s both; }
.t-evangkasa .cover .ibtn { animation: evUp 1s var(--ease) .85s both; }
body.t-evangkasa:not(.is-locked) .hero .ek-frame { animation: evUp 1.1s var(--ease) .2s both; }
body.t-evangkasa .sec--tint .event p, body.t-evangkasa .sec--tint .event small, body.t-evangkasa .sec--tint .event span { color: var(--muted); }
@media (max-height: 760px) { .t-evangkasa .cover .ek-frame { --fw: min(124px, 34vw); } .t-evangkasa .cover .ev-badge { --bw: 74px; } .t-evangkasa .cover__to small:last-child { display: none; } .t-evangkasa .cover__inner { gap: .3rem; } }

.t-evangkasa .cover, body.t-evangkasa .cover.has-photo { padding: 3rem 1.6rem; }
body.t-evangkasa .names { color: var(--k4); text-shadow: 0 0 20px rgba(255,217,61,.35) !important; line-height: 1.15; }
body.t-evangkasa .names i { color: var(--k2); font-style: normal; }
body.t-evangkasa .kicker { color: var(--k2); }
.t-evangkasa .ek-frame { --frame-bg: radial-gradient(circle at 40% 35%, #2f3380, #14163a); --frame-sh: 0 0 0 8px #c9cbe0, 0 0 0 12px #8a8db3, 0 0 0 14px #c9cbe0, 0 0 40px 10px rgba(78,205,196,.25); }
.t-evangkasa .ek-frame::before { content: ''; position: absolute; inset: -14px; border-radius: 50%; background: radial-gradient(circle at 50% 3%, #ff6b4a 0 3px, transparent 4px), radial-gradient(circle at 97% 50%, #ff6b4a 0 3px, transparent 4px), radial-gradient(circle at 50% 97%, #ff6b4a 0 3px, transparent 4px), radial-gradient(circle at 3% 50%, #ff6b4a 0 3px, transparent 4px); z-index: 3; }
.t-evangkasa .cover__to { padding: .8rem 1rem; border-radius: 18px; background: rgba(255,255,255,.07); border: 1px dashed var(--line); }
.t-evangkasa .cover.is-open { transform: translateY(-110%); opacity: 1; transition: transform 1s cubic-bezier(.6,-.2,.3,1); }
body.t-evangkasa .countdown div { aspect-ratio: 1; display: grid; place-content: center; background: rgba(255,255,255,.06); border: 2px solid var(--k2); }
body.t-evangkasa .countdown b { color: var(--k4); font-family: var(--fb); font-weight: 700; }
body.t-evangkasa .event h3 { color: var(--k4); font-size: 1.4rem; }
body.t-evangkasa .ibtn--solid { background: var(--k1); }
