/* Panel internal DIGIWEBS OS — kaca pastel (khusus panel; situs publik memakai tema editorial terpisah). Token dari token.css. */
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light dark;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100dvh;background:var(--warna-kanvas);color:var(--warna-tinta);font:400 var(--huruf-ukuran-isi)/1.45 var(--huruf-keluarga);
  font-feature-settings:"tnum" 1;overflow-x:hidden;padding:64px 16px 112px}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
:focus-visible{outline:2px solid var(--warna-aksen);outline-offset:2px;border-radius:var(--radius-kecil)}
[hidden]{display:none!important}
.ikon{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.ikon.kecil{width:14px;height:14px}

/* ---------- latar desktop: bidang pastel kabur (CSS murni, bukan wallpaper pihak lain) */
.latar{position:fixed;inset:0;z-index:-1;overflow:hidden;background:var(--warna-kanvas)}
.bulat{position:absolute;border-radius:50%;filter:blur(80px);opacity:.75}
.b1{width:46vmax;height:46vmax;left:-12vmax;top:-14vmax;background:var(--warna-latar-1)}
.b2{width:40vmax;height:40vmax;right:-10vmax;top:6vmax;background:var(--warna-latar-2)}
.b3{width:36vmax;height:36vmax;left:22vmax;bottom:-18vmax;background:var(--warna-latar-3)}
.b4{width:22vmax;height:22vmax;right:16vmax;bottom:4vmax;background:var(--warna-latar-4)}

/* ---------- material kaca */
.kaca,.kaca-kuat{-webkit-backdrop-filter:var(--efek-kaca-saring);backdrop-filter:var(--efek-kaca-saring);box-shadow:var(--efek-garis-dalam),var(--efek-bayang-1)}
.kaca{background:var(--warna-kaca)}
.kaca-kuat{background:var(--warna-kaca-kuat);box-shadow:var(--efek-garis-dalam),var(--efek-bayang-2)}

/* ---------- bilah menu */
.bilah{position:fixed;inset:0 0 auto;height:44px;z-index:30;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:0 12px}
.bilah-kiri,.bilah-kanan{display:flex;align-items:center;gap:6px;min-width:0}
.bilah-kanan{justify-content:flex-end}
.merek{font-weight:700;letter-spacing:.02em;font-size:var(--huruf-ukuran-sedang)}
.detak{width:8px;height:8px;border-radius:50%;background:var(--warna-tinta-3)}
.detak.hidup{background:var(--warna-r0);box-shadow:0 0 0 0 color-mix(in srgb,var(--warna-r0) 60%,transparent);animation:denyut 2.4s var(--gerak-pegas) infinite}
@keyframes denyut{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--warna-r0) 55%,transparent)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.lencana-versi,.pil-ikon,.pil-teks{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 8px;border-radius:var(--radius-pil);font-size:var(--huruf-ukuran-kecil);
  color:var(--warna-tinta-2);transition:background var(--gerak-cepat) var(--gerak-pegas)}
.lencana-versi:hover,.pil-ikon:hover,.pil-teks:hover{background:var(--warna-garis)}
.pil-ikon kbd{font:inherit;font-size:var(--huruf-ukuran-mikro);color:var(--warna-tinta-3)}
.pil-ikon.ada b{color:var(--warna-r3)}
.pil-ikon.aktif,.pil-ikon[aria-pressed=true]{background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.pil-teks b{padding:2px 5px;border-radius:6px;color:var(--warna-tinta-3);font-weight:600}
.pil-teks b.aktif{background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.jam{font-size:var(--huruf-ukuran-kecil);color:var(--warna-tinta-2);min-width:40px;text-align:right}
.meter-biaya{display:inline-flex;align-items:center;gap:6px;font-size:var(--huruf-ukuran-kecil);color:var(--warna-tinta-2)}
.meter{width:42px;height:5px;border-radius:3px;background:var(--warna-garis);overflow:hidden}
.meter i,.bar i{display:block;height:100%;width:var(--isi,0%);background:var(--warna-aksen);border-radius:inherit;transition:width var(--gerak-sedang) var(--gerak-pegas)}

/* ---------- Pulau ambient (satu-satunya elemen yang "berani") */
.pulau{justify-self:center;display:flex;flex-direction:column;align-items:stretch;min-width:180px;max-width:min(560px,calc(100vw - 32px));padding:6px 14px;border-radius:20px;
  background:#15161B;color:#F1F2F6;box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 8px 28px rgba(10,12,20,.32);text-align:left;overflow:hidden}
:root[data-tema="gelap"] .pulau{background:#05060A}
.pulau-ringkas{display:flex;align-items:center;justify-content:center;gap:8px;font-size:var(--huruf-ukuran-kecil);font-weight:600;white-space:nowrap}
.titik-hidup{width:7px;height:7px;border-radius:50%;background:#8FE0BD}
.titik-hidup.sibuk{background:#ABAAFF;animation:denyut 1.6s var(--gerak-pegas) infinite}
.pulau-isi{display:grid;gap:8px;padding:10px 2px 6px}
.pulau .tugas{display:grid;grid-template-columns:1fr 90px auto;gap:10px;align-items:center;font-size:var(--huruf-ukuran-kecil)}
.pulau .bar{height:5px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden}
.pulau .bar i{background:#ABAAFF}
.pulau .tugas.selesai .bar i{background:#8FE0BD}.pulau .tugas.gagal .bar i{background:#F5A9BB}
.baris-ekonomi{display:flex;gap:14px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);padding-top:8px}
.ekonomi{display:inline-flex;align-items:center;gap:4px;font-size:var(--huruf-ukuran-kecil);color:#C9CCD8}.ekonomi b{color:#fff}

/* ---------- pil dasbor */
.pil-dasbor{position:sticky;top:52px;z-index:20;display:flex;gap:4px;width:max-content;max-width:100%;margin:0 auto 16px;padding:4px;border-radius:var(--radius-pil);overflow-x:auto}
.pil-dasbor button{height:30px;padding:0 14px;border-radius:var(--radius-pil);font-size:var(--huruf-ukuran-kecil);font-weight:600;color:var(--warna-tinta-2);white-space:nowrap}
.pil-dasbor button[aria-pressed=true]{background:var(--warna-kaca-kuat);color:var(--warna-tinta);box-shadow:var(--efek-bayang-1)}

/* ---------- kanvas & widget */
.kanvas{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:16px;max-width:1280px;margin:0 auto;align-items:start}
.widget{border-radius:var(--radius-besar);padding:14px 16px 16px;min-width:0}
.widget.besar{grid-column:1/-1}
.w-kartu{grid-row:span 2}
.w-mutasi{grid-column:span 2;grid-row:span 2}
@media (max-width:1100px){.w-mutasi{grid-column:auto}}
.widget-kepala{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--warna-tinta-2);user-select:none}
.widget-kepala h3{margin:0;font-size:var(--huruf-ukuran-isi);font-weight:600;color:var(--warna-tinta);flex:1}
.tombol-dok{width:24px;height:24px;display:inline-grid;place-items:center;border-radius:50%;color:var(--warna-tinta-3)}
.tombol-dok:hover{background:var(--warna-garis);color:var(--warna-aksen)}
.angka-besar{font-size:var(--huruf-ukuran-angka);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.baris-tag{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0}
.tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-pil);font-size:var(--huruf-ukuran-mikro);font-weight:600;
  background:var(--warna-aksen-lembut);color:var(--warna-aksen);white-space:nowrap}
.tag.lembut{background:var(--warna-garis);color:var(--warna-tinta-2)}
.tag.naik,.tag.status-aktif,.tag.status-jalan,.tag.yakin-tinggi,.tag.slot-sehat{background:var(--warna-r0-latar);color:var(--warna-r0)}
.tag.turun,.tag.status-diputar_balik,.tag.yakin-rendah,.tag.slot-karantina,.tag.slot-sirkuit_terbuka,td.turun{background:var(--warna-r3-latar);color:var(--warna-r3)}
.tag.simulasi,.tag.status-jeda,.tag.yakin-sedang,.tag.slot-dibatasi,.tag.status-kandidat{background:var(--warna-r2-latar);color:var(--warna-r2)}
td.turun{background:none}
.kosong{display:flex;align-items:center;gap:8px;color:var(--warna-tinta-3);margin:4px 0}
.garis-kecil{width:100%;height:60px;margin:6px 0}
.garis-kecil path{fill:none;stroke:var(--warna-aksen);stroke-width:2;vector-effect:non-scaling-stroke}
.baris-mw{display:flex;align-items:center;gap:8px;color:var(--warna-tinta-3)}
.mesin-waktu{flex:1;accent-color:var(--warna-aksen)}
.cincin-wadah{display:flex;align-items:center;gap:16px}
.cincin{width:104px;height:104px;transform:rotate(-90deg)}
.cincin circle{fill:none;stroke-width:10;stroke-linecap:round}.cincin .jalur{stroke:var(--warna-garis)}.cincin .isi{stroke:var(--warna-r0)}
.cincin text{transform:rotate(90deg);transform-origin:60px 60px;font-size:20px;font-weight:700;fill:var(--warna-tinta)}
.baris-angka{display:flex;gap:20px;flex-wrap:wrap}.baris-angka>div{display:grid;gap:4px}.baris-angka b{font-size:var(--huruf-ukuran-judul)}
.baris-angka code{font-size:var(--huruf-ukuran-mikro);color:var(--warna-tinta-3)}
.meter-daftar{display:grid;gap:10px}
.meter-baris{display:grid;grid-template-columns:52px 1fr 56px;gap:10px;align-items:center}
.meter-baris .bar{height:8px;border-radius:4px;background:var(--warna-garis);overflow:hidden}
.meter-baris.panas .bar i{background:var(--warna-r3)}
.pil-daftar{display:flex;flex-wrap:wrap;gap:6px}
.tabel{width:100%;border-collapse:collapse;font-size:var(--huruf-ukuran-kecil)}
.tabel th{text-align:left;color:var(--warna-tinta-3);font-weight:600;padding:4px 6px}.tabel td{padding:6px;border-top:1px solid var(--warna-garis)}

/* ---------- daftar (smart list) */
.daftar{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.daftar li{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:var(--radius-kecil);min-width:0}
.daftar li:hover,.daftar li:focus-visible{background:var(--warna-garis)}
.daftar li.terpilih{background:var(--warna-aksen-lembut)}
.judul-baris{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.centang{color:var(--warna-tinta-3);display:inline-grid}.centang .ikon{stroke-width:1.4}.centang svg use{opacity:.55}
.terpilih .centang{color:var(--warna-aksen)}.terpilih .centang svg use{opacity:1}
.daftar.aturan s{color:var(--warna-r3)}
.tag-akun{width:150px;flex:none}
.tag-akun input{height:28px}

/* ---------- ikon stepper */
.stepper{list-style:none;margin:8px 0;padding:0;display:flex;align-items:flex-start}
.tahap{flex:1;display:grid;justify-items:center;gap:6px;position:relative;min-width:0}
.tahap+.tahap::before{content:"";position:absolute;top:17px;right:calc(50% + 20px);left:calc(-50% + 20px);height:2px;background:var(--warna-garis)}
.tahap.selesai+.tahap::before{background:var(--warna-r0)}
.simpul{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--warna-garis);color:var(--warna-tinta-3)}
.tahap.selesai .simpul{background:var(--warna-r0-latar);color:var(--warna-r0)}
.tahap.jalan .simpul{background:var(--warna-aksen-lembut);color:var(--warna-aksen);animation:denyut-aksen 1.8s var(--gerak-pegas) infinite}
.tahap.tahan .simpul{background:var(--warna-r3-latar);color:var(--warna-r3)}
@keyframes denyut-aksen{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--warna-aksen) 45%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:none}}
.label-tahap{font-size:var(--huruf-ukuran-mikro);color:var(--warna-tinta-3);max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* ---------- kartu keputusan */
.tumpukan{display:grid;gap:10px}
.kartu-k{border-radius:var(--radius-sedang);padding:12px;background:var(--warna-kaca-kuat);box-shadow:var(--efek-garis-dalam);border-left:3px solid var(--warna-r4)}
.kartu-k.kelas-r3{border-left-color:var(--warna-r3)}.kartu-k.kelas-r2{border-left-color:var(--warna-r2)}.kartu-k.kelas-r4{border-left-color:var(--warna-r1)}
.kartu-k header{display:flex;align-items:center;gap:8px}
.kartu-k h4{margin:0;font-size:var(--huruf-ukuran-isi);font-weight:600;flex:1;min-width:0}
.lencana{font-size:var(--huruf-ukuran-mikro);font-weight:700;padding:2px 7px;border-radius:6px;background:var(--warna-r4-latar);color:var(--warna-r4)}
.lencana.kelas-r0{background:var(--warna-r0-latar);color:var(--warna-r0)}.lencana.kelas-r1{background:var(--warna-r1-latar);color:var(--warna-r1)}
.lencana.kelas-r2{background:var(--warna-r2-latar);color:var(--warna-r2)}.lencana.kelas-r3,.lencana.kelas-ditolak{background:var(--warna-r3-latar);color:var(--warna-r3)}
.aksi-kartu{display:flex;align-items:center;gap:6px;margin-top:8px}
.kode-2fa{width:84px;height:32px;border-radius:var(--radius-kecil);border:1px solid var(--warna-garis);background:var(--warna-kaca-kuat);text-align:center;letter-spacing:.2em}
.kode-2fa.kode-env{width:min(200px,30vw);letter-spacing:0;text-align:left;padding:0 8px;font-variant-numeric:tabular-nums}
.getar{animation:getar .35s}
@keyframes getar{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
.tombol-utama{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border-radius:var(--radius-pil);background:var(--warna-aksen);color:var(--warna-aksen-tinta);font-weight:600}
.tombol-ikon{width:32px;height:32px;display:inline-grid;place-items:center;border-radius:50%;color:var(--warna-tinta-2)}
.tombol-ikon:hover{background:var(--warna-garis)}
.pil{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:var(--radius-pil);background:var(--warna-garis);color:var(--warna-tinta);
  font-size:var(--huruf-ukuran-kecil);font-weight:600;text-decoration:none}
.pil[aria-pressed=true]{background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.pil.bahaya{background:var(--warna-r3-latar);color:var(--warna-r3)}
.pil.kat-fitur{background:#CFC4FF;color:#2B2160}.pil.kat-efisiensi{background:#BFE6D6;color:#14432F}
.pil.kat-keamanan{background:#C9E4FF;color:#173A5E}.pil.kat-perbaikan{background:#FFD9BF;color:#5A2C10}

/* ---------- dock aplikasi */
.dok-app{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:25;display:flex;gap:6px;padding:8px;border-radius:24px;max-width:calc(100vw - 32px);overflow-x:auto}
.dok-app button{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:14px;background:var(--warna-kaca-kuat);color:var(--warna-aksen);
  box-shadow:var(--efek-garis-dalam);transition:transform var(--gerak-cepat) var(--gerak-pegas)}
.dok-app button .ikon{width:24px;height:24px}
.dok-app button:hover{transform:translateY(-6px) scale(1.08)}
.label-app{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- laci slide-over, jendela app, sorot, intip, massal */
.laci{position:fixed;top:52px;right:8px;bottom:8px;width:min(440px,calc(100vw - 16px));z-index:40;border-radius:var(--radius-besar);display:flex;flex-direction:column}
.laci-kepala,.jendela-kepala{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--warna-garis)}
.laci-kepala h2,.jendela-kepala h2{margin:0;font-size:var(--huruf-ukuran-sedang);flex:1}
.laci-isi{overflow:auto;padding:12px 14px;display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:max-content;gap:10px;align-content:start}
.laci[data-konteks=migrasi]{width:min(680px,calc(100vw - 16px))}
.gulir-x{overflow-x:auto;overflow-y:hidden;max-width:100%}
.tabel.angka-kanan td{text-align:right;font-variant-numeric:tabular-nums}.tabel.angka-kanan thead th:not(:first-child){text-align:right}
.laci-isi h4{margin:8px 0 0;color:var(--warna-tinta-3)}
.akordeon{border-radius:var(--radius-sedang);background:var(--warna-garis);padding:8px 12px}
.akordeon summary{cursor:pointer;font-weight:600}
.isi-dok{color:var(--warna-tinta-2);line-height:1.6}
.cari-dok,.cari-pintar,.form-ajari input,.form-ajari select,.form-surel input,dw-combobox input{height:32px;padding:0 10px;border-radius:var(--radius-kecil);
  border:1px solid var(--warna-garis);background:var(--warna-kaca-kuat);min-width:0;width:100%}
.form-ajari{display:grid;grid-template-columns:1fr 1fr auto auto;gap:6px;align-items:center}
.rilis{border-radius:var(--radius-sedang);background:var(--warna-kaca-kuat);box-shadow:var(--efek-garis-dalam);padding:10px 12px}
.rilis header{display:flex;gap:8px;align-items:center}
.perubahan{list-style:none;margin:6px 0;padding:0;display:grid;gap:4px}.perubahan li{display:flex;gap:8px;align-items:center}
.perubahan .pil{height:22px;padding:0 6px}
.jendela{position:fixed;left:50%;top:62px;transform:translateX(-50%);width:min(1040px,calc(100vw - 32px));height:calc(100dvh - 160px);z-index:35;border-radius:var(--radius-besar);display:flex;flex-direction:column}
.lampu{display:flex;gap:7px}.lampu button,.lampu i{width:12px;height:12px;border-radius:50%;background:#E8706B}.lampu i{background:var(--warna-garis)}
.jendela-isi{overflow:auto;padding:14px;display:grid;gap:12px;align-content:start}
.baris-alat{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cari-label{display:flex;align-items:center;gap:6px;flex:1;min-width:220px}
.dua-kolom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:14px}
.form-surel{display:grid;gap:8px}.form-surel label{display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:center}
.bingkai-surel{width:100%;height:420px;border:1px solid var(--warna-garis);border-radius:var(--radius-sedang);background:#fff}
.dropzone{display:flex;align-items:center;justify-content:center;gap:10px;height:84px;border-radius:var(--radius-sedang);border:1.5px dashed color-mix(in srgb,var(--warna-aksen) 45%,transparent);color:var(--warna-aksen)}
.tetes{position:fixed;inset:0;z-index:60;pointer-events:none;display:grid;place-content:center;justify-items:center;gap:10px;background:color-mix(in srgb,var(--warna-aksen) 14%,transparent);
  color:var(--warna-aksen);font-size:var(--huruf-ukuran-judul);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.tetes .ikon{width:56px;height:56px}
.sorot-latar,.intip-latar{position:fixed;inset:0;z-index:50;background:rgba(10,12,20,.18);display:grid;justify-items:center;align-items:start;padding-top:14vh}
.sorot{width:min(640px,calc(100vw - 32px));border-radius:var(--radius-besar);padding:6px}
.sorot-input{display:flex;align-items:center;gap:10px;padding:8px 12px}
.sorot-input input{flex:1;border:0;background:none;font-size:var(--huruf-ukuran-besar);outline:none}
.sorot-pil{display:flex;gap:6px;flex-wrap:wrap;padding:0 12px}
.pil-tag{display:inline-flex;align-items:baseline;gap:6px;padding:3px 10px;border-radius:var(--radius-pil);background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.pil-tag small{color:var(--warna-tinta-3);font-size:var(--huruf-ukuran-mikro)}
.kartu-pratinjau{margin:8px 12px;padding:10px 12px;border-radius:var(--radius-sedang);background:var(--warna-garis)}
.kartu-pratinjau.terkunci{opacity:.7}
.sorot-daftar{list-style:none;margin:0;padding:4px 6px 8px;max-height:260px;overflow:auto}
.sorot-daftar li{display:flex;gap:8px;align-items:center;padding:7px 8px;border-radius:var(--radius-kecil);cursor:pointer;color:var(--warna-tinta-2)}
.sorot-daftar li[aria-selected=true],.sorot-daftar li:hover{background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.intip{width:min(900px,calc(100vw - 32px));height:76vh;border-radius:var(--radius-besar);overflow:hidden;display:grid}
.intip iframe{width:100%;height:100%;border:0;background:#fff}
#intip-isi{padding:16px;display:grid;gap:10px;align-content:start;overflow:auto}
.intip-latar[data-jenis=kartu] .intip{height:auto;max-height:76vh;width:min(720px,calc(100vw - 32px))}
.intip-latar[data-jenis=kartu] iframe{display:none}
.rincian-kartu{display:grid;gap:8px;padding:0 4px}
.massal{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);z-index:45;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 16px;border-radius:var(--radius-pil);
  max-width:calc(100vw - 32px)}
#massal-aksi{display:flex;gap:6px;align-items:center}
.massal dw-combobox{width:200px}
dw-combobox{position:relative;display:block}
.cb-daftar{position:absolute;z-index:70;left:0;right:0;top:calc(100% + 4px);list-style:none;margin:0;padding:4px;border-radius:var(--radius-sedang);max-height:240px;overflow:auto;min-width:220px}
.cb-daftar li{display:flex;gap:6px;align-items:center;padding:6px 8px;border-radius:var(--radius-kecil);cursor:pointer}
.cb-daftar li small{margin-left:auto;color:var(--warna-tinta-3);font-size:var(--huruf-ukuran-mikro)}
.cb-daftar li[aria-selected=true]{background:var(--warna-aksen-lembut);color:var(--warna-aksen)}
.kabar{position:fixed;right:16px;bottom:84px;z-index:80;display:grid;gap:8px}
.kabar-item{padding:8px 14px;border-radius:var(--radius-pil);background:var(--warna-kaca-kuat);box-shadow:var(--efek-bayang-2);font-weight:600;
  -webkit-backdrop-filter:var(--efek-kaca-saring);backdrop-filter:var(--efek-kaca-saring)}
.kabar-item.lulus{color:var(--warna-r0)}.kabar-item.galat{color:var(--warna-r3)}
.memuat{height:80px;border-radius:var(--radius-sedang);background:linear-gradient(90deg,var(--warna-garis),transparent,var(--warna-garis));background-size:200% 100%;animation:kilau 1.2s linear infinite}
@keyframes kilau{to{background-position:-200% 0}}
.mentah{font-size:var(--huruf-ukuran-mikro);white-space:pre-wrap;color:var(--warna-tinta-3)}

/* ---------- privasi layar (⌘⇧H) */
:root[data-privasi="1"] .uang,:root[data-privasi="1"] .rek,:root[data-privasi="1"] code{filter:blur(7px);transition:filter var(--gerak-cepat)}
:root[data-privasi="1"] #tombol-privasi{color:var(--warna-r3)}

/* ---------- halaman masuk */
.hal-masuk{display:grid;place-items:center;padding:16px}
.kotak-masuk{width:min(360px,100%);display:grid;gap:12px;padding:24px;border-radius:var(--radius-besar)}
.kotak-masuk label{display:grid;gap:4px;font-size:var(--huruf-ukuran-kecil);color:var(--warna-tinta-2)}
.kotak-masuk input,.kotak-masuk select{height:36px;padding:0 10px;border-radius:var(--radius-kecil);border:1px solid var(--warna-garis);background:var(--warna-kaca-kuat)}
.kotak-masuk .tombol-utama{justify-content:center;height:38px}
.galat{color:var(--warna-r3);margin:0}

@media (max-width:720px){
  body{padding:60px 16px 104px}
  .bilah{grid-template-columns:auto 1fr auto}
  .jam,.meter-biaya,#tombol-brief,#tombol-bahasa,#tombol-privasi,.pil-ikon kbd,.lencana-versi span,.merek{display:none}
  .bilah{grid-template-columns:auto 1fr auto;gap:6px}
  .pulau{min-width:0;max-width:52vw;justify-self:center}
  .pulau-ringkas{overflow:hidden;text-overflow:ellipsis}
  .dok-app button{width:42px;height:42px}
  .dua-kolom,.form-ajari{grid-template-columns:1fr}
  .tag-akun{width:100px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
:root[data-gerak="kurang"] *{animation:none!important;transition:none!important}

/* ---------- batch 2: armada, ad stack, theme builder, kartu identitas */
.armada li{flex-wrap:nowrap}.armada .domain{font-weight:600}
.grup-pil{display:inline-flex;gap:2px;padding:2px;border-radius:var(--radius-pil);background:var(--warna-garis)}.grup-pil .pil{background:none}
.grup-pil .pil:hover{background:var(--warna-kaca-kuat)}
.pil.utama{background:var(--warna-aksen);color:var(--warna-aksen-tinta)}
.massal{flex-wrap:wrap;justify-content:center;border-radius:22px}
.sentinel{height:1px}
.form-ajari.tiga{grid-template-columns:1.2fr .8fr 1fr}.form-ajari.dua{grid-template-columns:1fr auto}
.tabel.matriks th,.tabel.matriks td{vertical-align:top}.tabel.matriks td .tag{margin:2px}
.tag.mutu-hijau{background:var(--warna-r0-latar);color:var(--warna-r0)}.tag.mutu-abu{background:var(--warna-r2-latar);color:var(--warna-r2)}
.tag.mutu-merah{background:var(--warna-r3-latar);color:var(--warna-r3)}
.belah-tema{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:14px;height:100%;min-height:0}
.kontrol-tema{display:grid;gap:10px;align-content:start;overflow:auto}
.baris-tema{display:grid;gap:6px}
.bingkai-tema{width:100%;height:100%;min-height:520px;border:1px solid var(--warna-garis);border-radius:var(--radius-sedang);background:#fff}
.pil[class*="palet-"]::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--contoh,var(--warna-aksen))}
.form-identitas{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;align-items:end}
.form-identitas label{display:grid;gap:4px}
.form-identitas label>.tag,.baris-tema>.tag{justify-self:start}
.form-identitas input,.form-identitas select,.baris-alat select{height:32px;padding:0 8px;border-radius:var(--radius-kecil);border:1px solid var(--warna-garis);background:var(--warna-kaca-kuat);min-width:0}
.pratinjau-ttd svg{max-width:320px;height:auto}
.pilih-berkas,.form-identitas .pilih-berkas{display:flex;align-items:center;gap:8px;min-width:0;cursor:pointer;align-self:end}
.pilih-berkas input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.pilih-berkas:focus-within .pil{outline:2px solid var(--warna-aksen);outline-offset:2px}
.pilih-berkas .nama-berkas{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pilih-berkas img{width:32px;height:32px;border-radius:8px;object-fit:cover}
.pil{white-space:nowrap}
.armada{padding-bottom:var(--ruang-massal,0px)}
body.ada-massal{--ruang-massal:120px}
@media (max-width:720px){.belah-tema{grid-template-columns:1fr}.form-ajari.tiga{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- laci migrasi WordPress */
.laci[data-konteks=wordpress]{width:min(760px,calc(100vw - 16px))}
.wp-form{display:grid;gap:8px;padding:10px;border-radius:14px;background:var(--warna-latar-2)}
.wp-form input[type=text],.wp-form input[type=search],.wp-form select{min-width:0;flex:1 1 140px}
.wp-stepper{margin:4px 0 10px}
.wp-stepper .label-tahap{font-size:.68rem;text-align:center;line-height:1.15;overflow-wrap:normal;word-break:keep-all}
.wp-stepper.mini{margin:0;gap:0}
.wp-stepper.mini .tahap{gap:0}
.wp-stepper.mini .simpul{width:14px;height:14px;padding:0}
.wp-stepper.mini .simpul svg{display:none}
.wp-stepper.mini .tahap+.tahap::before{top:6px;right:calc(50% + 7px);left:calc(-50% + 7px)}
.wp-tabel td,.wp-tabel th{vertical-align:middle;white-space:nowrap}
.wp-tabel td.wp-mini{min-width:220px;width:100%}
.wp-tabel tr.aktif th{color:var(--warna-aksen)}
.tautan-polos{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left}
.tautan-polos:hover,.tautan-polos:focus-visible{color:var(--warna-aksen);text-decoration:underline}
.wp-massal{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px;border-radius:999px;
  -webkit-backdrop-filter:var(--efek-kaca-saring);backdrop-filter:var(--efek-kaca-saring);background:var(--warna-kaca-kuat);
  box-shadow:var(--efek-garis-dalam),var(--efek-bayang-1)}
@media (max-width:640px){.wp-stepper:not(.mini) .label-tahap{display:none}.wp-tabel td.wp-mini{min-width:160px}}

/* v2.8 — laci Pengaturan Sistem */
.editor-konfig { width: 100%; min-height: 18rem; font-family: var(--huruf-mono); font-size: var(--huruf-ukuran-kecil); line-height: 1.5;
  tab-size: 2; resize: vertical; padding: var(--ruang-3); border-radius: var(--radius-sedang); border: 1px solid var(--warna-garis); background: var(--warna-kaca);
  color: inherit; }
.qr-2fa { display: block; width: 220px; height: 220px; margin: var(--ruang-2) 0; background: #fff; padding: var(--ruang-2); border-radius: var(--radius-sedang); image-rendering: pixelated; }
.pil.redup{opacity:.55}.grid-warna{display:grid;grid-template-columns:1fr 1fr;gap:6px}.warna-tema{display:flex;align-items:center;gap:6px;font-size:13px}.warna-tema input{width:34px;height:26px;padding:0;border:0;background:none}.kotak-tautan input{width:100%}