:root{--navy-900: #0d2250;--navy-800: #14306b;--navy-700: #1d4087;--navy-100: #e6ecf8;--navy-50: #f2f5fb;--gold-600: #b8892b;--gold-500: #d9a93f;--gold-100: #fbf1d9;--ink-900: #14202f;--ink-700: #3a4a5e;--ink-500: #66758a;--ink-300: #aab4c3;--line: #dde3ec;--bg: #f5f7fb;--surface: #ffffff;--ok: #167a4a;--ok-bg: #e2f5ea;--warn: #9a6200;--warn-bg: #fdf0d3;--bad: #b3261e;--bad-bg: #fbe5e3;--info: #1d4087;--info-bg: #e6ecf8;--r-sm: 6px;--r-md: 10px;--r-lg: 14px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--shadow: 0 1px 2px rgba(20, 32, 47, .06), 0 4px 14px rgba(20, 32, 47, .05);--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink-900);font:15px/1.5 var(--font);-webkit-font-smoothing:antialiased}h1{font-size:1.6rem;margin:0 0 var(--sp-1);letter-spacing:-.01em}h2{font-size:1.15rem;margin:0 0 var(--sp-3)}h3{font-size:1rem;margin:0 0 var(--sp-2)}a{color:var(--navy-700)}p{margin:0 0 var(--sp-3)}.muted{color:var(--ink-500)}.small{font-size:.85rem}.right{text-align:right}.nowrap{white-space:nowrap}.row{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap}.row.between{justify-content:space-between}.stack,.grid{display:grid;gap:var(--sp-4)}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width: 960px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 640px){.g2,.g3,.g4{grid-template-columns:1fr}}.shell{display:grid;grid-template-columns:252px 1fr;min-height:100vh}.side{background:var(--navy-900);color:#cfd9ee;padding:var(--sp-4);position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;gap:var(--sp-4)}.brand{display:flex;gap:var(--sp-3);align-items:center;color:#fff;text-decoration:none;padding:var(--sp-2)}.brand b{display:block;font-size:1.05rem}.brand span{font-size:.75rem;color:#9fb2d8}.brand svg{flex:none}.nav{display:grid;gap:2px}.nav h4{margin:var(--sp-3) var(--sp-2) var(--sp-1);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#7f94c0}.nav a{color:#cfd9ee;text-decoration:none;padding:9px var(--sp-3);border-radius:var(--r-sm);display:flex;gap:var(--sp-3);align-items:center}.nav a:hover{background:#ffffff12}.nav a.active{background:var(--navy-700);color:#fff;box-shadow:inset 3px 0 0 var(--gold-500)}.side .me{margin-top:auto;border-top:1px solid rgba(255,255,255,.12);padding-top:var(--sp-3);font-size:.85rem}.side .me b{color:#fff;display:block}.main{padding:var(--sp-5) var(--sp-6) var(--sp-6);max-width:1280px;width:100%}.topbar-m{display:none}@media (max-width: 860px){.shell{grid-template-columns:1fr}.side{position:fixed;z-index:30;top:0;right:22%;bottom:0;left:0;transform:translate(-100%);transition:transform .2s}.side.open{transform:none}.topbar-m{display:flex;align-items:center;gap:var(--sp-3);background:var(--navy-900);color:#fff;padding:var(--sp-3) var(--sp-4);position:sticky;top:0;z-index:20}.main{padding:var(--sp-4)}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:25}}.pagehead{margin-bottom:var(--sp-5);display:flex;justify-content:space-between;gap:var(--sp-4);align-items:flex-end;flex-wrap:wrap}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-5);box-shadow:var(--shadow)}.card.flush{padding:0;overflow:hidden}.card>h2:first-child,.card>.row:first-child>h2{margin-top:0}.btn{font:inherit;font-weight:600;border-radius:var(--r-md);border:1px solid transparent;padding:9px 16px;cursor:pointer;background:var(--navy-800);color:#fff;display:inline-flex;gap:8px;align-items:center;text-decoration:none;line-height:1.2}.btn:hover:not(:disabled){background:var(--navy-700)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.secondary{background:var(--surface);color:var(--navy-800);border-color:var(--ink-300)}.btn.secondary:hover:not(:disabled){background:var(--navy-50)}.btn.gold{background:var(--gold-500);color:#2a1d00}.btn.gold:hover:not(:disabled){background:var(--gold-600);color:#fff}.btn.danger{background:var(--bad)}.btn.ghost{background:transparent;color:var(--navy-800)}.btn.sm{padding:5px 10px;font-size:.85rem}:focus-visible{outline:3px solid var(--gold-500);outline-offset:2px}.field{display:grid;gap:4px}.field>label{font-weight:600;font-size:.88rem}.field .hint{font-size:.8rem;color:var(--ink-500)}.field .err{font-size:.8rem;color:var(--bad)}.input,select.input,textarea.input{font:inherit;width:100%;padding:9px 12px;border:1px solid var(--ink-300);border-radius:var(--r-md);background:#fff;color:var(--ink-900)}.input:focus{border-color:var(--navy-700);outline:3px solid var(--navy-100)}.badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.78rem;font-weight:600;white-space:nowrap;background:var(--navy-100);color:var(--navy-800)}.badge.ok{background:var(--ok-bg);color:var(--ok)}.badge.warn{background:var(--warn-bg);color:var(--warn)}.badge.bad{background:var(--bad-bg);color:var(--bad)}.badge.gold{background:var(--gold-100);color:var(--gold-600)}.badge.muted{background:#eef1f6;color:var(--ink-500)}.table-wrap{overflow-x:auto}table.t{width:100%;border-collapse:collapse}.t th,.t td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.t th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-500);background:var(--navy-50);white-space:nowrap}.t tr:last-child td{border-bottom:0}.t tbody tr:hover{background:#fafbfe}.progress{height:8px;background:var(--navy-100);border-radius:99px;overflow:hidden}.progress>i{display:block;height:100%;background:var(--navy-700);border-radius:99px;transition:width .3s}.progress.gold>i{background:var(--gold-500)}.progress.ok>i{background:var(--ok)}.stat{display:grid;gap:2px}.stat .v{font-size:1.9rem;font-weight:700;letter-spacing:-.02em;color:var(--navy-800)}.stat .l{color:var(--ink-500);font-size:.85rem}.alert{padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);border:1px solid;font-size:.92rem}.alert.info{background:var(--info-bg);border-color:#c5d2ee;color:var(--info)}.alert.warn{background:var(--warn-bg);border-color:#efd699;color:var(--warn)}.alert.bad{background:var(--bad-bg);border-color:#f1bdb9;color:var(--bad)}.alert.ok{background:var(--ok-bg);border-color:#b5e2c8;color:var(--ok)}.empty{text-align:center;padding:var(--sp-6);color:var(--ink-500)}.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:var(--sp-4);overflow-x:auto}.tabs button{font:inherit;background:none;border:0;padding:10px 16px;cursor:pointer;color:var(--ink-500);border-bottom:3px solid transparent;font-weight:600;white-space:nowrap}.tabs button.on{color:var(--navy-800);border-color:var(--gold-500)}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0d22508c;display:grid;place-items:center;z-index:50;padding:var(--sp-4)}.modal{background:#fff;border-radius:var(--r-lg);width:min(640px,100%);max-height:92vh;overflow:auto;padding:var(--sp-5);box-shadow:0 20px 60px #0000004d}.modal.wide{width:min(900px,100%)}.toasts{position:fixed;right:16px;bottom:16px;z-index:80;display:grid;gap:8px}.toast{background:var(--navy-900);color:#fff;padding:10px 16px;border-radius:var(--r-md);box-shadow:var(--shadow);max-width:360px}.toast.bad{background:var(--bad)}.toast.ok{background:var(--ok)}.spinner{width:22px;height:22px;border:3px solid var(--navy-100);border-top-color:var(--navy-700);border-radius:50%;animation:spin .8s linear infinite;margin:var(--sp-5) auto}@keyframes spin{to{transform:rotate(360deg)}}.kat{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--navy-800);color:#fff;font-weight:700;font-size:.85rem}.kat.g1{background:#14306b}.kat.g2{background:#0e7490}.kat.g3{background:#7c4dbd}.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}.login-hero{background:linear-gradient(160deg,var(--navy-900),var(--navy-700));color:#fff;padding:var(--sp-6) 56px;display:flex;flex-direction:column;justify-content:center;gap:var(--sp-5)}.login-hero h1{font-size:2.2rem;line-height:1.15}.login-hero p{color:#c3d0ec;max-width:520px}.login-hero .pill{display:inline-block;border:1px solid rgba(255,255,255,.3);border-radius:99px;padding:4px 14px;font-size:.8rem;color:#e8d29a}.login-form{display:grid;place-items:center;padding:var(--sp-5)}.login-form form{width:min(400px,100%);display:grid;gap:var(--sp-4)}@media (max-width: 860px){.login-wrap{grid-template-columns:1fr}.login-hero{padding:var(--sp-5)}.login-hero h1{font-size:1.6rem}}.chip-row{display:flex;gap:6px;flex-wrap:wrap}.bar-row{display:grid;grid-template-columns:170px 1fr 56px;gap:var(--sp-3);align-items:center;padding:6px 0}@media (max-width: 640px){.bar-row{grid-template-columns:1fr;gap:2px}}.timeline{display:grid;gap:var(--sp-2)}.tl-row{display:grid;grid-template-columns:260px 1fr;gap:var(--sp-3);align-items:center}.tl-track{position:relative;height:22px;background:var(--navy-50);border-radius:6px}.tl-bar{position:absolute;top:3px;bottom:3px;border-radius:5px;background:var(--navy-700)}.tl-bar.berjalan{background:var(--gold-500)}.tl-bar.selesai{background:var(--ok)}@media (max-width: 760px){.tl-row{grid-template-columns:1fr}}.prose{white-space:pre-wrap;line-height:1.7}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}.login-logos{display:flex;align-items:center;gap:var(--sp-4)}.login-logos b{display:block;font-size:1.15rem}.login-logos span{color:#c3d0ec;font-size:.9rem}.logo-lambang{height:84px;width:auto;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}.logo-ngabret{width:min(340px,80%);height:auto}.brand .lambang{height:40px;width:auto;flex:none}@media (max-width: 860px){.logo-lambang{height:64px}.logo-ngabret{width:240px}}.login-hero .pill,.login-hero .logo-ngabret,.login-logos{align-self:flex-start}.pw-wrap{position:relative}.pw-input{padding-right:46px}.pw-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;cursor:pointer;color:var(--ink-500);padding:6px;border-radius:6px;display:grid;place-items:center}.pw-toggle:hover{color:var(--navy-800);background:var(--navy-50)}.lg{position:relative;min-height:100vh;overflow:hidden;background:#0a1c45;color:#fff;isolation:isolate}.lg-photo{position:absolute;top:-4%;right:-4%;bottom:-4%;left:-4%;z-index:-4;background:#0a1c45 url(/bg-kantor-bupati-subang.jpg) center / cover no-repeat;animation:kenburns 32s ease-in-out infinite alternate;will-change:transform;filter:blur(1.6px) saturate(1.1)}.lg-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-3;background:linear-gradient(105deg,#08163aed,#0d2250bd 45%,#14306b61),radial-gradient(circle at 80% 20%,rgba(217,169,63,.22),transparent 55%)}.lg-grid{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;opacity:.35;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 30% 40%,#000,transparent 75%);mask-image:radial-gradient(ellipse at 30% 40%,#000,transparent 75%);animation:gridmove 40s linear infinite}.lg-orb{position:absolute;z-index:-2;border-radius:50%;filter:blur(60px);opacity:.5}.lg-orb.o1{width:420px;height:420px;background:#d9a93f;top:-120px;right:8%;animation:drift 18s ease-in-out infinite alternate;opacity:.28}.lg-orb.o2{width:520px;height:520px;background:#2f5fc4;bottom:-200px;left:-120px;animation:drift 24s ease-in-out infinite alternate-reverse}.lg-orb.o3{width:260px;height:260px;background:#e0b44c;bottom:12%;right:30%;animation:drift 20s ease-in-out infinite alternate;opacity:.18}.lg-inner{min-height:100vh;max-width:1240px;margin:0 auto;padding:var(--sp-6) var(--sp-5);display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center}.lg-hero{display:flex;flex-direction:column;gap:var(--sp-5);align-items:flex-start}.lg-hero h1{font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.12;margin:0;max-width:620px}.lg-hero p{color:#cbd7f1;max-width:520px;margin:0}.lg-brand{display:flex;align-items:center;gap:var(--sp-4)}.lg-brand b{display:block;font-size:1.15rem}.lg-brand span{color:#c3d0ec;font-size:.9rem}.lg-hero .pill{display:inline-block;border:1px solid rgba(224,180,76,.55);background:#e0b44c1a;border-radius:99px;padding:5px 16px;font-size:.8rem;color:#f0d58f}.lg-shine{background:linear-gradient(90deg,#f6d98a,#fff 40%,#e0b44c 60%,#f6d98a);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 5s linear infinite}.lg-hero .logo-ngabret{filter:drop-shadow(0 6px 22px rgba(224,180,76,.35));animation:floaty 7s ease-in-out infinite}.lg-chips{list-style:none;display:flex;gap:var(--sp-3);padding:0;margin:0;flex-wrap:wrap}.lg-chip{background:#ffffff17;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--r-lg);padding:12px 18px;display:grid;min-width:120px;animation-name:lgin,floaty;animation-duration:.8s,6s;animation-delay:var(--d),var(--f);animation-fill-mode:both,none;animation-iteration-count:1,infinite;animation-timing-function:cubic-bezier(.2,.8,.2,1),ease-in-out}.lg-chip b{font-size:1.5rem;color:#f0d58f;line-height:1.1}.lg-chip span{font-size:.8rem;color:#cbd7f1}.lg-in{opacity:0;animation:lgin .85s cubic-bezier(.2,.8,.2,1) var(--d, 0ms) forwards}.lg-card-wrap{display:grid;place-items:center;animation:cardin 1s cubic-bezier(.2,.8,.2,1) .25s both}.lg-card{width:min(420px,100%);display:grid;gap:var(--sp-4);padding:var(--sp-6);border-radius:22px;color:var(--ink-900);background:#fffffff0;box-shadow:0 30px 80px #030a1e8c,0 0 0 1px #ffffff80 inset;position:relative;overflow:hidden}.lg-card:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,#14306b,#d9a93f,#14306b);background-size:200% 100%;animation:shine 6s linear infinite}.lg-card-head h2{font-size:1.6rem;margin:0 0 4px}.lg-card-head p{margin:0;color:var(--ink-500)}.lg-card .input{background:#fff}.lg-card .input:focus{box-shadow:0 0 0 4px #1d408726;transition:box-shadow .2s}.lg-btn{position:relative;overflow:hidden;justify-content:center;padding:12px 16px;font-size:1rem;transition:box-shadow .2s,filter .2s,background .2s}.lg-btn:hover:not(:disabled){box-shadow:0 10px 24px #14306b59;filter:brightness(1.08)}.lg-btn:after{content:"";position:absolute;top:0;bottom:0;width:60px;left:-90px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skew(-20deg);animation:sweep 3.6s ease-in-out 1.6s infinite}@keyframes kenburns{0%{transform:scale(1) translateZ(0)}to{transform:scale(1.12) translate3d(-2%,-1.5%,0)}}@keyframes gridmove{to{background-position:56px 56px,56px 56px}}@keyframes drift{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(50px,-40px,0) scale(1.12)}}@keyframes lgin{0%{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}@keyframes cardin{0%{opacity:0;transform:translate3d(40px,0,0) scale(.97)}to{opacity:1;transform:none}}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes shine{to{background-position:-220% 0}}@keyframes sweep{0%,60%{left:-90px}to{left:130%}}@media (max-width: 960px){.lg-inner{grid-template-columns:1fr;gap:var(--sp-5);padding:var(--sp-5) var(--sp-4)}.lg-card-wrap{order:2}.lg-hero .logo-ngabret{width:240px}}@media (prefers-reduced-motion: reduce){.lg *,.lg-photo,.lg-grid,.lg-orb,.lg-card-wrap{animation:none!important}.lg-in{opacity:1}}.lonceng{position:relative}.lonceng-btn{width:100%;text-align:left;font:inherit;color:#cfd9ee;background:#ffffff12;border:0;border-radius:var(--r-sm);padding:9px var(--sp-3);cursor:pointer;display:flex;gap:var(--sp-3);align-items:center}.lonceng-btn:hover{background:#ffffff21}.lonceng-badge{margin-left:auto;background:var(--gold-500);color:#2a1d00;border-radius:99px;padding:0 8px;font-size:.75rem;font-weight:700}.lonceng-panel{position:fixed;left:264px;top:70px;width:360px;max-width:calc(100vw - 24px);background:#fff;color:var(--ink-900);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 20px 60px #0d22504d;z-index:60;overflow:hidden}@media (max-width: 860px){.lonceng-panel{left:12px;right:12px;top:64px;width:auto;max-width:none}}.lonceng-item{display:grid;gap:2px;width:100%;text-align:left;font:inherit;border:0;border-bottom:1px solid var(--line);background:#fff;padding:12px 14px;cursor:pointer}.lonceng-item:hover{background:var(--navy-50)}.lonceng-item.baru{background:var(--gold-100)}.lonceng-item span{font-size:.88rem;color:var(--ink-700)}.pengumuman{border-left:4px solid var(--navy-700)}.pengumuman.sematan{border-left-color:var(--gold-500);background:#fffdf6}.langkah{display:grid;grid-template-columns:40px 1fr auto;gap:var(--sp-4);align-items:center;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--line)}.langkah:last-child{border-bottom:0}.langkah .no{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:var(--navy-100);color:var(--navy-800)}.langkah.selesai .no{background:var(--ok-bg);color:var(--ok)}.langkah.berjalan .no{background:var(--gold-100);color:var(--gold-600)}@media (max-width: 640px){.langkah{grid-template-columns:36px 1fr}.langkah>:last-child{grid-column:2}}.materi{line-height:1.75;font-size:1rem;max-width:74ch}.materi p{margin:0 0 var(--sp-3)}.materi h3{font-size:1.25rem;margin:var(--sp-5) 0 var(--sp-2);color:var(--navy-800);padding-bottom:6px;border-bottom:2px solid var(--gold-100)}.materi h3:first-child{margin-top:0}.materi h4{font-size:1.05rem;margin:var(--sp-4) 0 var(--sp-2);color:var(--navy-700)}.materi ul,.materi ol{margin:0 0 var(--sp-3);padding-left:1.4em}.materi li{margin-bottom:6px}.materi code{background:var(--navy-50);padding:1px 6px;border-radius:4px;font-size:.92em}.materi hr{border:0;border-top:1px solid var(--line);margin:var(--sp-5) 0}.materi-note{background:var(--gold-100);border-left:4px solid var(--gold-500);border-radius:0 var(--r-md) var(--r-md) 0;padding:var(--sp-3) var(--sp-4);margin:0 0 var(--sp-4)}.materi-note p{margin:0 0 6px}.materi-note p:last-child{margin:0}.materi .table-wrap{margin:0 0 var(--sp-4);border:1px solid var(--line);border-radius:var(--r-md)}.kursus-grid{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:var(--sp-4);align-items:start}.kursus-grid>*{min-width:0}@media (max-width: 860px){.kursus-grid{grid-template-columns:minmax(0,1fr)}}.dlg-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:var(--sp-4);background:#0814348c;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);animation:dlg-fade .2s ease-out}.dlg{--w1: #1d4087;--w2: #14306b;--aksen: #d9a93f;width:min(430px,100%);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 30px 80px #030a1e80;animation:dlg-pop .38s cubic-bezier(.2,1.1,.3,1) backwards;text-align:center}.dlg.ok{--w1: #1f9d63;--w2: #0f6f45;--aksen: #bff0d6}.dlg.bad{--w1: #e0483f;--w2: #a8231c;--aksen: #ffd2cf}.dlg.warn{--w1: #e8a31a;--w2: #b8740a;--aksen: #fff0c9}.dlg-head{position:relative;height:112px;display:grid;place-items:center;background:radial-gradient(circle at 78% 18%,rgba(255,255,255,.22),transparent 45%),linear-gradient(135deg,var(--w1),var(--w2))}.dlg-head:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:22px;background:#fff;border-radius:22px 22px 0 0}.dlg-ikon{position:relative;z-index:1;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;color:var(--w2);background:#fff;box-shadow:0 8px 22px #00000040;animation:dlg-ikon .5s .1s cubic-bezier(.2,1.4,.4,1) both;margin-bottom:14px}.dlg-cincin{position:absolute;z-index:0;width:68px;height:68px;border-radius:50%;border:3px solid rgba(255,255,255,.55);margin-bottom:14px;animation:dlg-denyut 1.8s .5s ease-out 3}.dlg-body{padding:4px var(--sp-5) var(--sp-5)}.dlg-body h2{font-size:1.3rem;margin:0 0 var(--sp-2);color:var(--ink-900)}.dlg-body p{margin:0 0 var(--sp-5);color:var(--ink-500);line-height:1.55}.dlg-aksi{display:flex;gap:var(--sp-3);justify-content:center;flex-wrap:wrap}.dlg-aksi .btn{min-width:128px;justify-content:center;padding:11px 20px;border-radius:12px;font-size:.97rem}.dlg-ya.ok{background:#1f9d63}.dlg-ya.ok:hover:not(:disabled){background:#0f6f45}.dlg-ya.bad{background:#d23b32}.dlg-ya.warn{background:#c78212}.dlg-ya.warn:hover:not(:disabled){background:#a8690a}.dlg-ya{box-shadow:0 6px 16px #14306b40;transition:box-shadow .2s,filter .2s}.dlg-ya:hover:not(:disabled){box-shadow:0 9px 22px #14306b61;filter:brightness(1.07)}.dlg.bad .dlg-ikon.dlg-ikon,.dlg.bad.ikon-gagal .dlg-ikon{animation:dlg-ikon .5s .1s cubic-bezier(.2,1.4,.4,1) both,dlg-getar .5s .55s ease-in-out}.dlg .dlg-centang{stroke-dasharray:24;stroke-dashoffset:24;animation:dlg-gambar .5s .35s ease-out forwards}.dlg .dlg-lingkar{stroke-dasharray:60;stroke-dashoffset:60;animation:dlg-gambar .6s .15s ease-out forwards}.dlg .dlg-silang{stroke-dasharray:18;stroke-dashoffset:18;animation:dlg-gambar .4s .35s ease-out forwards}.dlg .dlg-panah{animation:dlg-geser 1.4s .6s ease-in-out 3}.dlg .dlg-panah-atas{animation:dlg-naik 1.4s .6s ease-in-out 3}.dlg .dlg-tutup{transform-origin:18px 7px;animation:dlg-tutup 1.6s .6s ease-in-out 3}.modal-back{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:dlg-fade .18s ease-out}.modal{animation:dlg-pop .3s cubic-bezier(.2,1,.3,1) backwards;border-radius:18px}@keyframes dlg-fade{0%{opacity:0}to{opacity:1}}@keyframes dlg-pop{0%{opacity:0;transform:translateY(18px) scale(.92)}to{opacity:1;transform:none}}@keyframes dlg-ikon{0%{opacity:0;transform:scale(.3) rotate(-25deg)}to{opacity:1;transform:none}}@keyframes dlg-denyut{0%{transform:scale(1);opacity:.9}to{transform:scale(1.75);opacity:0}}@keyframes dlg-gambar{to{stroke-dashoffset:0}}@keyframes dlg-getar{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes dlg-geser{0%,to{transform:translate(0)}50%{transform:translate(3px)}}@keyframes dlg-naik{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes dlg-tutup{0%,to{transform:rotate(0)}50%{transform:rotate(-14deg)}}@media (max-width: 480px){.dlg-aksi .btn{flex:1 1 100%}}@media (prefers-reduced-motion: reduce){.dlg,.dlg *,.dlg-back,.modal,.modal-back{animation:none!important}.dlg .dlg-centang,.dlg .dlg-lingkar,.dlg .dlg-silang{stroke-dashoffset:0}}.video-wrap{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;border-radius:var(--r-md);overflow:hidden}.video-wrap iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}.materi-item{display:flex;gap:10px;width:100%;text-align:left;padding:11px var(--sp-4);border:0;border-top:1px solid var(--line);background:#fff;cursor:pointer;font:inherit;transition:background .15s}.materi-item:hover{background:var(--navy-50)}.materi-item[aria-current=true]{background:var(--navy-50);box-shadow:inset 3px 0 0 var(--gold-500)}.materi-item.kunci{cursor:not-allowed;color:var(--ink-500);background:#f7f8fb}.materi-item.kunci b{color:var(--ink-500)}.materi-ikon{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;background:var(--navy-100)}.materi-item.selesai .materi-ikon{background:var(--ok-bg);color:var(--ok)}.materi-item.tes .materi-ikon{background:var(--gold-100);color:var(--gold-600)}.materi-item.kunci .materi-ikon{background:#e8ebf1}.tes-kotak{border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5);background:linear-gradient(180deg,#fffdf6,#fff)}.tes-soal{border:0;padding:0;margin:0 0 var(--sp-4)}.tes-soal legend{font-weight:600;margin-bottom:6px}.tes-opsi{display:flex;gap:10px;align-items:flex-start;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:6px;cursor:pointer;background:#fff}.tes-opsi:hover{border-color:var(--navy-700)}.tes-opsi.dipilih{border-color:var(--navy-700);background:var(--navy-50)}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:rgba(29,64,135,.15)}.stack{grid-template-columns:minmax(0,1fr)}.grid>*,.stack>*,.row>*,.pagehead>*{min-width:0}.card,.modal,.dlg-body,.alert,.materi{overflow-wrap:anywhere}.t td,.t th{overflow-wrap:normal}.shell{min-height:100vh;min-height:100dvh}.side{height:100vh;height:100dvh}.lg,.lg-inner,.login-wrap{min-height:100vh;min-height:100dvh}.brand span{font-size:.8rem}.nav h4{font-size:.82rem}.main{padding-left:max(var(--sp-6),env(safe-area-inset-left));padding-right:max(var(--sp-6),env(safe-area-inset-right));padding-bottom:calc(var(--sp-6) + env(safe-area-inset-bottom))}.side{padding-bottom:calc(var(--sp-4) + env(safe-area-inset-bottom))}.topbar-m{padding-left:max(var(--sp-4),env(safe-area-inset-left));padding-right:max(var(--sp-4),env(safe-area-inset-right));padding-top:max(var(--sp-3),env(safe-area-inset-top))}.toasts{bottom:calc(16px + env(safe-area-inset-bottom))}@media (max-width: 860px){.input,select.input,textarea.input,input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{font-size:16px}.input,select.input,.btn{min-height:44px}.btn.sm{min-height:40px;padding:8px 12px}.tabs button,.nav a{min-height:44px}.pw-toggle{width:44px;height:44px;right:0;border-radius:10px}.pw-input{padding-right:52px}label.row,.chip-row label{min-height:40px}input[type=checkbox],input[type=radio]{width:20px;height:20px}.tes-opsi{padding:12px}.materi-item{min-height:52px}.t th,.t td{padding:10px 12px}.main{padding-top:var(--sp-4);padding-left:max(var(--sp-4),env(safe-area-inset-left));padding-right:max(var(--sp-4),env(safe-area-inset-right))}.card{padding:var(--sp-4)}h1{font-size:1.35rem}.pagehead{align-items:flex-start}.pagehead .row{width:100%}.modal{padding:var(--sp-4);border-radius:16px;max-height:94vh;max-height:94dvh}.modal-back{padding:var(--sp-2)}.dlg-back{padding:var(--sp-3)}.dlg-body{padding:4px var(--sp-4) var(--sp-4)}.stat .v{font-size:1.6rem}}@media (max-width: 380px){.main{padding-left:var(--sp-3);padding-right:var(--sp-3)}.btn{padding-left:12px;padding-right:12px}.lg-inner{padding:var(--sp-4) var(--sp-3)}.lg-card{padding:var(--sp-5) var(--sp-4)}}@media (max-height: 480px) and (orientation: landscape){.lg-inner{align-items:start}.lg-hero{gap:var(--sp-3)}.lg-card-wrap{margin:var(--sp-3) 0}.dlg-head{height:84px}}@media (max-width: 640px){.lg-inner{gap:var(--sp-4);padding-top:var(--sp-4)}.lg-hero{gap:var(--sp-3)}.lg-hero h1{font-size:1.45rem}.lg-hero p,.lg-chips{display:none}.lg-hero .logo-ngabret{width:190px}.lg-hero .pill{font-size:.75rem;padding:3px 12px}.logo-lambang{height:52px}}