:root{--biru: #138bca;--biru-tua: #0b5f8a;--biru-tint: #eaf6fc;--biru-garis: #b6dff2;--hijau: #5aa021;--hijau-tint: #f0f8e7;--hijau-garis: #cae8ab;--oren: #e97600;--oren-terang: #ff8412;--oren-tint: #fff3e5;--merah: #c0392b;--merah-tint: #fbe9e7;--ungu: #6b46c1;--ungu-tint: #f0ebfb;--n0: #ffffff;--n25: #fcfcfd;--n50: #f6f7f9;--n100: #eef0f3;--n200: #e2e5ea;--n300: #cdd2da;--n400: #98a1ad;--n500: #6b7581;--n700: #3c4450;--n900: #191d24;--bg: var(--n50);--panel: var(--n0);--garis: var(--n200);--garis-halus: var(--n100);--teks: var(--n900);--redup: var(--n500);--r-sm: 7px;--r: 10px;--r-lg: 14px;--bayang-xs: 0 1px 2px rgba(16, 24, 40, .05);--bayang: 0 1px 3px rgba(16, 24, 40, .07), 0 1px 2px rgba(16, 24, 40, .04);--bayang-lg: 0 18px 40px -14px rgba(16, 24, 40, .22);--font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--rel-w: 258px;--bar-h: 60px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--teks);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--biru-tua);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{margin:0;line-height:1.25;letter-spacing:-.015em}p{margin:0}code{font-family:var(--mono)}.f1{flex:1;min-width:0}.potong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app{display:grid;grid-template-columns:var(--rel-w) 1fr;height:100%}.utama{display:flex;flex-direction:column;min-width:0}.kanvas{flex:1;overflow-y:auto}.tabir{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#0f172066}.rel{display:flex;flex-direction:column;min-height:0;background:var(--panel);border-right:1px solid var(--garis)}.rel-merek{display:flex;align-items:center;gap:8px;min-height:var(--bar-h);padding:12px 14px;flex:none}.rel-merek img{height:42px;width:auto}.rel-nav{flex:1;min-height:0;overflow-y:auto;padding:6px 10px 14px}.rel-grup{padding:16px 8px 6px;color:var(--n400);font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}.rel-item{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;margin-bottom:1px;border:0;border-radius:var(--r-sm);background:none;color:var(--n700);font:inherit;font-size:13.2px;text-align:left;cursor:pointer}.rel-item svg{color:var(--n400);flex:none}.rel-item:hover{background:var(--n50)}.rel-item:hover svg{color:var(--n500)}.rel-item.aktif{background:var(--biru-tint);color:var(--biru-tua);font-weight:600}.rel-item.aktif svg{color:var(--biru)}.rel-item.aktif:before{content:"";position:absolute;left:-10px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:var(--oren-terang)}.rel-kaki{flex:none;display:flex;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--garis)}.rel-akun{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.rel-avatar{display:grid;place-items:center;width:26px;height:26px;flex:none;border-radius:50%;background:var(--biru);color:#fff;font-size:12px;font-weight:700}.rel-akun .potong{font-size:11.5px;color:var(--redup)}.tautan-kecil{padding:4px 8px;border:0;border-radius:var(--r-sm);background:none;color:var(--redup);font:inherit;font-size:12px;font-weight:600;cursor:pointer}.tautan-kecil:hover{background:var(--n100);color:var(--teks)}.bar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;min-height:var(--bar-h);padding:10px 22px;background:#ffffffe0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--garis)}.bar>.btn,.bar>.ikon-btn,.bar>.cari{flex:none}.bar h2{font-size:15.5px;font-weight:650}.bar p{font-size:12px;color:var(--redup);margin-top:1px}.bar-kecil{align-items:center;gap:10px;height:52px;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--garis)}.bar-kecil strong{font-size:14px}.btn{display:inline-flex;flex-direction:row;align-items:center;gap:6px;padding:7px 13px;border:1px solid var(--garis);border-radius:var(--r-sm);background:var(--panel);color:var(--n700);font:inherit;font-size:12.5px;font-weight:550;white-space:nowrap;cursor:pointer}.btn:hover{background:var(--n50);border-color:var(--n300);text-decoration:none}.btn:disabled{opacity:.55;cursor:default}.btn.utama{background:var(--biru);border-color:var(--biru);color:#fff}.btn.utama:hover{background:var(--biru-tua);border-color:var(--biru-tua)}.ikon-btn{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;width:32px;height:32px;flex:none;border:1px solid transparent;border-radius:var(--r-sm);background:none;color:var(--n500);cursor:pointer}.ikon-btn:hover{background:var(--n100);color:var(--teks)}.ikon-btn:disabled{opacity:.5;cursor:default}.cari{display:flex;align-items:center;gap:7px;width:240px;padding:6px 11px;border:1px solid var(--garis);border-radius:var(--r-sm);background:var(--n50);color:var(--n400)}.cari:focus-within{border-color:var(--biru-garis);background:var(--panel)}.cari input{flex:1;min-width:0;border:0;background:none;color:var(--teks);font:inherit;font-size:12.5px;outline:none}@keyframes putar{to{transform:rotate(360deg)}}.putar{animation:putar .9s linear infinite}.isi-berkas{padding:18px 22px 40px}.remah{display:flex;align-items:center;flex-wrap:wrap;gap:3px;margin-bottom:10px;font-size:12.5px;color:var(--redup)}.remah span{display:inline-flex;align-items:center;gap:3px}.remah svg{color:var(--n300)}.remah b{color:var(--teks);font-weight:600}.remah button{border:0;background:none;color:var(--biru-tua);font:inherit;font-size:12.5px;cursor:pointer;padding:0}.remah button:hover{text-decoration:underline}.remah-hitung{margin-left:auto;color:var(--n400);font-size:11.5px}.berkas{list-style:none;margin:0;padding:0;border:1px solid var(--garis);border-radius:var(--r-lg);background:var(--panel);box-shadow:var(--bayang-xs);overflow:hidden}.baris{display:flex;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid var(--garis-halus)}.baris:last-child{border-bottom:0}.baris:hover{background:var(--n25)}.jenis{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:9px;font-size:9.5px;font-weight:750;letter-spacing:.04em}.j-folder{background:var(--oren-tint);color:var(--oren)}.j-doc{background:var(--biru-tint);color:var(--biru-tua)}.j-xls{background:var(--hijau-tint);color:var(--hijau)}.j-ppt{background:var(--oren-tint);color:var(--oren)}.j-pdf{background:var(--merah-tint);color:var(--merah)}.j-img{background:var(--ungu-tint);color:var(--ungu)}.j-lain{background:var(--n100);color:var(--n500)}.baris>.f1{display:flex;flex-direction:column;gap:2px}.baris-judul{padding:0;border:0;background:none;color:var(--teks);font:inherit;font-size:13.5px;font-weight:550;text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.baris-judul:hover{color:var(--biru-tua);text-decoration:none}.baris-meta{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--redup);overflow:hidden;white-space:nowrap}.baris-meta code{padding:1px 5px;border-radius:4px;background:var(--n100);color:var(--n500);font-size:10.5px;letter-spacing:-.01em}.baris-meta .rev{padding:1px 6px;border-radius:4px;background:var(--hijau-tint);color:var(--hijau);font-size:10.5px;font-weight:650}.baris-aksi{display:flex;gap:2px;opacity:0;transition:opacity .12s ease}.baris:hover .baris-aksi,.baris:focus-within .baris-aksi{opacity:1}.baris-ico{display:grid;place-items:center;width:30px;height:30px;flex:none;border:0;border-radius:var(--r-sm);background:none;color:var(--n400);cursor:pointer}.baris-ico:hover{background:var(--n100);color:var(--biru-tua);text-decoration:none}.kabar{display:flex;align-items:center;justify-content:center;gap:12px;padding:44px 16px;border:1px solid var(--garis);border-radius:var(--r-lg);background:var(--panel);color:var(--redup);font-size:13px;text-align:center}.kabar.galat{color:var(--merah);background:var(--merah-tint);border-color:#f3cdc7}.lembar{padding:22px}.sorot{display:flex;align-items:center;gap:24px;padding:26px 28px;border:1px solid var(--biru-garis);border-radius:var(--r-lg);background:linear-gradient(115deg,var(--biru-tint) 0%,var(--hijau-tint) 78%,var(--oren-tint) 100%)}.sorot h2{font-size:22px;font-weight:680;margin-top:10px}.sorot p{color:var(--n700);margin-top:3px}.sorot-lambang{height:74px;width:auto;flex:none}.lencana{display:inline-flex;flex-direction:row;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:650}.lencana.hijau{background:var(--hijau-tint);border:1px solid var(--hijau-garis);color:var(--hijau)}.tombol-baris{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.dua{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:14px;margin-top:14px}.kartu{padding:18px 20px;border:1px solid var(--garis);border-radius:var(--r-lg);background:var(--panel);box-shadow:var(--bayang-xs)}.kartu h3{font-size:13px;font-weight:650;color:var(--redup);text-transform:uppercase;letter-spacing:.05em}.fakta{margin:14px 0 0;display:flex;flex-direction:column;gap:11px}.fakta div{display:flex;gap:14px;align-items:baseline}.fakta dt{flex:none;width:132px;color:var(--redup);font-size:12.5px}.fakta dd{margin:0;font-size:13.5px;font-weight:550}.lembar-srt{display:flex;gap:12px;margin-top:14px}.lembar-srt a{max-width:320px}.lembar-srt a{flex:1;padding:6px;border:1px solid var(--garis);border-radius:var(--r);background:var(--n25)}.lembar-srt a:hover{border-color:var(--biru-garis)}.lembar-srt img{display:block;width:100%;height:auto;border-radius:4px}.baca{position:relative;height:calc(100% - var(--bar-h));min-height:460px;background:var(--n100)}.baca iframe{display:block;width:100%;height:100%;border:0}.tirai{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:var(--panel);color:var(--redup);font-size:13px}.masuk{display:grid;place-items:center;min-height:100%;padding:24px;background:radial-gradient(90% 70% at 50% 0%,var(--biru-tint) 0%,transparent 70%),linear-gradient(160deg,var(--n50) 40%,var(--hijau-tint) 100%)}.masuk-kartu{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(400px,100%);padding:34px 30px 30px;border:1px solid var(--garis);border-radius:var(--r-lg);background:var(--panel);box-shadow:var(--bayang-lg);text-align:center}.masuk-kartu img{height:42px;width:auto;margin-bottom:12px}.masuk-kartu h1{font-size:17px;font-weight:660}.masuk-kartu p{font-size:12.5px;color:var(--redup)}.masuk-tombol{margin-top:18px;min-height:44px}.masuk-info{font-size:12.5px;color:var(--n400)}.masuk-galat{margin-top:4px;padding:8px 12px;border-radius:var(--r-sm);background:var(--merah-tint);color:var(--merah);font-size:12.5px}.pesan{display:flex;flex-direction:column;gap:4px;max-width:520px;margin:90px auto;padding:22px;border:1px solid var(--garis);border-radius:var(--r);background:var(--panel);color:var(--redup);font-size:13px;text-align:center}.pesan strong{color:var(--teks)}.rel-tutup,.menu-btn,.bar-kecil{display:none}@media (max-width: 980px){.dua{grid-template-columns:1fr}.cari{width:180px}}@media (max-width: 760px){.rel-tutup,.menu-btn{display:grid}.bar-kecil{display:flex}.app{grid-template-columns:1fr}.rel{position:fixed;z-index:50;top:0;bottom:0;left:0;width:264px;transform:translate(-100%);transition:transform .18s ease;box-shadow:var(--bayang-lg)}.rel.buka{transform:none}.bar{flex-wrap:wrap;padding:10px 14px}.bar .cari{order:3;width:100%}.isi-berkas,.lembar{padding:14px}.sorot{flex-direction:column;align-items:flex-start;padding:20px}.fakta div{flex-direction:column;gap:1px}.fakta dt{width:auto}.baris-aksi{opacity:1}.baris-meta .uk{display:none}.baca{height:70vh}}