/*
 * Media Utrujah. Alasan keputusan desain (R-31):
 * - Warna: hijau #1D6B3A (identitas Utrujah, aksi utama), oranye #E87722 hanya untuk satu hal: penanda "hari ini" dan fokus.
 *   Status memakai abu, hijau, oranye saja (tiga arti: belum jalan, jalan/selesai, perlu keputusan).
 * - Huruf: Baloo 2 untuk judul dan angka (huruf resmi merek), huruf sistem untuk tabel dan formulir agar mudah dibaca.
 * - Datar: kartu hanya berbatas tipis. Tidak ada bayangan, blur, atau glow; elevasi hanya untuk menu HP yang melayang.
 * - Sudut: tombol dan input 10px, kartu 14px, chip status bulat karena memang label status.
 */
:root{
  --hijau:#1D6B3A; --hijau-tua:#14502b; --hijau-muda:#e3efe7; --hijau-tipis:#f1f6f3;
  --oranye:#E87722; --oranye-muda:#fbeedd; --oranye-tua:#7a3d05;
  --tinta:#1c2420; --abu:#5a665f; --garis:#dde3df; --latar:#f5f6f3; --putih:#fff;
  --merah:#b3261e; --merah-muda:#fbeceb;
  --tinta-2:#33423a; --st-bg:#e8ebe8; --st-teks:#3c4943; --kolom:#ebeeeb; --garis-kuat:#a9bfb0; --merah-garis:#e6b9b5;
  --kini-bg:#fffaf4; --biru-muda:#e3edf8; --biru-tua:#1f4f82; --kartu-2:#f7f8f6; --bayang:0 10px 30px rgba(0,0,0,.12);
  /* warna kategori kalender: dipakai sebagai garis kiri dan teks, sama seperti contoh linimasa */
  --ev-biru:#2f6fd8; --ev-hijau:#1d8a4b; --ev-ungu:#8a4fd1; --ev-oranye:#d9731a; --ev-teal:#0f8f88; --ev-abu:#6b7570; --ev-rose:#c2415a;
  color-scheme:light;
  --lebar-sidebar:244px;
  --judul:"Baloo 2", ui-rounded, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color:var(--tinta); line-height:1.5;
}
/* Mode gelap: ikut pengaturan perangkat, kecuali pengguna memilih sendiri lewat tombol (data-tema disimpan di localStorage). */
:root[data-tema="gelap"]{
  --hijau:#3aa767; --hijau-tua:#93dab0; --hijau-muda:#173524; --hijau-tipis:#122219;
  --oranye:#f0913f; --oranye-muda:#3a2612; --oranye-tua:#f6bd85;
  --tinta:#e8ece9; --abu:#9aa69f; --garis:#2b302d; --latar:#0b0c0c; --putih:#171918;
  --merah:#ff8f85; --merah-muda:#3a1c1a;
  --tinta-2:#d2d9d4; --st-bg:#262a28; --st-teks:#cfd6d1; --kolom:#121413; --garis-kuat:#3d4741; --merah-garis:#6b2e2a;
  --kini-bg:#1d1710; --biru-muda:#16263d; --biru-tua:#9cc1f5; --kartu-2:#1d201e; --bayang:0 10px 30px rgba(0,0,0,.5);
  --ev-biru:#5b93f0; --ev-hijau:#35c072; --ev-ungu:#b07cf0; --ev-oranye:#f39a45; --ev-teal:#3cc8bf; --ev-abu:#8f9a94; --ev-rose:#ec7b92;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="terang"]){
  --hijau:#3aa767; --hijau-tua:#93dab0; --hijau-muda:#173524; --hijau-tipis:#122219;
  --oranye:#f0913f; --oranye-muda:#3a2612; --oranye-tua:#f6bd85;
  --tinta:#e8ece9; --abu:#9aa69f; --garis:#2b302d; --latar:#0b0c0c; --putih:#171918;
  --merah:#ff8f85; --merah-muda:#3a1c1a;
  --tinta-2:#d2d9d4; --st-bg:#262a28; --st-teks:#cfd6d1; --kolom:#121413; --garis-kuat:#3d4741; --merah-garis:#6b2e2a;
  --kini-bg:#1d1710; --biru-muda:#16263d; --biru-tua:#9cc1f5; --kartu-2:#1d201e; --bayang:0 10px 30px rgba(0,0,0,.5);
  --ev-biru:#5b93f0; --ev-hijau:#35c072; --ev-ungu:#b07cf0; --ev-oranye:#f39a45; --ev-teal:#3cc8bf; --ev-abu:#8f9a94; --ev-rose:#ec7b92;
  color-scheme:dark;
  }
}
*{box-sizing:border-box}
body{margin:0;background:var(--latar);min-height:100vh}
a{color:var(--hijau)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--oranye);outline-offset:2px}
h1,h2,.besar,.merek b{font-family:var(--judul);letter-spacing:0}
h1{font-size:1.9rem;margin:0 0 .2rem;line-height:1.15;font-weight:700}
h2{font-size:1.15rem;margin:0 0 .7rem;line-height:1.25;font-weight:700}
h3{font-size:1rem;margin:1rem 0 .5rem}
.sub{color:var(--abu);margin:0 0 1rem;max-width:62ch}

/* ===== Kerangka ===== */
.app{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--lebar-sidebar);background:var(--putih);border-right:1px solid var(--garis);display:flex;flex-direction:column;padding:1rem .8rem;overflow-y:auto;z-index:20}
.utama{flex:1;margin-left:var(--lebar-sidebar);min-width:0}
.isi{max-width:1240px;margin:0 auto;padding:1.5rem 1.6rem 3rem}
body.tamu .isi{max-width:480px;padding-top:3.5rem}
.merek{display:block;text-decoration:none;color:var(--tinta);padding:.1rem .3rem .8rem}
.merek img{display:block;height:44px;width:auto;max-width:100%}
.merek small{display:block;margin-top:.35rem;font-size:.8rem;color:var(--abu)}
.akun{border-top:1px solid var(--garis);border-bottom:1px solid var(--garis);padding:.7rem .3rem;margin-bottom:.6rem;display:flex;flex-direction:column;gap:.05rem;font-size:.92rem}
.akun .sapa{font-size:.8rem;color:var(--abu)}
.chip-peran{align-self:flex-start;margin-top:.3rem;font-size:.75rem;font-weight:600;color:var(--hijau-tua);background:var(--hijau-muda);border-radius:99px;padding:.05rem .6rem}
.nav{display:flex;flex-direction:column;gap:.1rem;flex:1}
.nav-judul{font-size:.8rem;font-weight:700;color:var(--abu);margin:1rem .6rem .3rem}
.nav a,.sidebar-bawah a{display:flex;align-items:center;gap:.65rem;color:var(--tinta-2);text-decoration:none;padding:.55rem .7rem;border-radius:10px;font-size:.93rem;font-weight:500}
.nav a:hover,.sidebar-bawah a:hover{background:var(--hijau-tipis)}
.nav a[aria-current=page]{background:var(--hijau-muda);color:var(--hijau-tua);font-weight:700}
.sidebar-bawah{border-top:1px solid var(--garis);padding-top:.5rem;margin-top:.6rem}
.ik{flex:none}
.atas-hp,.tirai{display:none}
@media (max-width:960px){
  .sidebar{transform:translateX(-102%);transition:transform .18s ease}
  body.menu-buka .sidebar{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.3)}
  .utama{margin-left:0}
  .atas-hp{display:flex;align-items:center;gap:.7rem;background:var(--hijau);color:#fff;padding:.5rem .9rem;position:sticky;top:0;z-index:10}
  .atas-hp .merek-kecil{color:#fff;font-family:var(--judul);font-weight:700;font-size:1.1rem;text-decoration:none}
  .tombol-menu{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6);border-radius:10px;font-size:1.1rem;padding:.2rem .7rem;min-height:44px;min-width:44px;cursor:pointer}
  body.menu-buka .tirai{display:block;position:fixed;inset:0;z-index:15}
  .isi{padding:1rem .9rem 3rem}
  h1{font-size:1.6rem}
}
@media (prefers-reduced-motion:reduce){.sidebar{transition:none}}

/* ===== Komponen umum ===== */
.kartu{background:var(--putih);border:1px solid var(--garis);border-radius:14px;padding:1.1rem 1.2rem;margin-bottom:1rem}
.baris-judul{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.baris-judul h1,.baris-judul h2{margin-bottom:0}
.baris-judul>div:first-child{flex:1 1 280px;min-width:0}
.baris-judul>.btn,.baris-judul>.tombol-baris,.baris-judul>form{flex:none}
.grid-dua{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:1rem;align-items:start}
.grid-tiga{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1rem;align-items:start}
.tumpuk{display:flex;flex-direction:column;gap:.5rem}
.tombol-baris{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.redup{color:var(--abu)} .kecil{font-size:.85rem}
.gulir{overflow-x:auto}
.hitung{background:var(--hijau-muda);color:var(--hijau-tua);border-radius:99px;padding:0 .55rem;font-size:.8rem;font-family:ui-sans-serif,system-ui,sans-serif;font-weight:600;margin-left:.3rem}
.naik{color:var(--hijau);font-weight:600} .turun{color:var(--merah);font-weight:600}
.peringatan-teks{background:var(--oranye-muda);color:var(--oranye-tua);padding:.6rem .8rem;border-radius:10px}

/* Angka ringkas: satu baris datar, angka sebagai isi, bukan hiasan */
.angka-ringkas{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.75rem;margin-bottom:1.1rem}
.angka-ringkas .kartu{margin:0;display:flex;flex-direction:column;gap:.1rem;padding:.85rem 1rem}
.angka-ringkas .kartu span:last-child{font-size:.85rem;color:var(--abu)}
.besar{font-size:1.9rem;font-weight:800;color:var(--tinta);line-height:1.1}
.kartu.peringatan{border-color:var(--merah-garis);background:var(--merah-muda)}
.kartu.peringatan .besar{color:var(--merah)}

/* Form */
.form{display:grid;gap:.85rem}
.dua-kolom{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.penuh{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:.3rem;font-size:.9rem;font-weight:600;color:var(--tinta-2)}
label.cek{flex-direction:row;align-items:center;gap:.45rem;font-weight:400;color:var(--tinta)}
fieldset{border:1px solid var(--garis);border-radius:10px;padding:.6rem .85rem;display:flex;flex-wrap:wrap;gap:.4rem 1rem}
fieldset legend{font-size:.9rem;font-weight:600;padding:0 .3rem}
input,select,textarea{font:inherit;font-weight:400;padding:.6rem .75rem;border:1px solid var(--garis-kuat);border-radius:10px;background:var(--putih);color:var(--tinta);min-height:44px;width:100%}
label.cek input{width:auto;min-height:auto}
textarea{resize:vertical}
input:disabled,select:disabled,textarea:disabled{background:var(--kartu-2);color:var(--abu)}
.satu-baris{display:flex;gap:.5rem;align-items:center}
.satu-baris input{flex:1}
.saring{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:1rem}
.saring select,.saring input{width:auto;min-width:130px}
.btn{font:inherit;font-weight:700;border-radius:10px;padding:.55rem 1.1rem;border:1px solid transparent;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;min-height:44px}
.btn.utama{background:var(--hijau);color:#fff}
.btn.utama:hover{background:var(--hijau-tua)}
.btn.sekunder{background:var(--putih);color:var(--hijau-tua);border-color:var(--garis-kuat)}
.btn.sekunder:hover{background:var(--hijau-tipis)}
.btn.tipis{background:transparent;color:var(--hijau-tua);border-color:var(--garis);padding:.3rem .7rem;min-height:36px;font-weight:600}
.pesan{background:var(--hijau-muda);color:var(--hijau-tua);padding:.7rem 1rem;border-radius:10px;margin-bottom:1rem}
.pesan.galat{background:var(--merah-muda);color:var(--merah)}
details summary{cursor:pointer;color:var(--hijau-tua);font-weight:600}
.sempit{max-width:460px;margin:0 auto}
code{background:var(--hijau-tipis);padding:.1rem .4rem;border-radius:6px;font-size:.88rem;word-break:break-all}

/* Kartu konten */
.kk{display:flex;flex-direction:column;gap:.2rem;padding:.65rem .8rem;border:1px solid var(--garis);border-radius:10px;background:var(--putih);text-decoration:none;color:var(--tinta)}
.kk:hover{border-color:var(--hijau);background:var(--hijau-tipis)}
.kk-judul{font-weight:600;font-size:.93rem}
.kk-meta{font-size:.82rem;color:var(--abu)}
.kk.telat{border-color:var(--merah-garis)}
.lencana{align-self:flex-start;font-size:.75rem;background:var(--oranye-muda);color:var(--oranye-tua);border-radius:99px;padding:0 .6rem;font-weight:600}
.lencana.telat{background:var(--merah-muda);color:var(--merah)}
/* Status: abu = belum jalan, hijau = jalan/selesai, oranye = menunggu keputusan orang */
.st{display:inline-block;font-size:.78rem;font-weight:600;border-radius:99px;padding:.05rem .65rem;background:var(--st-bg);color:var(--st-teks);align-self:flex-start;white-space:nowrap}
.st-produksi{background:var(--putih);color:var(--hijau-tua);box-shadow:inset 0 0 0 1.5px var(--hijau)}
.st-review,.st-persetujuan{background:var(--oranye-muda);color:var(--oranye-tua)}
.st-terjadwal{background:var(--hijau-muda);color:var(--hijau-tua)}
.st-tayang,.st-selesai{background:var(--hijau);color:#fff}

/* Papan */
.papan{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:.8rem;overflow-x:auto;padding-bottom:.6rem}
.kolom{background:var(--kolom);border-radius:14px;padding:.8rem;min-height:220px}
.kolom h2{font-size:1rem;color:var(--tinta)}

/* ===== Kalender dengan rentang yang bisa ditarik ===== */
.kal-kepala{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;padding:0 0 .3rem}
.kal-hari{font-size:.82rem;font-weight:700;color:var(--abu);text-align:center;padding:.3rem 0}
.kal-minggu{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:30px;grid-auto-rows:26px;gap:3px 6px;position:relative;margin-bottom:6px;min-height:104px}
.kal-bg{grid-row:1/-1;border:1px solid var(--garis);border-radius:10px;background:var(--putih);padding:.25rem .45rem;display:flex;justify-content:space-between;align-items:flex-start;font-weight:700;font-size:.88rem;touch-action:none;user-select:none}
.kal-bg.luar{background:var(--latar);color:var(--abu);font-weight:500}
.kal-bg.hari-ini{border:2px solid var(--oranye)}
.kal-bg.sorot{background:var(--hijau-muda);border-color:var(--hijau)}
.kal-tambah{text-decoration:none;width:24px;height:24px;display:inline-grid;place-items:center;border-radius:8px;color:var(--abu);font-weight:600}
.kal-tambah:hover{background:var(--hijau-muda);color:var(--hijau-tua)}
.kal-item{position:relative;z-index:2;display:flex;align-items:center;gap:.3rem;min-width:0;font-size:.78rem;font-weight:600;text-decoration:none;color:var(--st-teks);background:var(--st-bg);border-radius:7px;padding:0 .5rem;overflow:hidden;white-space:nowrap;margin:0 2px;cursor:pointer;touch-action:none;user-select:none}
.kal-item.bisa{cursor:grab}
.kal-item.tarik{opacity:.55;cursor:grabbing}
.kal-item.lanjut-kiri{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-4px}
.kal-item.lanjut-kanan{border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-4px}
.kal-item .jdl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.kal-item .dur{font-weight:700;font-size:.72rem}
.kal-item .gagang{position:absolute;top:0;bottom:0;width:9px;cursor:ew-resize}
.kal-item .gagang.k{left:0}.kal-item .gagang.r{right:0}
.kal-item.bisa:hover .gagang{background:rgba(0,0,0,.14)}
.kal-item.st-produksi{background:var(--putih);color:var(--hijau-tua);box-shadow:inset 0 0 0 1.5px var(--hijau)}
.kal-item.st-review,.kal-item.st-persetujuan{background:var(--oranye-muda);color:var(--oranye-tua)}
.kal-item.st-terjadwal{background:var(--hijau-muda);color:var(--hijau-tua)}
.kal-item.st-tayang,.kal-item.st-selesai{background:var(--hijau);color:#fff}
.hanya-hp{display:none}
@media (max-width:700px){
  .kal-minggu{grid-template-rows:26px;grid-auto-rows:22px;gap:2px 3px;min-height:82px}
  .kal-kepala{gap:3px}
  .kal-bg{padding:.15rem .25rem;font-size:.78rem}
  .kal-tambah{display:none}
  .kal-item{font-size:.68rem;padding:0 .25rem}
  .kal-item .dur{display:none}
  .hanya-hp{display:block}
}

/* Tabel */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{text-align:left;padding:.6rem .6rem;border-bottom:1px solid var(--garis);vertical-align:middle}
th{font-weight:700;color:var(--abu);white-space:nowrap;font-size:.84rem;background:var(--hijau-tipis)}
tbody tr:hover{background:var(--hijau-tipis)}
td.lebar{min-width:260px}
td a.judul-baris{color:var(--tinta);font-weight:600;text-decoration:none}
td a.judul-baris:hover{color:var(--hijau);text-decoration:underline}
.riwayat{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-direction:column;font-size:.92rem}
.riwayat li{padding:.65rem 0;border-top:1px solid var(--garis)}
.aksi-status textarea{min-height:60px}
.batang{display:grid;grid-template-columns:minmax(120px,1fr) 2fr auto;gap:.5rem;align-items:center;font-size:.9rem;margin:.3rem 0}
.batang-isi{height:10px;border-radius:5px;background:linear-gradient(to right,var(--hijau) var(--w),var(--hijau-muda) var(--w))}

/* Pemberitahuan singkat (pengganti alert) */
#toast{position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%);background:var(--tinta);color:#fff;padding:.7rem 1.1rem;border-radius:10px;max-width:90vw;z-index:50}
#toast[hidden]{display:none}

/* Cetak */
.hanya-cetak{display:none}
@media print{
  .sidebar,.atas-hp,.tanpa-cetak,.pesan,.tirai{display:none!important}
  .hanya-cetak{display:block}
  body{background:#fff}
  .utama{margin:0}
  .isi{padding:0;max-width:none}
  .laporan section{break-inside:avoid}
  a{color:inherit;text-decoration:none}
}
.grid-dua+.angka-ringkas{margin-top:1rem}

/* Papan: kolom lebar tetap, bisa digulir; kartu bisa ditarik */
.papan{grid-auto-columns:290px;padding-bottom:1rem}
.kolom{transition:background .12s}
.kolom.sorot{background:var(--hijau-muda);outline:2px dashed var(--hijau);outline-offset:-4px}
.kosong-kolom{margin:.5rem .2rem}
.kk.geser{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.kk.tarik{opacity:.4}
.kk.hantu{position:fixed;z-index:60;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.18);transform:rotate(1.5deg);background:var(--putih)}
dialog{border:1px solid var(--garis);border-radius:14px;padding:1.2rem;max-width:min(92vw,440px)}
dialog::backdrop{background:rgba(0,0,0,.35)}
select.ubah-status{min-height:36px;padding:.2rem .5rem;width:auto;min-width:150px;font-size:.85rem}
dialog .tombol-baris .btn{white-space:nowrap}

/* Kalender per jam (Hari/Pekan) */
.tab-tampil{display:inline-flex;border:1px solid var(--garis);border-radius:10px;overflow:hidden;margin-bottom:.8rem;background:var(--putih)}
.tab-tampil a{padding:.4rem 1rem;text-decoration:none;font-weight:600;color:var(--abu)}
.tab-tampil a[aria-current]{background:var(--hijau);color:#fff}
.jd{--jam:48px;--gutter:54px}
.jd-kepala,.jd-penuh,.jd-badan{display:grid;grid-template-columns:var(--gutter) repeat(var(--n),minmax(0,1fr))}
.jd.n1{--n:1}.jd.n7{--n:7}
.jd-h{text-align:center;padding:.4rem 0;text-decoration:none;color:var(--abu);font-weight:600;border-left:1px solid var(--garis)}
.jd-h b{display:inline-grid;place-items:center;min-width:1.9rem;height:1.9rem;border-radius:50%;color:var(--tinta);font-size:1.05rem}
.jd-h.hari-ini b{background:var(--oranye);color:#fff}
.jd-penuh{border-top:1px solid var(--garis);border-bottom:1px solid var(--garis);min-height:30px}
.jd-lbl{font-size:.7rem;color:var(--abu);padding:.4rem .3rem}
.jd-pc{border-left:1px solid var(--garis);padding:2px;display:flex;flex-direction:column;gap:2px}
.jd-chip{height:22px;margin:0}
.jd-gulir{max-height:62vh;overflow-y:auto;position:relative}
.jd-badan{position:relative;height:calc(var(--jam)*24)}
.jd-skala{position:relative}
.jd-skala div{position:absolute;right:6px;transform:translateY(-50%);font-size:.7rem;color:var(--abu)}
.jd-kol{position:relative;border-left:1px solid var(--garis);touch-action:none;user-select:none;
  background-image:linear-gradient(var(--garis) 1px,transparent 1px);background-size:100% var(--jam)}
.jd-kol.hari-ini{background-color:var(--kini-bg)}
.jd-kol.sorot{background-color:var(--hijau-muda)}
.jd-ev{position:absolute;z-index:2;overflow:hidden;border-radius:7px;padding:2px 6px;font-size:.75rem;line-height:1.25;background:var(--st-bg);color:var(--st-teks);cursor:pointer;touch-action:none}
.jd-ev b{font-weight:700}
.jd-ev.bisa{cursor:grab}.jd-ev.tarik{opacity:.6;cursor:grabbing;z-index:5}
.jd-ev.st-produksi{background:var(--putih);color:var(--hijau-tua);box-shadow:inset 0 0 0 1.5px var(--hijau)}
.jd-ev.st-review,.jd-ev.st-persetujuan{background:var(--oranye-muda);color:var(--oranye-tua)}
.jd-ev.st-terjadwal{background:var(--hijau-muda);color:var(--hijau-tua)}
.jd-ev.st-tayang,.jd-ev.st-selesai{background:var(--hijau);color:#fff}
.gagang-b{position:absolute;left:0;right:0;bottom:0;height:8px;cursor:ns-resize}
.jd-ev.bisa:hover .gagang-b{background:rgba(0,0,0,.14)}
.jd-kini{position:absolute;left:0;right:0;height:2px;background:var(--oranye);z-index:3}
@media (max-width:700px){.jd{--gutter:38px}.jd-ev{font-size:.66rem;padding:1px 3px}.jd-h span{display:none}.jd-skala div{font-size:.6rem;right:2px}}

/* Calon wali (PSB) */
.sorot-kartu{border:2px solid var(--oranye)}
.riwayat-psb{list-style:none;padding:0;margin:1rem 0;display:flex;flex-direction:column;gap:.6rem}
.riwayat-psb li{border-top:1px solid var(--garis);padding-top:.5rem}
details.kartu summary{cursor:pointer;list-style:none}
details.kartu summary::-webkit-details-marker{display:none}

.peringatan-baris{background:var(--merah-muda);color:var(--merah);border-radius:8px;padding:.6rem .9rem;margin:0 0 .8rem}

/* Gambar sampul kartu */
.thumb-kotak{display:flex;gap:1rem;align-items:flex-start}
.thumb-gbr{flex:none;width:96px;aspect-ratio:4/5;border-radius:10px;background:var(--hijau-muda);display:grid;place-items:center;overflow:hidden;text-align:center}
.thumb-gbr img{width:100%;height:100%;object-fit:cover}
.thumb-isi{min-width:0}
.kk-gbr{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:8px;margin-bottom:.4rem;background:var(--hijau-muda)}

/* Papan kartu mingguan */
.papan-kartu{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));gap:.6rem;overflow-x:auto;padding-bottom:.4rem}
.pk-hari{border:1px solid var(--garis);border-radius:12px;padding:.5rem;background:var(--putih);min-height:12rem;display:flex;flex-direction:column;gap:.45rem}
.pk-hari.hari-ini{border:2px solid var(--oranye)}
.pk-hari h3{font-size:.9rem;margin:0}
.pk-hari h3 b{font-size:1.1rem}
.pk-kartu{display:flex;flex-direction:column;gap:.3rem;text-decoration:none;color:var(--tinta);background:var(--st-bg);border-radius:9px;padding:.4rem;font-size:.8rem;min-width:0}
.pk-kartu.st-produksi{background:var(--putih);box-shadow:inset 0 0 0 1.5px var(--hijau)}
.pk-kartu.st-review,.pk-kartu.st-persetujuan{background:var(--oranye-muda)}
.pk-kartu.st-terjadwal{background:var(--hijau-muda)}
.pk-kartu.st-tayang,.pk-kartu.st-selesai{background:var(--hijau-muda);box-shadow:inset 0 0 0 1.5px var(--hijau)}
.pk-judul{overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.pk-plat{display:flex;gap:.25rem;flex-wrap:wrap}
.pk-titik{font-size:.65rem;font-weight:700;border-radius:99px;padding:0 .4rem;background:var(--putih);color:var(--abu);border:1px solid var(--garis)}
.pk-titik.ok{background:var(--hijau);border-color:var(--hijau);color:#fff}
.pk-titik.tunggu{background:var(--oranye-muda);border-color:var(--oranye);color:var(--oranye-tua)}
.pk-tambah{margin-top:auto;text-align:center;color:var(--abu);text-decoration:none;border:1px dashed var(--garis);border-radius:9px;padding:.4rem;font-size:.8rem}
@media (max-width:700px){.papan-kartu{grid-template-columns:1fr}.pk-hari{min-height:0}}

/* Halaman insight */
.insight-kepala{display:flex;gap:1.2rem;align-items:flex-start}
.ins-gbr{position:relative;width:150px}
.ins-durasi{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.65);color:#fff;font-size:.75rem;border-radius:6px;padding:0 .4rem}
.ins-info{min-width:0;flex:1}
.ins-baris{display:flex;gap:2rem;flex-wrap:wrap;margin-bottom:.8rem}
.ins-baris b{display:block;font-size:1.05rem}
.ins-caption{margin:.2rem 0 0;line-height:1.45}
.ins-angka{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:.75rem}
.ins-angka.ins-lima{grid-template-columns:repeat(5,1fr)}
.ins-angka div{background:var(--putih);border:1px solid var(--garis);border-radius:12px;padding:.8rem 1rem}
.ins-angka span{display:block;color:var(--abu);font-size:.85rem}
.ins-angka b{display:block;font-family:var(--judul);font-size:2rem;line-height:1.15}
.ins-lima b{font-size:1.5rem}
.ins-angka i{display:block;font-style:normal;color:var(--abu);font-size:.8rem}
.ins-banding{list-style:none;padding:0;margin:0 0 1rem}
.ins-banding li{margin-bottom:.5rem}
.ins-banding b{font-family:var(--judul);font-size:1.3rem;color:var(--hijau-tua)}
.ins-banding i{font-style:normal;color:var(--abu);font-size:.85rem}
@media (max-width:700px){.insight-kepala{flex-direction:column}.ins-angka,.ins-angka.ins-lima{grid-template-columns:repeat(2,1fr)}}
.catatan-ai{background:var(--oranye-muda);border:1.5px solid var(--oranye);border-radius:8px;padding:.5rem .8rem;color:var(--oranye-tua);margin:0 0 .6rem}
.draf-ai{border:1.5px dashed var(--oranye);border-radius:10px;padding:.7rem 1rem;margin-top:.8rem}

/* Permintaan Desain: warna tingkat kepentingan, dari tenang ke mendesak */
.tk-santai{background:var(--hijau-muda);color:var(--hijau-tua)}
.tk-normal{background:var(--biru-muda);color:var(--biru-tua)}
.tk-penting{background:var(--oranye-muda);color:var(--oranye-tua)}
.tk-mendesak{background:var(--merah-muda);color:var(--merah)}
.pm-tingkat{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.pm-tingkat legend{font-weight:600;margin-bottom:.3rem}
.pm-item{box-shadow:none;border:1px solid var(--garis)}
.halaman-tamu main{padding:1.5rem 16px}
.jebakan{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ===== Mode gelap/terang dan sidebar yang bisa dilipat ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tombol-tema{display:flex;align-items:center;gap:.65rem;width:100%;font:inherit;font-size:.93rem;font-weight:500;color:var(--tinta-2);background:transparent;border:0;padding:.55rem .7rem;border-radius:10px;cursor:pointer;text-align:left}
.tombol-tema:hover{background:var(--hijau-tipis)}
.ik-terang{display:none}
:root[data-tema="gelap"] .ik-gelap{display:none}
:root[data-tema="gelap"] .ik-terang{display:inline-flex}
@media (prefers-color-scheme:dark){:root:not([data-tema="terang"]) .ik-gelap{display:none}:root:not([data-tema="terang"]) .ik-terang{display:inline-flex}}
.tamu-tema{position:fixed;top:12px;right:12px;width:auto;border:1px solid var(--garis);background:var(--putih)}
.merek .logo-kecil{display:none}
.lipat-sidebar{position:fixed;z-index:25;top:22px;left:calc(var(--lebar-sidebar) - 15px);width:30px;height:30px;border-radius:99px;border:1px solid var(--garis);background:var(--putih);color:var(--abu);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:left .18s ease}
.lipat-sidebar svg{width:16px;height:16px;transition:transform .18s ease}
.lipat-sidebar:hover{color:var(--tinta);border-color:var(--garis-kuat)}
.sidebar,.utama{transition:width .18s ease,margin-left .18s ease}
@media (min-width:961px){
html.sidebar-tutup{--lebar-sidebar:72px}
html.sidebar-tutup .lipat-sidebar svg{transform:rotate(180deg)}
html.sidebar-tutup .sidebar{padding:1rem .6rem;overflow-x:hidden}
html.sidebar-tutup .logo-penuh,html.sidebar-tutup .merek small,html.sidebar-tutup .akun,html.sidebar-tutup .nav-judul,
html.sidebar-tutup .nav a span,html.sidebar-tutup .sidebar-bawah a span,html.sidebar-tutup .lbl-tema{display:none}
html.sidebar-tutup .merek .logo-kecil{display:block;margin:0 auto}
html.sidebar-tutup .nav a,html.sidebar-tutup .sidebar-bawah a,html.sidebar-tutup .tombol-tema{justify-content:center;padding:.6rem}
html.sidebar-tutup .nav{margin-top:.8rem}
}
@media (max-width:960px){.lipat-sidebar{display:none}}
@media (prefers-reduced-motion:reduce){.sidebar,.utama,.lipat-sidebar,.lipat-sidebar svg{transition:none}}

/* ===== Tabel pengguna (baris bisa dibuka untuk tindakan) ===== */
.tabel-pengguna{background:var(--putih);border:1px solid var(--garis);border-radius:16px;overflow:hidden;margin-bottom:.8rem}
.tp-kepala,.tp-baris>summary{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:1rem;padding:.85rem 1.3rem}
.tp-kepala{font-size:.9rem;color:var(--abu);border-bottom:1px solid var(--garis)}
.tp-baris{border-bottom:1px solid var(--garis)}
.tp-baris:last-child{border-bottom:0}
.tp-baris>summary{list-style:none;cursor:pointer;color:var(--tinta);font-weight:400}
.tp-baris>summary::-webkit-details-marker{display:none}
.tp-baris>summary:hover,.tp-baris[open]>summary{background:var(--kartu-2)}
.tp-orang{display:flex;align-items:center;gap:.9rem;min-width:0}
.tp-orang b{display:block;font-weight:500;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tp-orang small{display:block;color:var(--abu);font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avatar{flex:none;display:inline-flex;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--garis)}
.tp-peran{color:var(--abu)}
.kanan{text-align:right}
.tp-waktu{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88rem;color:var(--abu)}
.pil{display:inline-block;font-size:.82rem;border:1px solid var(--garis-kuat);border-radius:99px;padding:.1rem .7rem;color:var(--tinta-2);white-space:nowrap}
.pil-nonaktif{color:var(--merah);border-color:var(--merah-garis)}
.pil-undangan{color:var(--abu)}
.pil-tg{font-size:.72rem;color:var(--biru-tua);border-color:transparent;background:var(--biru-muda)}
.tp-aksi{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;padding:.4rem 1.3rem 1rem 4.4rem;background:var(--kartu-2)}
.tp-aksi select,.tp-aksi input{width:auto;min-height:36px;padding:.25rem .6rem}
.tp-tg{flex-basis:100%;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
@media (max-width:720px){
  .tp-kepala{display:none}
  .tp-baris>summary{grid-template-columns:1fr auto;gap:.3rem .8rem;padding:.8rem 1rem}
  .tp-peran{grid-column:1;padding-left:3.2rem;font-size:.88rem}
  .tp-waktu{grid-row:1;grid-column:2}
  .tp-aksi{padding:.6rem 1rem 1rem}
}

/* ===== Daftar konten sebagai kartu ===== */
.kartu-konten{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:.9rem;margin-bottom:1rem}
.kk2{display:flex;flex-direction:column;gap:.6rem;background:var(--putih);border:1px solid var(--garis);border-radius:18px;padding:1.1rem 1.2rem}
.kk2:hover{border-color:var(--garis-kuat)}
.kk2-atas{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}
.kk2-judul{display:flex;align-items:flex-start;gap:.5rem;color:var(--tinta);text-decoration:none;font-weight:700;font-size:.98rem;line-height:1.35;min-width:0}
.kk2-judul .ik{margin-top:.15rem;color:var(--abu)}
.kk2-judul:hover span{text-decoration:underline}
.kk2 .st{flex:none;font-size:.72rem}
.kk2-desk{margin:0;color:var(--abu);font-size:.86rem;line-height:1.55}
.kk2-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem 1rem;color:var(--abu);font-size:.8rem}
.kk2-meta>span{display:inline-flex;align-items:center;gap:.35rem}
.titik{display:inline-block;width:10px;height:10px;border-radius:99px;background:var(--ev-abu)}
.pf-instagram{background:#d6249f}.pf-tiktok{background:#14b8b0}.pf-youtube{background:#e02424}.pf-threads{background:var(--tinta)}
.pf-facebook{background:#1877f2}.pf-whatsapp{background:#25a244}.pf-website{background:var(--oranye)}
.kk2-ubah{margin-top:auto;padding-top:.2rem}
.kk2-ubah select{min-height:34px;font-size:.82rem;padding:.2rem .5rem;width:auto}

/* ===== Kalender gaya Event Manager + linimasa ===== */
/* warna bawaan diwariskan dari wadah, lalu ditimpa kelas status (urutan ini penting) */
.kalender-baru{--c:var(--ev-abu)}
[hidden]{display:none!important}
.titik.ev-biru,.kalender-baru .st-rencana{--c:var(--ev-biru)}
.titik.ev-ungu,.kalender-baru .st-produksi{--c:var(--ev-ungu)}
.titik.ev-oranye,.kalender-baru .st-review,.kalender-baru .st-persetujuan{--c:var(--ev-oranye)}
.titik.ev-hijau,.kalender-baru .st-terjadwal{--c:var(--ev-hijau)}
.titik.ev-teal,.kalender-baru .st-tayang{--c:var(--ev-teal)}
.titik.ev-abu,.kalender-baru .st-selesai,.kalender-baru .st-permintaan-selesai{--c:var(--ev-abu)}
.titik.ev-rose,.kalender-baru .st-permintaan{--c:var(--ev-rose)}
a.jd-ev,a.lm-ev,a.pk-kartu,a.dl-item{text-decoration:none}
.dl-item>.st-pm{flex:none;max-width:8.5rem;white-space:normal;text-align:center;line-height:1.25}
.titik[class*="ev-"]{background:var(--c)}
.kk-kepala{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}
.kkp-baris{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem}
.kkp-kiri{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}
.kkp-judul{font-size:1.6rem;margin:0}
.kkp-nav,.kkp-kanan{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.btn-ikon,.btn-kecil{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-height:36px;border:1px solid var(--garis);border-radius:10px;background:var(--putih);color:var(--tinta);text-decoration:none;font:inherit;font-size:.88rem;font-weight:600;cursor:pointer}
.btn-ikon{width:36px;padding:0}
.btn-ikon svg{width:16px;height:16px}
.btn-ikon.balik svg{transform:rotate(180deg)}
.btn-kecil{padding:0 .8rem}
.btn-ikon:hover,.btn-kecil:hover{background:var(--kartu-2);border-color:var(--garis-kuat)}
.segmen{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--garis);border-radius:12px;background:var(--putih)}
.segmen a{padding:.35rem .75rem;border-radius:9px;color:var(--abu);text-decoration:none;font-size:.88rem;font-weight:600}
.segmen a:hover{color:var(--tinta)}
.segmen a[aria-current=page]{background:var(--st-bg);color:var(--tinta)}
.segmen-hp{display:none}
.kkp-saring{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.kkp-cari{position:relative;flex:1 1 260px}
.kkp-cari svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--abu)}
.kkp-cari input{padding-left:2.3rem;min-height:40px}
.saring-menu{position:relative}
.saring-menu>summary{list-style:none;display:inline-flex;align-items:center;gap:.4rem;min-height:40px;padding:0 .8rem;border:1px solid var(--garis);border-radius:10px;background:var(--putih);color:var(--tinta);font-weight:600;font-size:.88rem}
.saring-menu>summary::-webkit-details-marker{display:none}
.saring-menu>summary svg{width:15px;height:15px;color:var(--abu)}
.saring-menu .jml{background:var(--st-bg);border-radius:99px;padding:0 .45rem;font-size:.75rem}
.saring-isi{position:absolute;z-index:40;top:calc(100% + 6px);left:0;min-width:220px;max-height:320px;overflow:auto;background:var(--putih);border:1px solid var(--garis);border-radius:12px;padding:.4rem;box-shadow:var(--bayang)}
.saring-isi label{flex-direction:row;align-items:center;gap:.5rem;font-weight:500;font-size:.88rem;padding:.35rem .5rem;border-radius:8px;cursor:pointer;color:var(--tinta)}
.saring-isi label:hover{background:var(--kartu-2)}
.saring-isi input{width:auto;min-height:0}
.kkp-chip{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.85rem;color:var(--abu)}
.kkp-chip button{display:inline-flex;align-items:center;gap:.35rem;font:inherit;font-size:.8rem;border:0;border-radius:99px;padding:.15rem .6rem;background:var(--st-bg);color:var(--tinta);cursor:pointer}
.legenda{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;align-items:center;font-size:.88rem;color:var(--tinta-2)}
.legenda span{display:inline-flex;align-items:center;gap:.45rem}
.legenda .titik{width:11px;height:11px}
.legenda a{margin-left:auto}
.tersaring{display:none!important}
/* kotak kegiatan: latar lembut, garis kiri dan judul berwarna */
.kalender-baru .kal-item,.kalender-baru .jd-ev,.kalender-baru .pk-kartu,.lm-ev,.lm-chip{background:color-mix(in srgb,var(--c) 13%,var(--putih));color:var(--tinta);border-left:3px solid var(--c);box-shadow:none}
.kalender-baru .kal-item .jdl,.kalender-baru .jd-ev b,.lm-ev b{color:color-mix(in srgb,var(--c) 75%,var(--tinta))}
.kalender-baru .kal-bg{background:var(--putih)}
.kalender-baru .kal-bg.luar{background:var(--kartu-2)}
.kalender-baru .kal-bg.hari-ini .kal-n{background:var(--hijau);color:#fff;border-radius:99px;min-width:1.6rem;text-align:center}
/* kartu melayang */
.kal-pop{position:fixed;z-index:70;width:280px;background:var(--putih);border:1px solid var(--garis);border-radius:12px;padding:.8rem .9rem;box-shadow:var(--bayang);font-size:.85rem;pointer-events:none}
.kal-pop b{display:block;font-size:.95rem;margin-bottom:.25rem;padding-right:1rem}
.kal-pop .pop-warna{position:absolute;top:.9rem;right:.9rem;width:11px;height:11px;border-radius:99px;background:var(--c)}
.kal-pop p{margin:.3rem 0 0;color:var(--abu)}
.kal-pop .pop-tag{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.45rem}
.kal-pop .pop-tag span{font-size:.72rem;border:1px solid var(--garis);border-radius:99px;padding:0 .5rem}
/* linimasa */
.kal-linimasa{padding:.8rem}
.lm-alat{display:flex;align-items:center;gap:1rem;margin-bottom:.6rem}
.lm-zoom{flex:1;flex-direction:row;align-items:center;gap:.8rem;font-weight:600}
.lm-zoom input{flex:1;min-height:0;padding:0;accent-color:var(--hijau)}
.lm-seharian{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-bottom:.6rem}
.lm-chip{text-decoration:none;border-radius:8px;padding:.2rem .6rem;font-size:.8rem;font-weight:600}
.lm-gulir{overflow-x:auto;border:1px solid var(--garis);border-radius:12px}
.lm{--lj:120px;--lebar-nama:190px;--tinggi-lajur:58px;position:relative;display:grid;grid-template-columns:var(--lebar-nama) calc(var(--lj)*var(--nj));min-width:max-content}
.lm-sudut,.lm-skala{position:sticky;top:0;z-index:3;background:var(--putih);border-bottom:1px solid var(--garis);height:46px}
.lm-sudut{left:0;z-index:4;display:flex;align-items:center;padding:0 1rem;font-family:var(--judul);font-weight:700;font-size:1.05rem;border-right:1px solid var(--garis)}
.lm-skala{position:relative}
.lm-skala span{position:absolute;top:50%;transform:translateY(-50%);padding-left:.5rem;font-size:.85rem;color:var(--abu);white-space:nowrap}
.lm-nama{position:sticky;left:0;z-index:2;background:var(--putih);border-right:1px solid var(--garis);border-bottom:1px solid var(--garis);padding:.6rem 1rem;display:flex;flex-direction:column;justify-content:center;min-height:calc(var(--tinggi-lajur) + 12px)}
.lm-nama b{font-weight:600;line-height:1.25}
.lm-nama small{display:flex;align-items:center;gap:.3rem;color:var(--abu);font-size:.78rem}
.lm-nama small svg{width:13px;height:13px}
.lm-jalur{position:relative;border-bottom:1px solid var(--garis);min-height:calc(var(--nl,1)*var(--tinggi-lajur) + 12px);
  background-image:repeating-linear-gradient(to right,var(--garis) 0 1px,transparent 1px var(--lj)),repeating-linear-gradient(to right,color-mix(in srgb,var(--garis) 45%,transparent) 0 1px,transparent 1px calc(var(--lj)/2))}
.lm-ev{position:absolute;height:calc(var(--tinggi-lajur) - 8px);border-radius:8px;padding:.35rem .55rem;text-decoration:none;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:.1rem;min-width:28px}
.lm-ev b{font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lm-ev small{display:flex;align-items:center;gap:.25rem;color:var(--abu);font-size:.74rem;white-space:nowrap;overflow:hidden}
.lm-ev small svg{width:12px;height:12px;flex:none}
.lm-ev:hover{filter:brightness(1.06);outline:1px solid var(--c)}
.lm-kini{position:absolute;top:0;bottom:0;width:2px;background:var(--tinta-2);z-index:2;pointer-events:none}
.lm-kini span{position:absolute;top:8px;left:50%;transform:translateX(-50%);background:var(--putih);border:1px solid var(--garis);border-radius:8px;padding:.15rem .5rem;font-size:.78rem;font-weight:700;white-space:nowrap;box-shadow:var(--bayang)}
/* daftar */
.dl{display:flex;flex-direction:column;gap:1.4rem}
.dl-tgl{margin:0 0 .5rem;font-size:.9rem;color:var(--abu)}
.dl-tgl.hari-ini{color:var(--oranye)}
.dl-hari{display:flex;flex-direction:column;gap:.5rem}
.dl-item{display:flex;align-items:flex-start;gap:.8rem;padding:.85rem 1rem;border:1px solid var(--garis);border-radius:12px;background:var(--putih);color:var(--tinta);text-decoration:none;transition:border-color .15s,transform .15s}
.dl-item:hover{border-color:var(--garis-kuat);transform:translateY(-1px)}
.dl-item .titik{margin-top:.4rem;flex:none;width:11px;height:11px}
.dl-isi{flex:1;min-width:0;display:flex;flex-direction:column;gap:.2rem}
.dl-isi b{font-weight:600}
.dl-desk{color:var(--abu);font-size:.85rem}
.dl-meta{display:flex;flex-wrap:wrap;gap:.3rem .9rem;align-items:center;color:var(--abu);font-size:.78rem;margin-top:.2rem}
.dl-meta>span{display:inline-flex;align-items:center;gap:.3rem}
.dl-meta svg{width:13px;height:13px}
.tag{border:1px solid var(--garis);border-radius:99px;padding:0 .5rem}
@media (max-width:760px){
  .segmen{display:none}
  .segmen-hp{display:block}
  .segmen-hp select{min-height:40px;width:auto}
  .kkp-judul{font-size:1.3rem}
  .lm{--lebar-nama:120px}
  .legenda a{margin-left:0}
}
@media (prefers-reduced-motion:reduce){.dl-item{transition:none}}

/* ===== Tanya Data: gaya "thinking prompt" ===== */
.tp-wadah{max-width:720px;margin:0 auto;display:flex;flex-direction:column;min-height:calc(100vh - 6rem)}
.tp-alis{display:flex;align-items:center;gap:.45rem;font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--abu);margin-bottom:.5rem}
.tp-judul-baris{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.tp-judul-baris h1{font-size:1.75rem;font-weight:600;letter-spacing:-.01em}
.tanya-kepala .sub{margin-top:.3rem}
.tp-transkrip{flex:1;display:flex;flex-direction:column;gap:1.4rem;padding:.4rem .2rem 1rem;overflow-y:auto;max-height:62vh;border-radius:12px}
.tp-transkrip:focus-visible{outline:2px solid var(--oranye)}
.tp-sapa{color:var(--abu);margin:auto 0 0}
.tp-giliran{display:flex;flex-direction:column;gap:.7rem}
.tp-tanya{align-self:flex-end;max-width:88%;background:var(--st-bg);color:var(--tinta);border-radius:18px 18px 4px 18px;padding:.6rem .9rem;font-size:.9rem;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.tp-pikir>summary{list-style:none;display:inline-flex;align-items:center;gap:.45rem;max-width:100%;font-size:.78rem;color:var(--abu);border:1px solid var(--garis);background:var(--kartu-2);border-radius:99px;padding:.3rem .7rem;cursor:pointer}
.tp-pikir>summary::-webkit-details-marker{display:none}
.tp-pikir>summary:hover{color:var(--tinta)}
.tp-pikir .panah{transition:transform .2s}
.tp-pikir[open] .panah{transform:rotate(90deg)}
.tp-pikir.sedang>summary{border-color:transparent;background:transparent;padding-left:0;cursor:default;width:100%}
.tp-pikir .detik{margin-left:auto;font-family:ui-monospace,Menlo,monospace;font-size:.72rem}
.kilau{background:linear-gradient(90deg,var(--abu) 0%,var(--abu) 42%,var(--tinta) 50%,var(--abu) 58%,var(--abu) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:kilau 1.8s linear infinite}
@keyframes kilau{from{background-position:100% 0}to{background-position:0 0}}
.tp-langkah{list-style:none;margin:.7rem 0 0 .45rem;padding:0 0 0 1.3rem;border-left:1px solid var(--garis)}
.tp-langkah li{position:relative;display:flex;align-items:center;min-height:2.1rem;font-size:.8rem;color:var(--abu)}
.tp-langkah li.aktif{color:var(--tinta)}
.tl-titik{position:absolute;left:calc(-1.3rem - 6px);width:11px;height:11px;border-radius:99px;background:var(--latar);box-shadow:0 0 0 4px var(--latar);display:flex;align-items:center;justify-content:center;color:var(--tinta)}
.tp-langkah li.aktif .tl-titik::after{content:"";width:6px;height:6px;border-radius:99px;background:var(--hijau);animation:denyut 1.2s ease-in-out infinite}
@keyframes denyut{50%{opacity:.35}}
.tp-jawab{font-size:.93rem;line-height:1.65;color:var(--tinta);overflow-wrap:anywhere}
.tp-jawab p{margin:0 0 .55rem}
.tp-jawab.galat{color:var(--merah)}
.kursor{display:inline-block;width:4px;height:.95em;margin-left:3px;border-radius:99px;background:var(--hijau);vertical-align:-2px;animation:denyut 1s ease-in-out infinite}
.tp-saran{display:flex;flex-wrap:wrap;gap:.4rem;margin:.4rem 0 .8rem}
.tp-saran button{font:inherit;font-size:.82rem;padding:.35rem .8rem;border-radius:99px;border:1px solid var(--garis);background:var(--putih);color:var(--tinta-2);cursor:pointer}
.tp-saran button:hover{border-color:var(--garis-kuat);color:var(--tinta)}
.tp-komposer{position:sticky;bottom:1rem;background:var(--putih);border:1px solid var(--garis);border-radius:26px;padding:1rem 1rem .8rem;box-shadow:0 18px 40px color-mix(in srgb,var(--hijau) 8%,transparent),var(--bayang)}
.tp-komposer textarea{display:block;border:0;background:transparent;resize:none;min-height:64px;height:64px;padding:.2rem;font-size:1.05rem;line-height:1.6;color:var(--tinta);box-shadow:none}
.tp-komposer textarea:focus-visible{outline:none}
.tp-komposer:focus-within{border-color:var(--garis-kuat)}
.tp-alat{display:flex;align-items:center;gap:.7rem;margin-top:.6rem}
.tp-teliti{display:inline-flex;align-items:center;gap:.4rem;height:32px;padding:0 .8rem;border-radius:99px;border:1px solid var(--garis);background:var(--putih);color:var(--abu);font:inherit;font-size:.78rem;font-weight:600;cursor:pointer}
.tp-teliti .cek{display:none}
.tp-teliti[aria-pressed=true]{color:var(--tinta);background:color-mix(in srgb,var(--hijau) 8%,var(--putih));border-color:color-mix(in srgb,var(--hijau) 25%,var(--garis))}
.tp-teliti[aria-pressed=true] .cek{display:inline-flex}
.tp-teliti:disabled{opacity:.5}
.tp-sisa{margin-left:auto;font-size:.75rem;color:var(--abu)}
.tp-kirim{position:relative;flex:none;width:38px;height:38px;border-radius:12px;border:0;background:var(--hijau);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tp-kirim svg{position:absolute;transition:opacity .2s,transform .2s}
.tp-kirim .ik-henti,.tp-komposer.sibuk .ik-kirim{opacity:0;transform:scale(.75)}
.tp-komposer.sibuk .ik-henti{opacity:1;transform:none}
.tp-catatan{margin:.7rem .3rem 1rem}
@media (prefers-reduced-motion:reduce){.kilau,.kursor,.tp-langkah li.aktif .tl-titik::after{animation:none}.kilau{color:var(--abu);background:none}.tp-kirim svg,.tp-pikir .panah{transition:none}}
@media (max-width:600px){.tp-tanya{max-width:94%}.tp-sisa{display:none}.tp-judul-baris h1{font-size:1.45rem}}

/* Dashboard: kartu angka berikon, grafik, alur kerja, aktivitas */
.dash-stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.9rem;margin-bottom:1rem}
.dash-stat .kartu{margin:0;padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.25rem}
.ds-atas{display:flex;justify-content:space-between;align-items:center;font-size:.88rem;font-weight:600}
.ds-atas .ik{color:var(--abu)}
.dash-stat b{font-size:1.7rem;font-variant-numeric:tabular-nums;line-height:1.2}
.dash-stat b i{font-style:normal;font-size:1rem;color:var(--abu);font-weight:500}
.dash-stat .ds-bar{flex:none;margin-top:.35rem}
.dash-stat small{font-size:.78rem;color:var(--abu)}
.ds-bar{display:block;height:8px;border-radius:99px;background:var(--hijau-muda);overflow:hidden;flex:1}
.ds-bar>span{display:block;height:100%;background:var(--c,var(--hijau));border-radius:99px}
.grid-dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:1rem;margin-bottom:1rem}
.grid-dash .kartu{margin:0}
.dash-grafik{position:relative;height:250px}
.dash-alur{display:flex;flex-direction:column;gap:.7rem;margin:.6rem 0 1rem}
.da-baris{display:grid;grid-template-columns:9.5rem 1fr 2rem;align-items:center;gap:.7rem;font-size:.9rem}
.da-baris b{text-align:right;font-variant-numeric:tabular-nums}
.da-rencana{--c:var(--ev-biru)}.da-produksi{--c:var(--ev-ungu)}.da-review,.da-persetujuan{--c:var(--ev-oranye)}.da-terjadwal{--c:var(--ev-hijau)}
.dash-akt{list-style:none;margin:.6rem 0 0;padding:0;display:flex;flex-direction:column;gap:.85rem}
.dash-akt li{display:flex;gap:.7rem;align-items:flex-start}
.dash-akt .avatar svg{width:32px;height:32px}
.dash-akt p{margin:0;font-size:.9rem;line-height:1.35}
.pm-atur{margin:.6rem 0 1rem}
