/* ==================== LUCKY DRAW ==================== */
.lk{min-height:100vh;background:#F2F6F1;padding-bottom:24px}
.lk-atas{position:sticky;top:0;z-index:9;display:flex;align-items:center;gap:10px;padding:11px 14px;background:#0A4A2E;color:#fff;box-shadow:0 2px 10px rgba(6,60,38,.28)}
.lk-atas b{font-size:15.5px;font-weight:800}
.lk-balik{display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,255,255,.15);color:#fff}
.lk-hero{position:relative;overflow:hidden;padding:14px 12px 26px;text-align:center;color:#fff;background:radial-gradient(125% 85% at 50% 0,#1A8C5E 0,#0E6B45 44%,#083A24 100%)}
.lk-hero::after{content:'';position:absolute;left:50%;bottom:-40px;width:160%;height:130px;transform:translateX(-50%);border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,0))}
.lk-lentera{position:absolute;top:0;width:33px;opacity:.88;filter:drop-shadow(0 4px 7px rgba(0,0,0,.3))}
.lk-lentera.ki{left:6px}.lk-lentera.ka{right:6px}
.lk-brand{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:9px;margin:2px 0 10px}
.lk-brand img,.lk-brand svg{height:32px;width:auto}
.lk-brand-l{font-size:17px;font-weight:900;line-height:1;text-align:left}
.lk-brand-l i{font-style:normal;color:#F5A623}
.lk-brand-l span{display:block;margin-top:2px;font-size:8.6px;letter-spacing:3.2px;color:#FFD76A}
.lk-sapa{position:relative;z-index:2;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:700;font-size:19px;color:#FFE9A8;text-shadow:0 2px 0 rgba(0,0,0,.28)}
.lk-j1,.lk-j2{position:relative;z-index:2;font-weight:900;line-height:.97;letter-spacing:.3px}
.lk-j1{font-size:43px;color:#F7B733;text-shadow:0 3px 0 #A9640F,0 7px 13px rgba(0,0,0,.38)}
.lk-j2{font-size:39px;color:#fff;text-shadow:2px 2px 0 #C0392B,-2px -2px 0 #C0392B,2px -2px 0 #C0392B,-2px 2px 0 #C0392B,0 8px 14px rgba(0,0,0,.35)}
@media (max-width:370px){.lk-j1{font-size:35px}.lk-j2{font-size:32px}.lk-sapa{font-size:17px}}
.lk-ribon{position:relative;z-index:2;max-width:330px;margin:11px auto 0;padding:8px 12px;border-radius:12px;border:2px solid #F2C14E;background:linear-gradient(180deg,#12874A,#0A4A2E);font-size:12.4px;font-weight:700;color:#FFF4D6;box-shadow:0 5px 12px rgba(0,0,0,.25)}
.lk-bulat{position:relative;z-index:2;display:grid;place-items:center;width:88px;height:88px;margin:12px auto 0;border-radius:50%;border:2px solid #FFD76A;background:radial-gradient(circle at 38% 28%,#E8452C,#A81F16);box-shadow:0 7px 16px rgba(0,0,0,.32);font-size:9.4px;font-weight:800;line-height:1.25;color:#fff}
.lk-bulat b{display:block;font-size:11.4px;color:#FFE9A8}
.lk-coret{position:relative;z-index:2;display:flex;justify-content:space-between;gap:8px;margin:12px 2px 0}
.lk-coret span{flex:1;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:700;font-size:12.4px;line-height:1.35;color:#FFE9A8;text-align:center}
/* ---------- panggung roda ---------- */
.lk-panggung{position:relative;z-index:3;width:min(89vw,364px);aspect-ratio:1/1;margin:16px auto 0}
.lk-cahaya{position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,rgba(255,214,106,.5),rgba(255,214,106,0) 63%);animation:lk-sinar 2.8s ease-in-out infinite}
.lk-cincin{position:absolute;inset:0;border-radius:50%;background:linear-gradient(150deg,#FFE59A,#E8A72B 46%,#A9640F);box-shadow:0 14px 30px rgba(4,32,20,.42)}
.lk-bohlam{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px;border-radius:50%;background:#FFF8DC;box-shadow:0 0 9px 3px rgba(255,236,170,.9);animation:lk-bohlam 1.5s infinite}
.lk-roda{position:absolute;inset:11px;border-radius:50%;overflow:hidden;will-change:transform}
.lk-seg{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,#0E6B45 0deg 60deg,#F2C14E 60deg 120deg);box-shadow:inset 0 0 0 3px rgba(255,255,255,.55)}
.lk-hi{position:absolute;left:50%;bottom:50%;width:48%;height:45%;margin-left:-24%;transform-origin:50% 100%;transform:rotate(var(--a))}
.lk-hi-in{display:flex;flex-direction:column;align-items:center;gap:1px;transform:rotate(calc(-1 * var(--a)))}
.lk-hi svg{width:45px;height:45px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.22))}
.lk-hi-in span{font-size:9.8px;font-weight:800;line-height:1.05;text-align:center;color:#08281A;max-width:100%}
.lk-penunjuk{position:absolute;left:50%;top:-5px;width:0;height:0;margin-left:-12px;border-left:12px solid transparent;border-right:12px solid transparent;border-top:24px solid #D8382A;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4));z-index:5}
.lk-tengah{position:absolute;left:50%;top:50%;width:31%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 38% 28%,#FFF6DC,#F2C14E 62%,#D9A32B);box-shadow:0 7px 15px rgba(0,0,0,.3),inset 0 0 0 3px rgba(255,255,255,.65);z-index:4;font-size:11.6px;font-weight:900;line-height:1.05;color:#0A4A2E}
.lk-tengah svg{width:20px;height:20px;margin-top:1px}
@keyframes lk-sinar{0%,100%{opacity:.55;transform:scale(.97)}50%{opacity:1;transform:scale(1.03)}}
@keyframes lk-bohlam{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes lk-pop{0%{transform:scale(.7);opacity:0}100%{transform:scale(1);opacity:1}}
/* ---------- tombol & status ---------- */
.lk-tombol{position:relative;z-index:3;display:block;width:min(82vw,320px);margin:18px auto 0;padding:15px 16px;border:0;border-radius:16px;font-size:16.5px;font-weight:900;letter-spacing:.6px;text-transform:uppercase;color:#3A2200;background:linear-gradient(180deg,#FFE39A,#F2B02A 56%,#D98F14);box-shadow:0 8px 0 #A96A0C,0 13px 22px rgba(0,0,0,.32)}
.lk-tombol:active{transform:translateY(3px);box-shadow:0 5px 0 #A96A0C,0 8px 16px rgba(0,0,0,.3)}
.lk-tombol[disabled]{filter:saturate(.55);opacity:.8;box-shadow:0 6px 0 #7A5A20}
.lk-tombol.abu{background:linear-gradient(180deg,#E7EEE9,#CBD9D0);color:#4A5C52;box-shadow:0 6px 0 #A9BBB0}
.lk-status{position:relative;z-index:3;width:min(88vw,340px);margin:14px auto 0;padding:12px;border-radius:14px;background:rgba(4,32,20,.28);border:1px solid rgba(255,214,106,.5);color:#FFF6DE;text-align:center;font-size:12.6px;line-height:1.55}
.lk-status b{color:#FFD76A}
.lk-chip{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.lk-chip span{padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,214,106,.45);font-size:11.4px;font-weight:700;color:#FFF4D6}
/* ---------- bagian isi ---------- */
.lk-sec{margin:14px 12px 0;padding:14px;border-radius:16px;background:#fff;box-shadow:0 4px 14px rgba(8,60,38,.09)}
.lk-sec h3{display:flex;align-items:center;gap:8px;margin:0 0 11px;font-size:15px;font-weight:800;color:#0E6B45}
.lk-sec h3 i{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;background:#E9F5EE;color:#0E6B45}
.lk-cara{display:grid;gap:10px}
.lk-cara-i{display:flex;gap:10px;align-items:flex-start}
.lk-cara-n{flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:linear-gradient(180deg,#18875B,#0A4A2E);color:#fff;font-size:12.6px;font-weight:800}
.lk-cara-i p{margin:0;font-size:12.8px;line-height:1.5;color:#3A4A42}
.lk-lis{display:grid;gap:8px}
.lk-lis-i{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:#F6FAF7;border:1px solid #E3EFE7}
.lk-lis-i svg{width:30px;height:30px;flex:0 0 auto;border-radius:8px;background:#EAF4EE;padding:2px}
.lk-lis-i b{font-size:12.6px;font-weight:700;color:#16233F}
.lk-cek{margin-left:auto;color:#0E6B45;flex:0 0 auto}
.lk-riw-i{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;background:#FFFDF5;border:1px dashed #E7CB8A}
.lk-riw-i b{display:block;font-size:12.6px;font-weight:800;color:#16233F}
.lk-riw-i small{font-size:10.8px;color:#7A8A80}
.lk-riw-k{margin-left:auto;font-family:ui-monospace,Menlo,monospace;font-size:11px;font-weight:700;color:#8A6A16;text-align:right}
.lk-riw-i svg{width:28px;height:28px;flex:0 0 auto;border-radius:8px;background:#F2F7F3;padding:2px}
.lk-kosong{margin:0;font-size:12.4px;color:#7A8A80;text-align:center}
/* ---------- jendela hasil ---------- */
.lk-tirai{position:fixed;inset:0;z-index:60;display:none;place-items:center;padding:18px;background:rgba(4,32,20,.66)}
.lk-tirai.on{display:grid}
.lk-kotak{width:100%;max-width:340px;border-radius:20px;background:#fff;overflow:hidden;text-align:center;box-shadow:0 22px 50px rgba(0,0,0,.45);animation:lk-pop .36s cubic-bezier(.2,1.4,.5,1)}
.lk-kotak-atas{padding:15px 14px 12px;background:radial-gradient(120% 100% at 50% 0,#18875B,#0A4A2E);color:#fff}
.lk-kotak-atas b{display:block;font-size:19px;font-weight:900;color:#FFD76A}
.lk-kotak-atas p{margin:4px 0 0;font-size:12px;color:#D9EDE2}
.lk-kotak-isi{padding:14px 14px 4px}
.lk-besar{width:94px;height:94px;margin:0 auto 9px;display:grid;place-items:center;border-radius:50%;background:#FFF9EA;box-shadow:inset 0 0 0 3px #F2C14E}
.lk-besar svg{width:62px;height:62px}
.lk-nama-h{font-size:15.6px;font-weight:900;line-height:1.3;color:#16233F}
.lk-kode{margin:10px auto 0;padding:9px 12px;border-radius:12px;background:#F3F7F4;border:1.5px dashed #A9CBB8;font-family:ui-monospace,Menlo,monospace;font-size:14px;font-weight:700;letter-spacing:.4px;color:#0E6B45}
.lk-ket{margin:9px 0 0;font-size:11.7px;line-height:1.5;color:#5A6B62}
.lk-aksi{display:grid;gap:8px;padding:12px 14px 16px}
/* ---------- kartu pintasan di beranda ---------- */
.card.lucky{background:linear-gradient(135deg,#12874A 0%,#0E6B45 55%,#0A4A2E 100%);border:0;color:#fff}
.card.lucky .k-head b{color:#fff}
.card.lucky .k-head .cap{color:#FFD76A;white-space:nowrap;font-weight:700}
.card.lucky .k-head svg{color:#FFD76A}
.card.lucky p.muted{color:#DDEFE4}
.card.lucky .btn.hijau{background:linear-gradient(180deg,#FFDE8A,#F2B02A 60%,#DE9414);color:#3A2200;box-shadow:0 3px 0 #A96A0C}