/* Nusindo workspace — presentation only. Existing menus and actions stay intact. */
:root {
  --latar:#f5f6f8; --permukaan:#fff; --permukaan-2:#f0f2f5;
  --garis:#e3e6eb; --garis-kuat:#cdd3dc;
  --teks:#202937; --teks-2:#526071; --teks-3:#667384;
  --bulat:10px; --bulat-kecil:7px;
  --bayang:0 1px 2px #18223005;
  --bayang-besar:0 12px 36px #18223016;
}
:root[data-tema="gelap"] {
  --latar:#14181e; --permukaan:#1c2129; --permukaan-2:#252c36;
  --garis:#323b48; --garis-kuat:#485466;
  --teks:#edf0f5; --teks-2:#bec6d2; --teks-3:#9eaaba;
}
@media(prefers-color-scheme:dark) {
  :root:not([data-tema="terang"]) {
    --latar:#14181e; --permukaan:#1c2129; --permukaan-2:#252c36;
    --garis:#323b48; --garis-kuat:#485466;
    --teks:#edf0f5; --teks-2:#bec6d2; --teks-3:#9eaaba;
  }
}
body {font-size:14px;line-height:1.65}
.muncul {animation:none}
h1,h2,h3 {letter-spacing:-.035em}
button,input,select,textarea {touch-action:manipulation}
.tombol {font-size:13px;font-weight:600;min-height:40px;padding:9px 15px;box-shadow:none}
.tombol.kecil {min-height:34px;font-size:12px}
.tombol-ikon {border-radius:8px;background:transparent}
input,select,textarea {font-size:14px;line-height:1.6;border-color:var(--garis-kuat)}
input:focus,select:focus,textarea:focus {box-shadow:0 0 0 3px var(--aksen-lembut)}
label.isian {font-size:13px}
.merek .lambang,.avatar {background:var(--aksen);box-shadow:none;border-radius:9px}
.merek {font-size:20px;font-weight:750;letter-spacing:-.04em}
.merek-sub {display:block;font-size:9px;letter-spacing:.16em;font-weight:600;color:var(--teks-3);margin-top:0}
.merek .lambang {width:34px;height:34px}

/* Login: quiet editorial layout, no stock illustration or decorative gradients. */
.layar-masuk {grid-template-columns:minmax(360px,.95fr) minmax(460px,1.05fr);background:var(--permukaan)}
.masuk-kiri,
:root[data-tema="gelap"] .masuk-kiri {
  min-height:100dvh;justify-content:space-between;padding:48px 56px;
  background:#152d3c;color:#f3f6f8;
}
@media(prefers-color-scheme:dark) {
  :root:not([data-tema="terang"]) .masuk-kiri {background:#152d3c}
}
.masuk-kiri .merek {font-size:23px}
.masuk-kiri .lambang {background:#f3f6f8;color:#152d3c}
.label-editorial {display:block;font-size:10px;font-weight:650;letter-spacing:.18em;color:var(--teks-3);margin-bottom:20px}
.masuk-editorial {margin:80px 0;max-width:470px}
.masuk-editorial .label-editorial {color:#acbeca;margin-bottom:30px}
.masuk-editorial h1 {font-size:clamp(36px,4.3vw,64px);font-weight:550;line-height:1.14;letter-spacing:-.055em}
.masuk-kiri .masuk-editorial p {font-size:15px;line-height:1.8;color:#b9c9d3;max-width:310px;margin-top:30px}
.masuk-footer {display:flex;justify-content:space-between;gap:20px;border-top:1px solid #ffffff25;padding-top:20px;font-size:11px;color:#afc1cd}
.masuk-kanan {padding:48px}
.kotak-masuk {max-width:380px}
.kotak-masuk h2 {font-size:29px;font-weight:650;letter-spacing:-.045em;margin-bottom:9px}
.kotak-masuk .sub {font-size:14px;line-height:1.7;margin-bottom:30px}
.kotak-masuk input {min-height:46px}
.kotak-masuk label.isian {margin-bottom:18px}
.kotak-masuk .tombol.penuh {min-height:46px}
.kotak-masuk .label-editorial {margin-bottom:12px}
.kotak-masuk .galat {margin:12px 0}

/* Shared shell and hierarchy. */
.aplikasi {grid-template-columns:232px minmax(0,1fr)}
.samping {padding:26px 14px 16px;overflow-y:auto;gap:8px}
.samping .merek {padding:0 12px 26px}
.navi {gap:3px}
.navi button {font-size:12.5px;font-weight:550;padding:10px 12px;min-height:41px;border-radius:7px}
.navi button .ikon {width:17px;height:17px;opacity:.85}
.navi button.aktif {background:var(--aksen-lembut);color:var(--aksen-teks);font-weight:700;box-shadow:inset 2px 0 var(--aksen)}
.grup-navi {font-size:9px;letter-spacing:.13em;font-weight:650;padding:19px 12px 6px}
.samping .bawah {padding-top:16px;margin-top:auto}
.kartu-pengguna {padding:12px 8px;gap:10px}
.kartu-pengguna .nm {font-size:12px}
.kartu-pengguna .pr {font-size:11px}
.avatar {width:32px;height:32px;font-size:11px}
.sakelar-mode {border:1px solid var(--garis);border-radius:7px;background:var(--latar);margin-bottom:6px}
.sakelar-mode span {font-size:9px;padding-top:5px}
.sakelar-mode button {font-size:11px;border-radius:5px}
.sakelar-mode button.aktif {box-shadow:0 1px 3px #1822300c}
.atas {padding:23px 36px;min-height:91px;border-bottom:1px solid var(--garis);background:var(--permukaan);gap:14px}
.sapaan h1 {font-size:17px;font-weight:650;letter-spacing:-.025em}
.sapaan p {font-size:11px;color:var(--teks-3);margin-top:3px}
.atas .kanan {gap:10px}
.jam-besar {font-size:11px;font-weight:500;border:0;background:transparent;padding:4px;font-variant-numeric:tabular-nums}
.tombol-cari {font-size:12px;border-radius:7px;background:var(--latar)}
main {max-width:1560px;margin:0 auto;padding:30px 36px 100px}
.judul-hal {margin-bottom:25px}
.judul-hal h2 {font-size:27px;font-weight:650;line-height:1.3}
.judul-hal p {font-size:13px;color:var(--teks-3);max-width:720px;margin-top:7px}
.tab-hal {border-bottom:1px solid var(--garis);gap:22px;padding:0;margin-top:23px;background:none;border-radius:0}
.tab-hal button {border-radius:0;border:0;border-bottom:2px solid transparent;padding:12px 0;font-size:12px;background:none;color:var(--teks-3)}
.tab-hal button.aktif {background:none;color:var(--aksen-teks);border-bottom-color:var(--aksen);box-shadow:none}
.kartu {padding:22px;border-radius:10px;box-shadow:none}
.kartu h4 {font-size:13px;font-weight:650;letter-spacing:-.01em;margin-bottom:18px;gap:9px}
.kartu h4>.ikon {color:var(--teks-3);width:17px;height:17px}
.kartu.layanan:hover,.kartu-bot:hover {transform:none;box-shadow:0 3px 14px #18223009}
.bagian {margin:28px 0 14px}
.bagian h2 {font-size:15px}
.bagian .ikon-bagian {background:transparent;color:var(--teks-3);width:22px;height:24px}
.pil,.lencana {font-size:11px;font-weight:550;border-radius:5px;padding:3px 8px}
.pil .titik {width:6px;height:6px;animation:none}
.catatan-kecil,.kartu .catatan-kecil {font-size:12px;line-height:1.7}
.ringkas,.kisi,.grid-bot {gap:16px}
.angka b {font-size:29px;font-weight:600;letter-spacing:-.045em}
.angka span {font-size:12px}
.angka .ikon-angka {border-radius:8px;width:38px;height:38px}
.tabel-bungkus {border-radius:10px;box-shadow:none}
th {font-size:11px;font-weight:650;letter-spacing:.02em;color:var(--teks-3)}
td {font-size:13px}
th,td {padding:13px 16px}
dialog,.dialog-kode {border-radius:12px;box-shadow:var(--bayang-besar)}
.tombol-tanya {border-radius:8px;font-size:12px;box-shadow:0 4px 14px #18223018;background:var(--aksen)}
.panel-tanya {border-radius:12px}

/* Dashboard content keeps all existing data and actions. */
.kotak-perintah.besar {border:1px solid var(--garis);border-radius:10px;padding:24px;margin-bottom:22px;gap:13px}
.kotak-perintah.besar .judul-kotak {font-size:17px;font-weight:600}
.kotak-perintah textarea {font-size:14px;background:var(--latar);min-height:84px;border-color:var(--garis)}
.kotak-perintah .chip {font-size:11px;border-radius:5px;font-weight:500;background:transparent;border-color:var(--garis)}
.grid-beranda {grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.grid-beranda>.kartu {min-height:190px}
.baris-kartu {padding:13px 0;border-bottom:1px solid var(--garis);gap:14px;font-size:12px}
.baris-kartu:last-child {border-bottom:0}
.baris-harian {border-style:solid;border-color:var(--garis);background:var(--latar);font-size:11px;margin-top:22px;padding:10px;gap:7px}
.baris-harian .kecil-kanan {font-size:11px}
.pakai-kecil {font-size:11px;border-top:1px solid var(--garis);padding-top:12px}
.angka-4 {text-align:left;gap:18px;padding:4px 0 15px}
.angka-4 b {font-size:30px;font-weight:600;letter-spacing:-.04em}
.angka-4 small {font-size:11px}
.kolom-nusa .kartu-lampu {font-size:12px;border-radius:7px;background:var(--latar)}
.riwayat-batas {font-size:11px;line-height:1.8;color:var(--teks-3)}
.riwayat-batas>b {font-weight:550}
.pandangan-pimpinan.kartu,.ringkasan-pagi {padding:17px 22px}
.pandangan-pimpinan>summary,.ringkasan-pagi>summary {font-size:12px}
.semua-beres-kecil {min-height:78px;font-size:12px;line-height:1.7}
.semua-beres-kecil img,.ilus-kosong {display:none}
.kosong-ilus {padding:36px 24px;background:var(--permukaan)}
.kosong-ilus>.ikon.besar {display:block;color:var(--teks-3);margin-bottom:8px}
.avatar-bot img {border-radius:10px;box-shadow:none}
.status-bot {border-radius:5px;font-size:10px}
.chip-peran {border-radius:5px;font-size:10px}
.nama-bot b {font-size:14px}
.tugas-bot {font-size:12px;line-height:1.7}
.buka-bot {font-size:11px}
@media(min-width:1500px) {.grid-beranda{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-beranda>.kolom-nusa{grid-column:1/-1}.kolom-nusa .angka-4{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1100px) and (min-width:901px) {.atas,main{padding-left:24px;padding-right:24px}.aplikasi{grid-template-columns:210px minmax(0,1fr)}.atas .kanan{gap:6px}.jam-besar{display:none}}
@media(max-width:900px) {
  .layar-masuk {display:flex;flex-direction:column;min-height:100dvh}
  .masuk-kiri,:root[data-tema="gelap"] .masuk-kiri {min-height:auto;padding:22px 24px}
  .masuk-kiri .merek {font-size:21px}
  .masuk-editorial,.masuk-footer {display:none}
  .masuk-kanan {flex:1;padding:42px 24px;place-items:start center}
  .kotak-masuk {max-width:420px}
  .kotak-masuk h2 {font-size:27px}
  .aplikasi {grid-template-columns:minmax(0,1fr)}
  .atas {padding:20px;min-height:85px;gap:12px}
  .sapaan h1 {font-size:16px}
  .atas .kanan {gap:6px}
  main {padding:24px 20px 150px}
  .judul-hal h2 {font-size:24px}
  .judul-hal p {font-size:12px}
  .grid-beranda {gap:14px}
  .kartu {padding:18px}
  .tombol-tanya {bottom:90px;right:18px;min-height:44px}
  .navi-bawah {background:var(--permukaan);backdrop-filter:none;padding-top:9px;padding-bottom:calc(9px + env(safe-area-inset-bottom))}
  .navi-bawah button {font-size:10px;font-weight:550;gap:5px;min-height:48px}
  .navi-bawah button.aktif .ikon {border-radius:6px;width:40px;padding:3px 8px}
  .tab-hal {gap:22px;overflow-x:auto}
}
@media(max-width:600px) {
  body {font-size:14px}
  .atas {padding:17px 16px;gap:10px;align-items:center}
  .atas .kanan {gap:5px}
  .atas .tombol-ikon {width:36px;height:36px}
  main {padding:22px 16px 150px}
  .grid-beranda {grid-template-columns:minmax(0,1fr)}
  .grid-beranda>.kartu {min-height:0}
  .kotak-perintah.besar {padding:18px;gap:12px}
  .kotak-perintah.besar .judul-kotak {font-size:15px}
  .baris-harian {flex-wrap:wrap}
  .kisi,.kisi.dua,.kisi-konektor,.grid-pimpinan {grid-template-columns:minmax(0,1fr)}
  .kartu .kepala,.baris-kartu {overflow-wrap:anywhere}
  .tombol {min-height:44px}
  .tombol.kecil {min-height:38px}
  input,select,textarea {font-size:16px}
  .kotak-perintah textarea {font-size:16px}
  .sakelar-mode button {min-height:36px}
}