body.admin-kaca,body.kaca{--font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--r-kontrol: 12px;--r-kartu: 22px;--r-panel: 28px;--r-lembar: 32px;--g-tekan: .11s ease-out;--g-cepat: .16s cubic-bezier(.2, 0, 0, 1);--g-standar: .24s cubic-bezier(.16, 1, .3, 1);--g-masuk: .32s cubic-bezier(.16, 1, .3, 1);--latar: linear-gradient(135deg, #e8f0fb 0%, #d6e4f8 48%, #e9eefb 100%);--orb1: rgba(240, 176, 74, .38);--orb2: rgba(86, 140, 235, .34);--orb3: rgba(109, 106, 216, .18);--k1: rgba(255, 255, 255, .55);--k2: rgba(255, 255, 255, .68);--k3: rgba(255, 255, 255, .8);--k4: rgba(255, 255, 255, .94);--blur: blur(24px) saturate(180%) brightness(var(--terang-latar));--garis: rgba(255, 255, 255, .85);--kilau: #fff;--pisah: rgba(11, 31, 69, .1);--garis-i: rgba(11, 31, 69, .42);--spec: #fff;--spec-lawan: rgba(255, 255, 255, .75);--tepi: rgba(11, 31, 69, .12);--lensa: rgba(255, 255, 255, .3);--mekar: rgba(255, 255, 255, .7);--terang-latar: 1.04;--g-pegas: .28s cubic-bezier(.34, 1.4, .64, 1);--isi-cincin: "";--garis-cincin: transparent;--bayang-lensa: inset 0 0 14px var(--lensa);--t1: #0b1f45;--t2: #3d4c6b;--t3: #55637f;--aksen: #c9861a;--tombol: #0b1f45;--tombol-teks: #fff;--tombol-h: #1a3266;--input: rgba(255, 255, 255, .78);--b1: 0 8px 32px rgba(11, 31, 69, .1);--b2: 0 18px 48px rgba(11, 31, 69, .16);--b3: 0 30px 80px rgba(11, 31, 69, .28);--sorot: rgba(255, 255, 255, .9);--pekat: #ffffff;--tirai: rgba(11, 31, 69, .35);--s-ok: #1f7a43;--s-warn: #8a6300;--s-info: #1e4fa8;--s-bahaya: #b42318;--s-ungu: #5b3fa8}html.dark body.admin-kaca,html.dark body.kaca{--latar: linear-gradient(135deg, #050f23 0%, #0b1f45 45%, #1a3266 100%);--orb1: rgba(240, 176, 74, .35);--orb2: rgba(59, 94, 166, .45);--orb3: rgba(109, 106, 216, .22);--k1: rgba(255, 255, 255, .06);--k2: rgba(255, 255, 255, .1);--k3: rgba(255, 255, 255, .16);--k4: rgba(19, 37, 77, .92);--blur: blur(28px) saturate(160%) brightness(var(--terang-latar));--spec: rgba(255, 255, 255, .85);--spec-lawan: rgba(255, 255, 255, .3);--tepi: rgba(255, 255, 255, .14);--lensa: rgba(255, 255, 255, .05);--mekar: rgba(255, 255, 255, .24);--terang-latar: .66;--garis: rgba(255, 255, 255, .14);--kilau: rgba(255, 255, 255, .18);--pisah: rgba(255, 255, 255, .08);--garis-i: rgba(255, 255, 255, .32);--t1: #fff;--t2: rgba(255, 255, 255, .72);--t3: rgba(255, 255, 255, .55);--aksen: #f0b04a;--tombol: #f0b04a;--tombol-teks: #1a1205;--tombol-h: #f6c06a;--input: rgba(255, 255, 255, .07);--b1: 0 8px 32px rgba(0, 0, 0, .18);--b2: 0 18px 48px rgba(0, 0, 0, .28);--b3: 0 30px 80px rgba(0, 0, 0, .4);--sorot: rgba(255, 255, 255, .16);--pekat: #13254d;--tirai: rgba(0, 0, 0, .5);--s-ok: #4ade80;--s-warn: #fbbf24;--s-info: #7aa2ff;--s-bahaya: #f87171;--s-ungu: #c4b5fd;color-scheme:dark}.ruang{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.orb{position:absolute;border-radius:50%;filter:blur(120px);will-change:transform}.orb-a{width:520px;height:520px;background:var(--orb1);top:-120px;right:8%;animation:orb-melayang1 70s ease-in-out infinite alternate}.orb-b{width:620px;height:620px;background:var(--orb2);bottom:-200px;left:-120px;animation:orb-melayang2 90s ease-in-out infinite alternate}.orb-c{width:420px;height:420px;background:var(--orb3);top:40%;left:45%;animation:orb-melayang1 80s ease-in-out infinite alternate-reverse}@keyframes orb-melayang1{to{transform:translate(-140px,120px) scale(1.1)}}@keyframes orb-melayang2{to{transform:translate(160px,-100px) scale(.92)}}@property --sudut-cahaya{syntax: "<angle>"; inherits: true; initial-value: 340deg;}@supports (width: calc(sin(1deg)*1px)){body.admin-kaca,body.kaca{--bayang-lensa: inset 0 0 14px var(--lensa), inset calc(sin(var(--sudut-cahaya))*-10px) calc(cos(var(--sudut-cahaya))*10px) 16px -12px var(--mekar)}}:where(body.admin-kaca .mirsad-kartu,body.admin-kaca .kaca-ringan,body.kaca :is(.g-kartu,.pt-kartu,.pt-peng,.g-hero),body.pintu :is(.portal-kartu,main.teks)){position:relative}body.admin-kaca #menuSamping:before,body.admin-kaca #bilahAtas:before,body.admin-kaca .mirsad-kartu:before,body.admin-kaca .kaca:before,body.admin-kaca .kaca-ringan:before,body.kaca :is(.g-atas,.pt-top,.g-side,.pt-side,.g-bawah,.pt-bawah,.g-hero,.g-kartu,.pt-kartu,.pt-peng):before,body.pintu .pn-tema:before,body.pintu .kepala:before,body.pintu main.teks:before,body.pintu .portal-kartu:before,body.pintu .peran-kartu a:before{content:var(--isi-cincin);display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:1;opacity:1;background:conic-gradient(from var(--sudut-cahaya),var(--spec) 0deg,var(--tepi) 55deg,var(--tepi) 140deg,var(--spec-lawan) 180deg,var(--tepi) 220deg,var(--tepi) 305deg,var(--spec) 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}@supports not (((-webkit-mask-composite: xor) or (mask-composite: exclude)) or (-webkit-mask-composite: xor)){html body.admin-kaca,html.dark body.admin-kaca,html body.kaca,html.dark body.kaca{--isi-cincin: none;--garis-cincin: var(--garis);--bayang-lensa: 0 0 0 0 transparent}}@media (prefers-reduced-transparency: reduce){html body.admin-kaca,html.dark body.admin-kaca,html body.kaca,html.dark body.kaca{--isi-cincin: none;--garis-cincin: var(--garis);--bayang-lensa: 0 0 0 0 transparent;--terang-latar: 1}}@media (forced-colors: active){html body.admin-kaca,html.dark body.admin-kaca,html body.kaca,html.dark body.kaca{--isi-cincin: none;--garis-cincin: CanvasText;--bayang-lensa: 0 0 0 0 transparent}}@media (prefers-reduced-motion: reduce){body.admin-kaca,body.kaca{--g-pegas: .01ms linear}}@media print{html body.admin-kaca,html.dark body.admin-kaca,html body.kaca,html.dark body.kaca{--isi-cincin: none;--garis-cincin: var(--garis);--bayang-lensa: 0 0 0 0 transparent}}@media (prefers-reduced-transparency: no-preference){body.admin-kaca,body.kaca{--b1: 0 14px 48px rgba(11, 31, 69, .12);--b2: 0 26px 70px rgba(11, 31, 69, .2);--blur: blur(32px) saturate(180%) brightness(var(--terang-latar))}html.dark body.admin-kaca,html.dark body.kaca{--b1: 0 14px 48px rgba(0, 0, 0, .26);--b2: 0 26px 70px rgba(0, 0, 0, .38);--blur: blur(36px) saturate(160%) brightness(var(--terang-latar))}}@media (prefers-reduced-motion: reduce){.orb{animation:none}}@media (prefers-reduced-transparency: reduce){html body.kaca,html.dark body.kaca{--k1: var(--pekat);--k2: var(--pekat);--k3: var(--pekat);--k4: var(--pekat);--blur: none;--input: var(--pekat)}.ruang{display:none}}@supports not (((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) or (-webkit-backdrop-filter: blur(1px))){html body.kaca,html.dark body.kaca{--k1: var(--pekat);--k2: var(--pekat);--k3: var(--pekat);--k4: var(--pekat);--blur: none;--input: var(--pekat)}.ruang{display:none}}body.pintu{--kartu: var(--k2);--teks: var(--t1);--teks-2: var(--t2);--judul: var(--t1);--tombol-latar: var(--tombol);--fokus: #8a5a0c;--emas-tipis: color-mix(in srgb, var(--aksen) 16%, transparent);--emas-teks: #8a5a0c;--kepala-latar: var(--k3);margin:0;min-height:100vh;background:#e8f0fb;background:var(--latar);background-attachment:fixed;color:var(--t1);font-family:var(--font)}html.dark body.pintu{--fokus: #f0b04a;--emas-teks: #f0b04a;background-color:#0b1f45}body.pintu>:not(.ruang):not(.lewati):not(.pn-tema):not(.kepala){position:relative;z-index:1}body.pintu .pn-tema{position:fixed;top:calc(env(safe-area-inset-top) + 12px);right:12px;z-index:40;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:999px;color:var(--t1);cursor:pointer;background:var(--k3);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--garis-cincin);box-shadow:var(--b1),inset 0 1px 0 var(--kilau),var(--bayang-lensa);transition:transform var(--g-pegas)}body.pintu .pn-tema:active{transform:scale(.97)}body.pintu .pn-tema svg{width:22px;height:22px}body.pintu .kepala{top:12px;margin:12px 68px 0 12px;border-radius:var(--r-kartu);border:1px solid var(--garis-cincin);background:var(--k3);box-shadow:var(--b1),inset 0 1px 0 var(--kilau),var(--bayang-lensa);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}html.dark body.pintu .merek-logo{background:#fff;border-radius:12px;padding:.25rem .3rem}body.pintu main.teks{margin:1.25rem auto 2rem;padding:clamp(1.25rem,4vw,2.5rem);border-radius:var(--r-panel);background:var(--k3);border:1px solid var(--garis-cincin);box-shadow:var(--b2),inset 0 1px 0 var(--kilau),var(--bayang-lensa);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);max-width:min(48rem,calc(100% - 24px))}body.pintu main.panduan{max-width:min(54rem,calc(100% - 24px))}body.pintu main.teks a:not(.tombol){color:var(--emas-teks)}body.pintu .formulir input{background:var(--input);border:1px solid var(--garis-i);border-radius:var(--r-kontrol);color:var(--t1);min-height:48px}body.pintu .formulir input:focus{border-color:var(--aksen);box-shadow:0 0 0 4px color-mix(in srgb,var(--aksen) 25%,transparent)}body.pintu .tombol{background:var(--tombol);color:var(--tombol-teks);min-height:48px;transition:transform var(--g-tekan),background var(--g-cepat)}body.pintu .tombol:hover{background:var(--tombol-h);transform:none;box-shadow:none}body.pintu .tombol:active{transform:scale(.97)}body.pintu .tombol-teks{color:var(--emas-teks);min-height:44px}body.pintu .galat{color:var(--s-bahaya)}html.dark body.pintu .galat{color:#fda4af}body.pintu .info{background:var(--emas-tipis);border-left-color:var(--aksen);color:var(--t1)}body.pintu .rincian dt{color:var(--t1)}body.pintu .panduan-nav a{color:var(--t1);border-color:var(--garis);background:var(--k1)}body.pintu .panduan-nav a[aria-current=page]{background:var(--tombol);color:var(--tombol-teks);border-color:transparent}body.pintu .panduan code{background:var(--k1)}body.pintu .sidik{overflow-wrap:anywhere}body.pintu .kaki{background:transparent;color:var(--t2)}body.pintu .kaki:after{display:none}body.pintu .kaki .hak-cipta{color:var(--t3);text-align:center}body.pintu .portal-latar.pola{display:none}body.pintu .portal-latar:not(.pola){opacity:.22}body.pintu .portal-latar:after{display:none}body.pintu .portal-latar img{position:absolute;top:0;right:0;bottom:0;left:0}body.pintu .portal-kartu{background:var(--k3);color:var(--t1);border:1px solid var(--garis-cincin);box-shadow:var(--b3),inset 0 1px 0 var(--kilau),var(--bayang-lensa);border-radius:var(--r-panel);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}html.dark body.pintu .portal-logo{background:#fff;border-radius:22px;padding:.5rem .6rem}body.pintu .portal-kartu h1{color:var(--t1)}body.pintu :is(.portal-sekolah,.portal-tagline){color:var(--t2)}body.pintu .peran-kartu a{background:var(--k2);color:var(--t1);border:1px solid var(--garis-cincin);box-shadow:var(--b1),inset 0 1px 0 var(--kilau),var(--bayang-lensa);border-radius:var(--r-kartu);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);transition:transform var(--g-pegas),box-shadow var(--g-cepat)}body.pintu .peran-1 a{background:linear-gradient(145deg,color-mix(in srgb,var(--aksen) 14%,var(--k2)),var(--k2))}body.pintu .peran-2 a{background:linear-gradient(145deg,color-mix(in srgb,var(--s-info) 16%,var(--k2)),var(--k2))}body.pintu .peran-3 a{background:linear-gradient(145deg,color-mix(in srgb,var(--aksen) 26%,var(--k2)),var(--k2));color:var(--t1)}body.pintu .peran-kartu a:hover{transform:translateY(-2px);box-shadow:var(--b2),inset 0 1px 0 var(--kilau),var(--bayang-lensa)}body.pintu .peran-kartu a:active{transform:scale(.97)}body.pintu .peran-ikon{background:var(--k3);color:var(--emas-teks);border:1px solid var(--garis);box-shadow:none}body.pintu .peran-3 .peran-ikon{color:var(--emas-teks)}body.pintu .peran-kartu .peran-isi{opacity:1;color:var(--t2)}body.pintu .portal-tautan a{background:var(--k2);color:var(--t1);border-color:var(--garis);min-height:44px;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}body.pintu .portal-tautan a:hover{background:var(--k3);transform:none}body.pintu .portal-tautan a:active{transform:scale(.97)}body.pintu .portal-tautan .ikon{color:var(--emas-teks)}body.pintu .portal-kaki{background:var(--k2);color:var(--t2);border:1px solid var(--garis)}@media (prefers-reduced-motion: reduce){body.pintu *,body.pintu *:before,body.pintu *:after{transition:none!important;animation:none!important}body.pintu .peran-kartu a:hover{transform:none}}@media (prefers-reduced-transparency: reduce){body.pintu *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}
