/* == JEMBATAN TOKEN (dihasilkan storefrontTema, jangan disunting tangan) == */
html[data-tema="kilat"]{
  --t-bg:var(--bg,#f4f6fa);--t-frame:color-mix(in srgb,var(--bg,#f4f6fa) 82%,var(--txt,#162033));
  --t-surface:var(--card,#fff);--t-field:color-mix(in srgb,var(--card,#fff) 95%,var(--txt,#162033));
  --t-fill:color-mix(in srgb,var(--card,#fff) 92%,var(--txt,#162033));--t-line:var(--line,#dfe5ee);
  --t-text:var(--txt,#162033);--t-muted:var(--muted,#667085);--t-subtle:color-mix(in srgb,var(--muted,#667085) 70%,var(--card,#fff));
  --t-on-bg:var(--txt,#162033);--t-on-bg-muted:var(--muted,#667085);
  --t-on-bg-link:color-mix(in srgb,var(--brand,#4f7cff) 78%,var(--txt,#162033));
  --t-accent:var(--brand,#4f7cff);--t-accent-d:var(--brand-d,#3959be);--t-on-accent:#fff;
  --t-accent-text:color-mix(in srgb,var(--brand,#4f7cff) 78%,var(--txt,#162033));
  --t-accent-soft:color-mix(in srgb,var(--brand,#4f7cff) 12%,var(--card,#fff));
  --t-accent-line:color-mix(in srgb,var(--brand,#4f7cff) 32%,var(--line,#dfe5ee));
  --t-deep:color-mix(in srgb,var(--brand-d,#3959be) 30%,#0b1224);--t-deep-2:color-mix(in srgb,var(--brand,#4f7cff) 38%,#101a33);
  --t-on-deep:#fff;--t-on-deep-muted:rgba(255,255,255,.74);--t-scrim:rgba(6,8,14,.64);
  --t-ok:#22a95b;--t-ok-d:#13804a;--t-ok-soft:var(--ok-bg,#e9f9ef);--t-ok-text:var(--ok-tx,#0b7a3b);
  --t-err:#e5534b;--t-err-d:#a8261e;--t-err-soft:var(--err-bg,#fdecec);--t-err-text:var(--err-tx,#b42318);
  --t-err-line:color-mix(in srgb,var(--err-tx,#b42318) 30%,var(--card,#fff));
  --t-warn-soft:color-mix(in srgb,var(--gold,#f6b60c) 16%,var(--card,#fff));--t-warn-line:color-mix(in srgb,var(--gold,#f6b60c) 42%,var(--card,#fff));
  --t-warn-text:color-mix(in srgb,var(--gold-d,#d98e00) 62%,var(--txt,#162033));
  --t-gold:var(--gold,#f6b60c);--t-gold-d:var(--gold-d,#d98e00);--t-gold-soft:color-mix(in srgb,var(--gold,#f6b60c) 34%,var(--card,#fff));
  --t-gold-text:color-mix(in srgb,var(--gold-d,#d98e00) 85%,var(--txt,#162033));--t-on-gold:#2f2200;--t-promo:#d92d83;
  --t-font:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--t-font-display:var(--t-font);
}
/* Kontrol formulir tidak mewarisi huruf; tema berhuruf sendiri butuh ini. */
html[data-tema="kilat"] :is(input,select,textarea){font-family:inherit}
/* Kaki identitas duduk di atas kanvas halaman, bukan di atas kartu, jadi
   aksennya memakai warna tautan-di-kanvas: warna merek apa adanya nyaris
   hilang di tema berkanvas gelap (Domino, Arena, Nebula). */
html[data-tema="kilat"] .ident-foot{--ident-accent:var(--t-on-bg-link)!important}
/* Baris tautan kebijakan juga duduk di kanvas, bukan di kartu. */
html[data-tema="kilat"] .ident-kebijakan a{color:var(--t-on-bg-muted)}
html[data-tema="kilat"] .ident-kebijakan a:hover{color:var(--t-on-bg-link)}
/* Cangkang halaman blog dan kebijakan: gayanya inline dan tidak memuat
   style.css, jadi permukaan dan teksnya dipetakan ke token di sini —
   sekali untuk semua tema. Isi artikel diberi panel supaya tetap terbaca
   di atas kanvas bertekstur atau gelap. */
html[data-tema="kilat"] body{color:var(--t-on-bg)}
html[data-tema="kilat"] :is(.b-title,.b-art-title,.b-lead,.b-date,.b-crumb,.b-pager-info,.b-foot){color:var(--t-on-bg)}
html[data-tema="kilat"] .b-eyebrow{background:var(--t-accent-soft);color:var(--t-accent-text)}
html[data-tema="kilat"] :is(.b-lead,.b-date,.b-pager-info,.b-crumb,.b-foot){color:var(--t-on-bg-muted)}
html[data-tema="kilat"] :is(.b-card,.b-pager a){background:var(--t-surface);border-color:var(--t-line);color:var(--t-text)}
html[data-tema="kilat"] .b-card a{color:inherit}
html[data-tema="kilat"] .b-body{padding:16px 18px;border:1px solid var(--t-line);border-radius:16px;
  background:var(--t-surface);color:var(--t-text)}
html[data-tema="kilat"] .b-body :is(h2,h3,h4,strong,b){color:var(--t-text)}
html[data-tema="kilat"] .b-body a{color:var(--t-accent-text)}
html[data-tema="kilat"] :is(.b-more,.b-card:hover h2,.b-pager a){color:var(--t-accent-text)}
html[data-tema="kilat"] :is(.b-foot a,.b-crumb a:hover){color:var(--t-on-bg-link)}
html[data-tema="kilat"] .b-crumb a{color:var(--t-on-bg-muted)}
html[data-tema="kilat"] .b-body blockquote{border-color:var(--t-accent)}
html[data-tema="kilat"]{--brand-soft:color-mix(in srgb,var(--brand,#4f7cff) 12%,var(--card,#fff));
  --brand-line:color-mix(in srgb,var(--brand,#4f7cff) 32%,var(--line,#dfe5ee))}
/* Huruf tema ikut ke halaman luar: tema bukan hanya warna. */
html[data-tema="kilat"] body{font-family:var(--t-font)}
html[data-tema="kilat"] :is(.b-brand,.b-title,.b-art-title,.b-card h2,.b-body h2,.b-body h3){font-family:var(--t-font-display)}
/* == /JEMBATAN TOKEN == */

/* ══ Tema KILAT — pita violet, tab bergaris bawah, nominal berupa daftar ══
   Pola toko top up VCGamers: header violet yang berlanjut jadi pita membulat
   di belakang bagian atas halaman, kartu putih di latar lavender abu, nominal
   satu kolom dengan harga dalam kapsul. Semua pemilih berawalan
   html[data-tema="kilat"]; aturan yang menyetel display memakai :not([hidden]). */
@font-face{font-family:"Rubik";font-style:normal;font-weight:400 800;font-display:swap;src:url('huruf/rubik-400-800.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

html[data-tema="kilat"]{
  --gold:#ffb020;--gold-d:#e08a00;
  --bg:#f4f4f8;--card:#fff;--txt:#1f1d2b;--muted:#6f6b86;--line:#ebe9f3;
  --ok-bg:#e9f8ef;--ok-tx:#12804a;--err-bg:#fdeeee;--err-tx:#b8302a;
  --t-bg:#f4f4f8;--t-frame:#e4e1ef;--t-surface:#fff;--t-field:#f6f5fb;--t-fill:#f1eff8;--t-line:#ebe9f3;
  /* --t-subtle dipakai cetakan kecil kaki identitas (alamat, hak cipta) dan
     tahapan pembayaran yang belum aktif. Nilainya digelapkan sampai lolos
     4,5:1 di latar halaman #f4f4f8 (4,65:1) maupun di kartu putih (5,10:1). */
  --t-text:#1f1d2b;--t-muted:#6f6b86;--t-subtle:#6f6b87;
  --t-accent:var(--brand);--t-accent-d:var(--brand-d);--t-accent-text:var(--brand-text,var(--brand));--t-accent-soft:color-mix(in srgb,var(--brand) 10%,#fff);--t-accent-line:color-mix(in srgb,var(--brand) 26%,#fff);--t-on-accent:var(--brand-on,#fff);
  --t-deep:color-mix(in srgb,var(--brand) 58%,#0b0b14);--t-deep-2:color-mix(in srgb,var(--brand) 80%,#0b0b14);--t-on-deep:#fff;--t-on-deep-muted:rgba(255,255,255,.8);--t-scrim:rgba(26,12,66,.62);
  --t-ok:#22a95b;--t-ok-d:#13804a;--t-ok-soft:#e9f8ef;--t-ok-text:#12804a;
  --t-err:#e5534b;--t-err-d:#b3261e;--t-err-soft:#fdeeee;--t-err-line:#f3c6c3;--t-err-text:#b3261e;
  --t-warn-soft:#fff6e0;--t-warn-line:#ffe2a6;--t-warn-text:#8a5200;
  --t-gold:#ffb020;--t-gold-d:#e08a00;--t-gold-soft:#ffefc8;--t-gold-text:#9a5b00;--t-on-gold:#2f2200;--t-promo:#e5337a;
  --t-font:"Rubik",system-ui,-apple-system,"Segoe UI",sans-serif;--t-font-display:"Rubik",system-ui,sans-serif;
  --kl-vx:var(--brand-text,var(--brand));--kl-vl:var(--brand);--kl-vd:color-mix(in srgb,var(--brand) 84%,#000);--kl-vt:color-mix(in srgb,var(--brand) 72%,#fff);--kl-pita:linear-gradient(90deg,var(--brand),color-mix(in srgb,var(--brand) 84%,#000));
  --kl-bayang:0 2px 10px rgba(35,20,90,.06);
}

/* ── Header + pita ─────────────────────────────────────────────────── */
html[data-tema="kilat"] .hdr{background:var(--kl-pita);box-shadow:none}
html[data-tema="kilat"] .hdr-back{border-radius:50%;background:rgba(255,255,255,.18)}
html[data-tema="kilat"] .brand img#brand-logo{padding:3px;border-radius:10px;background:rgba(255,255,255,.18)}
/* Pita = pseudo-elemen z-index -1: di belakang semua isi, tetap ikut digulir.
   flow-root menahan margin banner supaya pita menempel tepat di bawah header. */
html[data-tema="kilat"] #view-topup:not([hidden]){display:flow-root;position:relative}
html[data-tema="kilat"] #view-topup::before{content:"";position:absolute;z-index:-1;top:0;left:-14px;right:-14px;aspect-ratio:2.9;border-radius:0 0 26px 26px;background:var(--kl-pita)}
html[data-tema="kilat"] section.hero.hero-mati + .event-banner{margin-top:6px}
html[data-tema="kilat"] section.hero.hero-mati + .event-banner[hidden] + .card{margin-top:8px}
html[data-tema="kilat"] .page-head{position:relative;margin-bottom:14px;padding:14px 2px 18px;color:#fff}
html[data-tema="kilat"] .page-head::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:-14px;right:-14px;border-radius:0 0 26px 26px;background:var(--kl-pita)}
/* Ekor pita di belakang kartu pertama hanya bila yang tampil pertama memang
   kartu. Riwayat transaksi dan mutasi poin dimulai dengan label teks, yang
   tak terbaca di atas violet. :has() dipisah per aturan: peramban yang belum
   mengenalnya cukup kehilangan ekornya, bukan seluruh aturan. */
html[data-tema="kilat"] :is(#view-saldo,#view-masuk,#view-bantuan,#view-info,#view-nota) .page-head::before{bottom:-50px}
html[data-tema="kilat"] #view-pesanan:has(> #track-card:not([hidden]),> #pay:not([hidden])) .page-head::before{bottom:-50px}
html[data-tema="kilat"] #view-akun:has(#acct-panel-overview:not([hidden])) .page-head::before{bottom:-50px}
/* 521–700px: kolom 520px tapi header selebar layar. Di perangkat sentuh
   (bilah gulir menumpang, 100vw tak memicu gulir mendatar) pita ikut selebar
   header supaya tidak menggantung seperti tab. */
@media (min-width:521px) and (max-width:700px) and (hover:none){
  html[data-tema="kilat"] #view-topup::before,html[data-tema="kilat"] .page-head::before{left:calc(50% - 50vw);right:calc(50% - 50vw)}
}
html[data-tema="kilat"] .page-head h1{color:#fff;font-size:22px;font-weight:700;letter-spacing:0}
html[data-tema="kilat"] .page-head p{display:inline-block;margin-top:8px;padding:5px 11px;border-radius:12px;background:rgba(255,255,255,.12);color:#fff;font-size:12px;line-height:1.45}
html[data-tema="kilat"] .page-head .section-kicker{color:rgba(255,255,255,.78);letter-spacing:.12em}

/* ── Hero (kalau domain menyalakannya) ─────────────────────────────── */
html[data-tema="kilat"] .hero:not(.hero-mati){border:0;border-radius:14px;background-color:var(--t-deep);box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 28%,transparent);
  background-image:linear-gradient(90deg,rgba(40,16,120,.96) 0%,rgba(74,36,196,.86) 40%,color-mix(in srgb,var(--brand) 34%,transparent) 64%,transparent 100%),var(--hero-gambar,url('/assets/tokohiggs-hero-resmi-mitra-bergaransi.webp'))!important}
html[data-tema="kilat"] .hero:not(.hero-mati) .badge{border-radius:999px}
html[data-tema="kilat"] .hero-trust span{border-radius:999px;background:rgba(255,255,255,.16);font-weight:600;backdrop-filter:blur(6px)}

/* ── Banner event ──────────────────────────────────────────────────── */
html[data-tema="kilat"] .event-slider{border-radius:14px;box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 28%,transparent)}
html[data-tema="kilat"] .event-dots{margin-top:10px}
html[data-tema="kilat"] .event-dots button{width:6px;height:6px;background:#cfc8ea}
html[data-tema="kilat"] .event-dots button.is-on{width:16px;background:var(--kl-vl)}

/* ── Kartu langkah ─────────────────────────────────────────────────── */
html[data-tema="kilat"] .card{border:0;border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:var(--kl-bayang)}
html[data-tema="kilat"] .card h2{gap:10px;font-size:15.5px;font-weight:600;letter-spacing:0}
html[data-tema="kilat"] .card h2 .num{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));font-size:13px;font-weight:700}
html[data-tema="kilat"] .user-id-row{gap:8px}
html[data-tema="kilat"] :is(#game-id,#contact-email,#track-input,#login-email,#login-code){padding:12px;border:1.5px solid transparent;border-radius:10px;background:var(--t-field);color:var(--txt);font-weight:500}
html[data-tema="kilat"] :is(#game-id,#contact-email,#track-input,#login-email,#login-code)::placeholder{color:#9d99b3;font-weight:400}
html[data-tema="kilat"] :is(#game-id,#contact-email,#track-input,#login-email,#login-code):focus{border-color:var(--kl-vx);background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent)}
html[data-tema="kilat"] .user-id-row #check-btn,html[data-tema="kilat"] #track-go{padding:0 18px;border-radius:10px;background:var(--kl-vl);box-shadow:none;font-weight:600}
html[data-tema="kilat"] .user-id-row #user-id-guide-btn{border:0;border-radius:10px;background:var(--t-accent-soft)}
html[data-tema="kilat"] .user-id-copy{margin-top:8px;font-size:12px;line-height:1.5}
html[data-tema="kilat"] .buyer{padding:9px 12px;border-radius:10px;font-size:13.5px}
/* Saklar mode ID (hanya pembeli yang login): kapsul lavender, pilihan putih. */
html[data-tema="kilat"] .id-mode{padding:3px;border-radius:999px;background:var(--t-fill)}
html[data-tema="kilat"] .id-mode button{border-radius:999px;color:var(--muted);font-weight:500}
html[data-tema="kilat"] .id-mode button.is-on{background:#fff;color:var(--kl-vx);box-shadow:0 1px 3px rgba(35,20,90,.16);font-weight:600}

/* Tab kategori: garis bawah, bukan pil. */
html[data-tema="kilat"] .product-card .tabs{gap:0;margin:0 -14px 12px;padding:0 4px;border-radius:0;background:#fff;box-shadow:inset 0 -1px 0 var(--line);backdrop-filter:none}
html[data-tema="kilat"] .product-card .tabs :is(a,button){position:relative;flex:1 0 0;min-width:max-content;padding:11px 12px 12px;border:0;border-radius:0;background:none;box-shadow:none;color:var(--muted);font-size:13.5px;font-weight:500}
html[data-tema="kilat"] .product-card .tabs :is(a,button).active{background:none;box-shadow:none;color:var(--kl-vx);font-weight:700}
html[data-tema="kilat"] .product-card .tabs :is(a,button).active::after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--kl-vl)}
html[data-tema="kilat"] .product-card .tabs :is(a,button):focus-visible{outline:2px solid var(--kl-vl);outline-offset:-4px}

/* Nominal: daftar satu kolom — ikon | nama + poin | kapsul harga. */
html[data-tema="kilat"] #products{grid-template-columns:minmax(0,1fr);gap:8px}
/* Baris 1fr di atas dan bawah menyerap sisa tinggi, jadi nama tetap di tengah
   walau baris poin/promo kosong. */
html[data-tema="kilat"] .prod{min-height:62px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-rows:1fr auto auto auto auto 1fr;grid-template-areas:"ic . pr" "ic n pr" "ic del pr" "ic pts pr" "ic promo pr" "ic . pr";align-items:center;column-gap:11px;row-gap:0;padding:10px 10px 10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:none;color:var(--txt)}
html[data-tema="kilat"] .prod:hover{border-color:#cdbdff}
html[data-tema="kilat"] .prod .ic{grid-area:ic;width:40px;height:40px;overflow:hidden}
html[data-tema="kilat"] .prod .ic img,html[data-tema="kilat"] .prod.prod-image-native .ic img{width:40px;height:40px;color:transparent}
html[data-tema="kilat"] .prod .n{grid-area:n;font-size:14px;font-weight:600;line-height:1.25}
html[data-tema="kilat"] .prod .prod-price{display:contents}
html[data-tema="kilat"] .prod-price del{grid-area:del;justify-self:start;margin-top:2px;font-size:11px;font-weight:400}
html[data-tema="kilat"] .prod-price strong{grid-area:pr;justify-self:end;padding:8px 12px;border-radius:999px;background:var(--t-accent-soft);color:var(--kl-vx);font-size:13.5px;font-weight:700;line-height:1.1}
html[data-tema="kilat"] .prod .prod-points{grid-area:pts;justify-self:start;gap:4px;margin-top:3px;padding:0;background:none;color:#9a5b00;font-size:11px;font-weight:500}
html[data-tema="kilat"] .prod .prod-points::before{content:"";width:7px;height:10px;background:var(--gold);clip-path:polygon(60% 0,0 58%,45% 58%,35% 100%,100% 40%,55% 40%)}
/* Harga coret domain. Di daftar Kilat .prod-price memakai display:contents,
   jadi pembungkus baris coret yang menjadi anak grid kartu dan WAJIB
   menempati area "del" (di bawah nama); tanpa itu ia jatuh ke sel kosong.
   Pil harga tetap di kanan. Di rak flash .prod-price kembali flex, dan
   grid-area di sana tidak berpengaruh. */
html[data-tema="kilat"] .prod .prod-coret{grid-area:del;justify-self:start;margin:2px 0 0;gap:0 6px}
html[data-tema="kilat"] .prod .prod-coret del{margin:0}
html[data-tema="kilat"] .prod-diskon{padding:2px 6px;border-radius:6px;background:#ffe9e7;color:#d1291c;font-size:10.5px;font-weight:700}
html[data-tema="kilat"] .prod.active .prod-diskon{background:#fff;box-shadow:inset 0 0 0 1px #f6c4bf}
html[data-tema="kilat"] .prod-diskon.prod-diskon-promo,html[data-tema="kilat"] .prod.active .prod-diskon.prod-diskon-promo{background:var(--t-promo);color:#fff;box-shadow:none}
html[data-tema="kilat"] .prod .promo-copy{grid-area:promo;margin-top:3px}
html[data-tema="kilat"] .prod .promo-badge{top:-7px;right:12px;padding:3px 8px;border-radius:6px;clip-path:none;font-size:9.5px}
html[data-tema="kilat"] .prod.active{border-color:var(--kl-vx);background:color-mix(in srgb,var(--brand) 5%,#fff);box-shadow:0 0 0 1px var(--kl-vl)}
html[data-tema="kilat"] .prod.active .prod-price strong{background:var(--kl-vl);color:#fff}
html[data-tema="kilat"] .prod:focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 40%,transparent);outline-offset:2px}
html[data-tema="kilat"] .flash-sale{border:0;border-radius:14px}
/* Kartu flash sale lebih sempit dari baris daftar: harga turun ke baris kedua. */
html[data-tema="kilat"] .flash-products .prod{min-height:0;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"ic n" "harga harga" "promo promo";row-gap:8px;border-color:transparent}
html[data-tema="kilat"] .flash-products .prod .n{padding-right:34px}
html[data-tema="kilat"] .flash-products .prod .prod-price{display:flex;grid-area:harga;align-items:center;gap:6px 8px;flex-wrap:wrap}
html[data-tema="kilat"] .flash-products .prod .promo-copy{margin-top:0}
html[data-tema="kilat"] .flash-products .prod .promo-badge{top:0;right:0;border-radius:0 11px 0 8px}
html[data-tema="kilat"] .flash-ticket{clip-path:none;border-radius:999px;background:var(--gold);color:#2f2200}

/* Email */
html[data-tema="kilat"] .email-help{padding:0;border:0;background:none;color:var(--muted);font-size:12px;line-height:1.5}
html[data-tema="kilat"] .email-help::before{background:var(--t-accent-soft);color:var(--kl-vx)}
html[data-tema="kilat"] .email-help[data-kind="error"]{padding:9px 11px;border-radius:10px;background:var(--err-bg)}
html[data-tema="kilat"] .email-help[data-kind="error"]::before{background:var(--err-tx);color:#fff}

/* Langkah 4: saldo & poin + metode */
html[data-tema="kilat"] .checkout-benefits{padding:12px;border:1px solid var(--t-warn-line);border-radius:12px;background:linear-gradient(90deg,#fff6e0,#fff)}
html[data-tema="kilat"] .checkout-benefits-head>span{color:#8a5200;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none}
html[data-tema="kilat"] .checkout-benefits-head small{color:#7d6128;font-size:12px}
html[data-tema="kilat"] .benefit-card{border:1px solid #ffe2a6;border-radius:10px}
html[data-tema="kilat"] .benefit-card.locked{background:#fffdf7}
html[data-tema="kilat"] .benefit-card.active{border-color:var(--kl-vx);box-shadow:0 0 0 1px var(--kl-vl)}
html[data-tema="kilat"] .benefit-icon{border-radius:50%}
html[data-tema="kilat"] .benefit-card b{font-weight:600}
html[data-tema="kilat"] .external-pay-head{border-top:1px dashed var(--line)}
html[data-tema="kilat"] .external-pay-head>span{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none}
html[data-tema="kilat"] .paym{gap:6px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
html[data-tema="kilat"] .paym:hover{border-color:#cdbdff}
html[data-tema="kilat"] .paym.active{border-color:var(--kl-vx);background:color-mix(in srgb,var(--brand) 5%,#fff);box-shadow:inset 0 0 0 1px var(--kl-vl)}
html[data-tema="kilat"] .paym .paym-n{font-size:14px;font-weight:600;color:var(--txt)}
html[data-tema="kilat"] .paym .paym-p{font-size:12px;color:var(--muted)}
html[data-tema="kilat"] .paym.active .paym-p{color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .paym-internal{background:linear-gradient(135deg,#f3effe,#fff)}
html[data-tema="kilat"] .paym-internal .paym-ic{border-radius:50%}

/* ── Bar bayar ─────────────────────────────────────────────────────── */
html[data-tema="kilat"] .summary{gap:6px 4px;padding:10px 8px 10px 14px;border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0;background:#fff;box-shadow:0 -8px 22px rgba(0,0,0,.12)}
html[data-tema="kilat"] .summary-assurance{padding-bottom:6px;border-bottom:1px dashed var(--line);color:var(--ok-tx);font-size:11px;font-weight:500}
html[data-tema="kilat"] .summary>div::before{color:var(--muted);font-size:11px;font-weight:400}
html[data-tema="kilat"] .summary #sum-price{color:var(--txt);font-size:18px;font-weight:700}
html[data-tema="kilat"] #buy-btn{padding:6px 18px;border-radius:12px;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));box-shadow:0 6px 14px color-mix(in srgb,var(--brand) 35%,transparent);font-size:14px;font-weight:600}
html[data-tema="kilat"] #buy-btn:disabled{box-shadow:none}

/* ── Tombol CS: bulat ──────────────────────────────────────────────── */
html[data-tema="kilat"] .bantuan-tg{border-radius:999px;box-shadow:0 6px 16px rgba(35,20,90,.25)}
html[data-tema="kilat"] .bantuan-avatar,html[data-tema="kilat"] .bantuan-avatar>img{border-radius:50%}

/* ── Bilah navigasi bawah ──────────────────────────────────────────── */
html[data-tema="kilat"] .bnav{border-top:0;box-shadow:0 -4px 16px rgba(35,20,90,.06)}
html[data-tema="kilat"] .bnav a{color:#76728c;font-weight:500}
html[data-tema="kilat"] .bnav a[aria-current="page"]{color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .bnav a[aria-current="page"]::before{display:none}
html[data-tema="kilat"] .bnav a[aria-current="page"] svg{fill:#e9e0ff}
html[data-tema="kilat"] .bnav li.center a{color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .bnav .bnav-fab{top:-22px;border:0;background:linear-gradient(145deg,var(--kl-vt),var(--kl-vd));box-shadow:0 0 0 5px #fff,0 8px 18px color-mix(in srgb,var(--brand) 40%,transparent)}
html[data-tema="kilat"] .bnav li.center a[aria-current="page"] .bnav-fab{background:linear-gradient(145deg,#7a4ff8,#4b22cc);box-shadow:0 0 0 5px #fff,0 8px 20px color-mix(in srgb,var(--brand) 50%,transparent)}

/* ── Artikel, jelajah, kaki ────────────────────────────────────────── */
html[data-tema="kilat"] .seo-jelajah{border:0;border-radius:14px;box-shadow:var(--kl-bayang)}
html[data-tema="kilat"] .seo-jelajah a{color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .seo-artikel{--seo-soft:#f7f5fd;--seo-line:#ebe7f7;border:0;border-radius:14px;box-shadow:var(--kl-bayang)}
html[data-tema="kilat"] .seo-article-head{padding:14px 16px;background:#fff}
html[data-tema="kilat"] .seo-article-head::after{content:none}
html[data-tema="kilat"] .seo-eyebrow{margin-bottom:6px;color:var(--muted);font-size:10.5px;font-weight:600;letter-spacing:.08em}
html[data-tema="kilat"] .seo-eyebrow span{width:14px;background:var(--gold)}
html[data-tema="kilat"] .seo-artikel h2{font-size:16px;font-weight:600;letter-spacing:0;line-height:1.35}
html[data-tema="kilat"] .seo-artikel h3{font-weight:600;letter-spacing:0}
html[data-tema="kilat"] .seo-toggle{margin-top:8px;padding:0;border-radius:0;background:none;box-shadow:none;color:var(--kl-vx);font-size:13px;font-weight:600}
html[data-tema="kilat"] .seo-article-lead{padding-inline:16px}
html[data-tema="kilat"] .seo-block{border-radius:12px;box-shadow:none}
html[data-tema="kilat"] .seo-block::before{background:var(--kl-vl)}
html[data-tema="kilat"] .seo-step-list li::before{border-radius:50%;box-shadow:none}
html[data-tema="kilat"] .seo-faq{border-radius:10px}
html[data-tema="kilat"] .seo-faq summary{font-weight:600}
html[data-tema="kilat"] .seo-faq summary::after{border-radius:50%}
html[data-tema="kilat"] .seo-return{background:var(--kl-pita)}
/* Kaki identitas: garis pemisah bawaan (--line) nyaris tak terlihat di latar
   #f4f4f8, jadi dinaikkan sedikit. Baris tautan kebijakan (.ident-kebijakan,
   terbit bersama kaki identitas) diberi warna violet supaya terbaca sebagai
   tautan — ±6,4:1 di latar terang — dan pemisah "|" antar tautan ikut terlihat. */
html[data-tema="kilat"] .ident-foot{border-top-color:#e2ddf0}
html[data-tema="kilat"] .ident-segel>span{background:var(--t-accent-soft);box-shadow:none;color:var(--kl-vx);font-weight:600;letter-spacing:.03em}
html[data-tema="kilat"] .ident-kontak a{border-bottom-color:#d8d2ec}
html[data-tema="kilat"] .ident-kebijakan li::before{border-left-color:#d2cbea}
html[data-tema="kilat"] .ident-kebijakan a{color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .ident-kebijakan a:hover{color:#4820cf}

/* ── Pembayaran /pesanan/<nomor> ───────────────────────────────────── */
html[data-tema="kilat"] .pay-page{padding:18px 16px 14px;border:0;border-radius:16px;box-shadow:0 2px 12px rgba(35,20,90,.08)}
html[data-tema="kilat"] .payment-card::before{content:none}
html[data-tema="kilat"] .pay-kicker{color:var(--kl-vx);font-weight:600;letter-spacing:.1em}
html[data-tema="kilat"] .payment-card h3{font-size:18px;font-weight:600;letter-spacing:0}
/* Gradasi tagihan sengaja lebih gelap dari pita: label kecil putih tetap ≥4,5:1. */
html[data-tema="kilat"] .pay-invoice{padding:14px 16px;border:0;border-radius:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 72%,#0b0b14),color-mix(in srgb,var(--brand) 92%,#0b0b14));box-shadow:0 8px 20px color-mix(in srgb,var(--brand) 25%,transparent);color:#fff}
html[data-tema="kilat"] .pay-invoice-label{color:rgba(255,255,255,.9);font-weight:500;letter-spacing:.04em}
html[data-tema="kilat"] .pay-invoice-amount{color:#fff;font-size:28px;font-weight:700;letter-spacing:-.01em}
html[data-tema="kilat"] .pay-invoice-product{color:rgba(255,255,255,.92);font-weight:500}
html[data-tema="kilat"] .pay-funding-breakdown{border-top-color:rgba(255,255,255,.32)}
html[data-tema="kilat"] .pay-funding-breakdown span{color:rgba(255,255,255,.9)}
html[data-tema="kilat"] .pay-funding-breakdown b{color:#fff}
html[data-tema="kilat"] .pay-invoice .pay-nota-link{color:#fff}
/* Tahapan naik ke atas tagihan seperti mockup: #pay-status dilebur jadi anak
   flex #pay supaya urutannya bisa diatur tanpa mengubah DOM. */
html[data-tema="kilat"] #pay:not([hidden]){display:flex;flex-direction:column}
html[data-tema="kilat"] #pay-status{display:contents}
html[data-tema="kilat"] #pay-status>*{order:3}
html[data-tema="kilat"] #pay-status>:is(.pay-steps,.pay-status-logo){order:1}
html[data-tema="kilat"] #pay-body{order:2}
html[data-tema="kilat"] #pay-close{order:4;align-self:flex-start}
html[data-tema="kilat"] #pay .pay-state-head{margin-top:14px}
html[data-tema="kilat"] .pay-steps{margin:0 0 14px}
html[data-tema="kilat"] .pay-step{color:var(--t-subtle);font-weight:500}
html[data-tema="kilat"] .pay-step.active,html[data-tema="kilat"] .pay-step.done{color:var(--txt);font-weight:600}
html[data-tema="kilat"] .pay-step-dot{width:24px;height:24px;background:var(--t-accent-soft);color:var(--kl-vx);font-weight:700}
html[data-tema="kilat"] .pay-step.active .pay-step-dot{background:var(--kl-vl);box-shadow:0 4px 10px color-mix(in srgb,var(--brand) 30%,transparent)}
html[data-tema="kilat"] .pay-step-line{flex:1 1 0;width:auto;min-width:10px;max-width:56px;background:var(--line)}
html[data-tema="kilat"] .pay-state-head{align-items:center;padding:12px;border:0;border-radius:12px;background:var(--t-warn-soft)}
html[data-tema="kilat"] .pay-state-symbol{border-radius:50%;background:var(--gold);box-shadow:none;color:#fff}
html[data-tema="kilat"] .pay-state-symbol.has-asset{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
html[data-tema="kilat"] .pay-state-head strong{font-weight:600}
html[data-tema="kilat"] .pay-state-head p{color:#7f6026}
html[data-tema="kilat"] .pay-status.ok .pay-state-head{background:var(--t-ok-soft)}
html[data-tema="kilat"] .pay-status.ok .pay-state-head p{color:var(--t-ok-text)}
html[data-tema="kilat"] .pay-status.err .pay-state-head{background:var(--t-err-soft)}
html[data-tema="kilat"] .pay-status.err .pay-state-head p{color:var(--t-err-text)}
/* Tiket nomor pesanan: terang bergaris putus (mockup), bukan panel gelap. */
html[data-tema="kilat"] .order-ticket{padding:12px 14px;border:1px dashed color-mix(in srgb,var(--brand) 24%,#fff);border-radius:12px;background:color-mix(in srgb,var(--brand) 5%,#fff);box-shadow:none;color:var(--txt)}
html[data-tema="kilat"] .order-ticket::after{content:none}
html[data-tema="kilat"] .order-ticket-top{color:var(--muted);font-size:12px;letter-spacing:.02em;text-transform:none}
html[data-tema="kilat"] .order-ticket-top b{color:var(--kl-vx);font-size:16px}
html[data-tema="kilat"] .order-full-id{color:var(--muted)}
html[data-tema="kilat"] .order-ticket-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;padding-top:0;border-top:0}
html[data-tema="kilat"] .order-ticket-actions button{padding:9px;border:1px solid var(--kl-vl);border-radius:10px;background:#fff;color:var(--kl-vx);font-size:12.5px;font-weight:600}
html[data-tema="kilat"] .order-ticket-actions button:last-child{background:var(--kl-vl);color:#fff}
html[data-tema="kilat"] .pay-email-note{border-radius:10px}

/* ── Lacak ─────────────────────────────────────────────────────────── */
html[data-tema="kilat"] .track-order-card{border:0;border-radius:14px;box-shadow:0 2px 12px rgba(35,20,90,.08)}
html[data-tema="kilat"] .track-status-head{align-items:center;border-bottom-color:var(--line)}
html[data-tema="kilat"] .track-status-icon{border-radius:50%}
html[data-tema="kilat"] .track-overline{font-weight:600;letter-spacing:.08em}
html[data-tema="kilat"] .track-status-head strong{font-weight:600}
html[data-tema="kilat"] .track-buyer{border:0;border-radius:12px;background:var(--t-field)}
html[data-tema="kilat"] .track-avatar{border-radius:50%;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl))}
html[data-tema="kilat"] .track-buyer span:not(.track-avatar),html[data-tema="kilat"] .track-detail-grid span{font-weight:500;letter-spacing:.05em}
html[data-tema="kilat"] .track-detail-grid{border-color:var(--line);border-radius:12px}
html[data-tema="kilat"] .track-detail-grid b{font-weight:600}
html[data-tema="kilat"] .track-ticket{margin:0 15px 15px;border:1px dashed color-mix(in srgb,var(--brand) 24%,#fff);border-radius:12px;background:color-mix(in srgb,var(--brand) 5%,#fff);color:var(--txt)}
html[data-tema="kilat"] .track-ticket span{color:var(--muted);font-weight:500}
html[data-tema="kilat"] .track-ticket b{color:var(--kl-vx)}
html[data-tema="kilat"] .track-ticket button{border:0;background:var(--kl-vl);color:#fff;font-weight:600}
html[data-tema="kilat"] .track-nota-link{border-color:var(--kl-vx);color:var(--kl-vx);font-weight:600}
html[data-tema="kilat"] .refund-box{border-color:var(--line);border-radius:12px}

/* ── Tombol penuh, bantuan, info, menu ─────────────────────────────── */
html[data-tema="kilat"] .btn-full{border-radius:12px;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));box-shadow:0 6px 14px color-mix(in srgb,var(--brand) 28%,transparent);font-weight:600}
html[data-tema="kilat"] .btn-outline{border:0;background:var(--t-accent-soft);box-shadow:none;color:var(--kl-vx)}
html[data-tema="kilat"] .login-card .login-msg{margin-bottom:0}
html[data-tema="kilat"] .nota-btn{border-radius:12px;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));font-weight:600}
html[data-tema="kilat"] .nota-btn-sekunder{border:1.5px solid var(--kl-vl);background:#fff;color:var(--kl-vx)}
html[data-tema="kilat"] .cs-card,html[data-tema="kilat"] .account-menu{border:0;border-radius:14px;box-shadow:var(--kl-bayang)}
html[data-tema="kilat"] .cs-avatar{border-radius:50%}
html[data-tema="kilat"] .cs-go{color:var(--kl-vx)}
html[data-tema="kilat"] .faq-item summary{font-weight:500}
html[data-tema="kilat"] .faq-item summary::after{border-radius:50%;background:var(--t-accent-soft);color:var(--kl-vx)}
html[data-tema="kilat"] .account-menu :is(a,button)>span{border-radius:50%;background:var(--t-accent-soft);color:var(--kl-vx)}
html[data-tema="kilat"] .account-menu :is(a,button){font-weight:500}
html[data-tema="kilat"] .account-menu a>i{color:var(--kl-vx)}
html[data-tema="kilat"] .account-menu button.danger>span{background:var(--err-bg);color:var(--err-tx)}
html[data-tema="kilat"] :is(.info-promo-list,.info-leaderboard-list) img{border:0;border-radius:12px}
html[data-tema="kilat"] .info-posts a b{font-weight:600}
html[data-tema="kilat"] .info-more{color:var(--kl-vx);font-weight:600}

/* ── Akun ──────────────────────────────────────────────────────────── */
html[data-tema="kilat"] .player-pass{border-radius:18px;background:radial-gradient(120% 90% at 100% 0,rgba(255,255,255,.14),transparent 55%),linear-gradient(145deg,var(--t-deep-2),var(--t-deep));box-shadow:0 12px 26px color-mix(in srgb,var(--brand) 30%,transparent)}
html[data-tema="kilat"] .player-avatar,html[data-tema="kilat"] .wallet-pass-mark{border-radius:50%}
html[data-tema="kilat"] .avatar-options button{border-radius:50%}
html[data-tema="kilat"] .account-meters span,html[data-tema="kilat"] .wallet-pass-balance span{font-weight:500}
html[data-tema="kilat"] :is(.checkin-card,.account-rank,.account-spender-card,.wallet-topup-card){border:0;border-radius:14px;box-shadow:var(--kl-bayang)}
html[data-tema="kilat"] .checkin-mark,html[data-tema="kilat"] .spender-trophy,html[data-tema="kilat"] .spender-avatar{border-radius:50%}
html[data-tema="kilat"] .checkin-card button{border-radius:10px;background:var(--kl-vl);font-weight:600}
html[data-tema="kilat"] .checkin-card button:disabled{background:var(--t-fill);color:var(--muted)}
html[data-tema="kilat"] .checkin-days li{border-radius:10px;border-color:var(--line);background:var(--t-field)}
html[data-tema="kilat"] .checkin-days li.today{border-color:var(--kl-vx)}
html[data-tema="kilat"] .spender-card::after{border-color:color-mix(in srgb,var(--brand) 7%,transparent)}
html[data-tema="kilat"] .spender-head h2{font-weight:600}
/* Periode top spender ikut gaya tab bergaris bawah. */
html[data-tema="kilat"] .spender-periods{gap:0;padding:0;border-radius:0;background:none;box-shadow:inset 0 -1px 0 var(--line)}
html[data-tema="kilat"] .spender-periods button{position:relative;padding:10px 6px 11px;border-radius:0;color:var(--muted);font-size:12.5px;font-weight:500}
html[data-tema="kilat"] .spender-periods button[aria-selected="true"]{background:none;box-shadow:none;color:var(--kl-vx);font-weight:700}
html[data-tema="kilat"] .spender-periods button[aria-selected="true"]::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--kl-vl)}
html[data-tema="kilat"] .spender-list li,html[data-tema="kilat"] .account-entry{border-radius:12px}
html[data-tema="kilat"] :is(.account-more,.account-subhead button){border-radius:10px}
html[data-tema="kilat"] .account-subhead strong{font-size:14px;font-weight:600}
/* Kartu tanpa garis: tanda gagal muat katalog pindah ke cincin bayangan. */
html[data-tema="kilat"].store-load-failed .product-card{box-shadow:0 0 0 1.5px var(--t-err-line),var(--kl-bayang)}

/* ── Saldo ─────────────────────────────────────────────────────────── */
html[data-tema="kilat"] .wallet-pass-mark{background:linear-gradient(145deg,var(--kl-vt),var(--kl-vl))}
html[data-tema="kilat"] .wallet-pass-btn.primary{background:var(--gold);color:#2f2200}
html[data-tema="kilat"] .wallet-topup-mark{border-radius:50%}
html[data-tema="kilat"] .wallet-topup-steps .active span{background:var(--kl-vl)}
html[data-tema="kilat"] .wallet-topup-presets button{border-radius:10px;font-weight:600}
html[data-tema="kilat"] .wallet-topup-presets button[aria-pressed="true"]{border-color:var(--kl-vx);background:color-mix(in srgb,var(--brand) 5%,#fff);color:var(--kl-vx);box-shadow:inset 0 0 0 1px var(--kl-vl)}
html[data-tema="kilat"] .wallet-topup-input{border:1.5px solid transparent;border-radius:10px;background:var(--t-field)}
html[data-tema="kilat"] .wallet-topup-input:focus-within{border-color:var(--kl-vx);background:#fff}
html[data-tema="kilat"] .wallet-topup-methods button{border-radius:10px}
html[data-tema="kilat"] .wallet-topup-submit{border-radius:12px;background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));font-size:13px;font-weight:600}
html[data-tema="kilat"] .wallet-topup-submit:disabled{background:var(--t-fill);box-shadow:none;color:var(--t-muted)}

/* ── Overlay ───────────────────────────────────────────────────────── */
html[data-tema="kilat"] :is(.paycard,.tg-miniapp-install-card){border-radius:18px}
html[data-tema="kilat"] :is(.bulk-confirm-actions button,.tg-miniapp-install-actions button){border-radius:12px}
html[data-tema="kilat"] :is(.event-popup-card,.event-popup-body){border-radius:18px}
html[data-tema="kilat"] .event-popup-cta{background:linear-gradient(135deg,var(--kl-vt),var(--kl-vl));font-weight:600}
html[data-tema="kilat"] .user-id-guide-image{border-radius:14px}

@media (max-width:360px){
  html[data-tema="kilat"] #buy-btn{padding-inline:12px;font-size:13px}
  html[data-tema="kilat"] .prod-price strong{padding:8px 10px;font-size:13px}
}

/* == HALAMAN LUAR: bilah merek blog & kebijakan ===================== */
html[data-tema="kilat"] .b-top{background:var(--kl-pita);box-shadow:none}
html[data-tema="kilat"] .b-back{border-radius:50%;background:rgba(255,255,255,.18)}
html[data-tema="kilat"] .b-brand img:not(.b-wordmark){padding:3px;border-radius:10px;background:rgba(255,255,255,.18)}
/* == /HALAMAN LUAR ================================================== */

/* == KONTRAS LOGO NAMA DI BILAH BERWARNA MEREK ===================== */
/* Bilah kepala tema ini memakai warna merek domain, jadi logo nama putih
   bisa hilang di warna terang. Cabang gelap/terangnya dihitung server
   (--brand-on-img): "none" untuk merek gelap, tinta hitam untuk terang. */
html[data-tema="kilat"] :is(#brand-wordmark,.b-brand img.b-wordmark){filter:var(--brand-on-img,none)}
/* == /KONTRAS LOGO NAMA ============================================ */

/* == POP-UP CEK ID ================================================== */
/* Bingkai violet merek, cincin emas, panel putih, isian abu lembut ala Kilat. */
html[data-tema="kilat"] .paycard.idcek-kartu{--idcek-emas:var(--gold);--idcek-emas-d:var(--gold-d);--idcek-b1:var(--kl-vl);--idcek-b2:var(--kl-vd);--idcek-b3:color-mix(in srgb,var(--kl-vd) 55%,#000);--idcek-pil:var(--t-field);--idcek-teks:var(--txt);--idcek-ikon:var(--kl-vd);border-radius:20px}
html[data-tema="kilat"] .idcek-nilai{border-radius:10px}
html[data-tema="kilat"] .idcek-aksi button{border-radius:10px}
html[data-tema="kilat"] .idcek-ubah{color:var(--kl-vx)}
/* == /POP-UP CEK ID ================================================= */

/* == SUSUNAN KARTU: KOTAK ============================================ */
/* Bawaan Kilat = daftar satu kolom. Pilihan domain "kotak" = ubin dua kolom:
   ikon + nama (poin di bawahnya), baris coret, lalu kapsul harga selebar
   kartu di dasar ubin (baris 1fr di atasnya menyejajarkan kapsul satu baris). */
html[data-tema="kilat"][data-kartu="kotak"] #products.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod{
  min-height:0;grid-template-columns:36px minmax(0,1fr);
  grid-template-rows:auto auto auto 1fr auto auto;
  grid-template-areas:"ic n" "ic pts" "del del" ". ." "pr pr" "promo promo";
  align-items:center;column-gap:9px;row-gap:0;padding:11px 10px 10px;
}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .ic,
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .ic img,
html[data-tema="kilat"][data-kartu="kotak"] #products .prod.prod-image-native .ic img{width:36px;height:36px}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .n{font-size:13px;line-height:1.2}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod:not(:has(.prod-points)) .n{grid-row:1/3}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-points{margin-top:2px}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-coret,
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-price>del{margin:9px 0 0}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-price strong{justify-self:stretch;margin-top:9px;padding:8px 10px;text-align:center}
html[data-tema="kilat"][data-kartu="kotak"] #products .prod .promo-copy{margin-top:7px}
/* HP sempit: kolom teks di samping ikon tinggal ±60px, poin ribuan tidak
   muat; poin turun ke baris sendiri selebar kartu. */
@media (max-width:360px){
  html[data-tema="kilat"][data-kartu="kotak"] #products .prod{grid-template-areas:"ic n" "pts pts" "del del" ". ." "pr pr" "promo promo";column-gap:8px;padding:10px 9px 9px}
  html[data-tema="kilat"][data-kartu="kotak"] #products .prod .n{grid-row:1/2;font-size:12.5px}
  html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-points{margin-top:7px}
  html[data-tema="kilat"][data-kartu="kotak"] #products .prod .prod-price strong{padding:8px 6px;font-size:12.5px}
}
/* == /SUSUNAN KARTU ================================================== */