:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:#17365e;background:#f7f9ff;font-size:15px}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.top{height:78px;background:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 max(5vw,24px);border-bottom:1px solid #edf0f7;position:sticky;top:0;z-index:10}.brand{font-weight:850;font-size:24px;color:#173f78;letter-spacing:-1px}.brand span{color:#5584f4}.top nav{display:flex;align-items:center;gap:26px;font-weight:600;font-size:13px}.navadmin{background:#eff4ff;padding:12px 16px;border-radius:12px;color:#3268c5}.hero{margin:32px auto;max-width:1250px;border-radius:26px;padding:70px 6%;background:linear-gradient(115deg,#e1edff,#f0e9ff 60%,#e2f9f1);display:grid;grid-template-columns:1.1fr 0.9fr;gap:35px;min-height:420px;align-items:center}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:850;color:#5780c3}h1{font-size:clamp(32px,4vw,52px);line-height:1.12;margin:14px 0;color:#173f78;letter-spacing:-1.5px}h2{font-size:clamp(23px,2.4vw,31px);margin:9px 0;color:#183e71}h3{color:#1d4478;margin-top:0}.hero p,.section-head p,.section>p{color:#6b82a5;line-height:1.8}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{background:#2e6bdf;color:white;border:1px solid #2e6bdf;border-radius:12px;padding:13px 19px;font-weight:750;display:inline-block;text-align:center}.btn:hover{filter:brightness(.95)}.btn.outline{background:white;color:#2e65c4;border-color:#d7e4f8}.heroart{display:grid;gap:14px;align-content:center;justify-items:center}.floatcard{background:#fff;padding:28px;border-radius:22px;box-shadow:0 14px 35px #3962a321;min-width:80%;font-size:30px}.floatcard b{display:block;font-size:20px;margin:12px 0 3px}.floatcard span{font-size:13px;color:#7d90a9}.floatcard.small{font-size:14px;min-width:62%;padding:15px 20px}.section{max-width:1250px;margin:0 auto;padding:65px 24px}.section.pale{max-width:none;padding-left:max(calc((100vw - 1200px)/2),24px);padding-right:max(calc((100vw - 1200px)/2),24px);background:#edf4ff}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.card,.panel{background:white;border:1px solid #e5ecf8;border-radius:19px;padding:25px;box-shadow:0 6px 25px #284f8b0b}.card{display:flex;flex-direction:column;gap:12px}.card .emoji{font-size:36px}.card h3{margin:0}.card p{color:#7085a4;line-height:1.65;font-size:13px;flex:1}.chip{display:inline-block;align-self:flex-start;padding:7px 10px;border-radius:20px;font-size:11px;background:#e7f6ef;color:#26785a;font-weight:750}.chip.soon{background:#f2f3f9;color:#7a87a5}.price{font-size:26px;font-weight:850;color:#1e4b89}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.tabs button{border:1px solid #dce7f7;background:white;color:#55749f;padding:13px 19px;border-radius:12px;font-weight:700}.tabs button.active{background:#2e6bdf;color:white}.panel{max-width:780px}.panel p{color:#7185a2;line-height:1.7}form{display:grid;gap:14px}label{font-size:13px;font-weight:750;color:#365a88;display:grid;gap:8px}input,textarea,select{width:100%;border:1px solid #d9e5f6;background:#fff;border-radius:11px;padding:13px;color:#244a7b;min-width:0}textarea{min-height:100px;resize:vertical}.feedback{margin:12px 0;color:#245e9b;white-space:pre-wrap;overflow-wrap:anywhere}.hidden{display:none!important}.notice{max-width:1200px;margin:15px auto;padding:16px 22px;border-radius:13px;background:#fff8e4;color:#775c16}.muted{color:#758aa7}footer{padding:35px 5vw;background:#fff;border-top:1px solid #edf1f8;display:flex;justify-content:space-between;color:#7286a2;font-size:12px}.adminbody{background:#f3f7fd}.loginwrap{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(120deg,#e2edff,#f6f0ff,#e9faf4)}.loginbox{width:min(100%,450px);padding:35px;background:#fff;border-radius:24px;box-shadow:0 18px 50px #284f8b19}.loginbox h1{font-size:30px}.loginbox p{color:#7489a5}.loginbox form{margin:24px 0}.loginbox a{color:#4774be;font-size:13px}.adminlayout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.sidebar{background:white;border-right:1px solid #e6ecf6;padding:30px 18px;position:sticky;top:0;height:100vh;overflow:auto}.sidecaption{font-size:10px;letter-spacing:2px;color:#90a2bd;margin:38px 10px 15px;font-weight:800}.sideitem{display:block;width:100%;text-align:left;border:0;background:transparent;border-radius:11px;padding:14px 13px;color:#365a86;font-weight:650;margin:4px 0}.sideitem.active{background:#2e6bdf;color:#fff}.work{min-width:0;padding:26px 35px 70px}.workhead{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-bottom:22px}.workhead h2{margin:0}.workhead p{margin:5px 0;color:#8092ac;font-size:13px}.pill{padding:10px 14px;border-radius:30px;background:#e7efff;color:#3566b4;font-size:12px;font-weight:750}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-bottom:20px}.stat{padding:25px;background:#fff;border-radius:17px;border:1px solid #e5ecf8}.stat span{display:block;color:#7890af;font-size:13px}.stat b{display:block;color:#285fae;font-size:35px;margin-top:12px}.page>.panel,.page>.panel+.panel{margin-bottom:20px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.check{display:flex;align-items:center;gap:9px}.check input{width:auto}.tablewrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{padding:12px;border-bottom:1px solid #e8eef7;text-align:left;font-size:13px}th{color:#6781a5}td button{padding:7px 11px;border:1px solid #d7e4f8;border-radius:9px;background:#f5f8ff;color:#24589c}.menutoggle{display:none;border:0;background:#e6efff;border-radius:9px;padding:10px}@media(max-width:950px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.heroart{display:none}.adminlayout{grid-template-columns:220px minmax(0,1fr)}.work{padding:22px}}@media(max-width:650px){.top{height:auto;min-height:70px;flex-wrap:wrap;gap:14px;padding:15px}.top nav{gap:11px;flex-wrap:wrap;font-size:12px}.hero{margin:15px;padding:45px 23px}.section{padding:40px 17px}.cards{grid-template-columns:1fr}.formgrid,.statgrid{grid-template-columns:1fr}.adminlayout{display:block}.sidebar{position:fixed;left:0;top:0;z-index:40;width:265px;transform:translateX(-100%);transition:transform .2s;box-shadow:10px 0 35px #16345c18}.sidebar.open{transform:translateX(0)}.menutoggle{display:block}.work{padding:20px 15px}.pill{display:none}.workhead{justify-content:flex-start}footer{gap:15px;flex-wrap:wrap}}

/* EduCorner Portal — refresh antarmuka admin, tidak mengubah API */
:root{--ec-ink:#19355b;--ec-blue:#3678ed;--ec-line:#e4eaf5}
html{scroll-behavior:smooth}
body{color:var(--ec-ink);-webkit-font-smoothing:antialiased}
button,input,select,textarea{transition:border-color .18s,box-shadow .18s,background .18s,transform .18s}
input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #a8c7ff;outline-offset:2px}
input:focus,textarea:focus,select:focus{border-color:#7daaf9;box-shadow:0 0 0 4px #dbe9ff70}
.btn{background:linear-gradient(110deg,#2e6bdf,#537cf0);border:0;box-shadow:0 6px 18px #2e6bdf23}
.btn:hover{transform:translateY(-1px)}
.adminbody{background:#f5f8ff}
.loginwrap{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 8% 12%,#d7e6ff 0,transparent 38%),radial-gradient(circle at 95% 85%,#e7dcff 0,transparent 37%),linear-gradient(135deg,#f6f9ff,#f4fbf9);padding:32px 18px}
.loginwrap:before,.loginwrap:after{content:"";position:absolute;z-index:-1;border:1px solid #ffffffb8;border-radius:50%;width:420px;height:420px;pointer-events:none}
.loginwrap:before{top:-250px;left:-150px}.loginwrap:after{bottom:-290px;right:-140px;width:520px;height:520px}
.loginbox{width:min(100%,470px);padding:clamp(26px,5vw,43px);border:1px solid #fff;border-radius:26px;box-shadow:0 24px 65px #274e851c;background:#fffffff2;backdrop-filter:blur(12px)}
.loginmark{display:inline-flex;align-items:center;gap:6px;background:#edf4ff;color:#396bbd;padding:9px 12px;border-radius:99px;font-size:11px;font-weight:800;margin-bottom:23px}
.loginbox .brand{font-size:27px}
.loginbox h1{font-size:clamp(26px,4vw,34px);line-height:1.16;margin:27px 0 8px;letter-spacing:-.9px}
.loginbox p{line-height:1.7;margin:0;color:#7588a6}
.loginbox form{margin:25px 0 12px;gap:11px}
.loginbox label{font-size:12px;color:#2d4e7d;font-weight:750}
.loginbox input{background:#f8faff;border:1px solid #dfe7f6;padding:14px 15px;border-radius:12px;font-size:14px}
.loginbox .btn{margin-top:11px;width:100%;padding:15px;border-radius:12px}
.loginbox>a{display:inline-block;margin-top:12px}
.password-field{position:relative}
.password-field input{padding-right:105px}
.password-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:#e9f1ff;color:#2d63b6;border-radius:9px;padding:9px 12px;font-size:12px;font-weight:800}
.password-toggle:hover{background:#dceaff}
.adminlayout{grid-template-columns:258px minmax(0,1fr);background:#f6f8fd}
.sidebar{border-right:1px solid #e6ecf7;padding:26px 16px;background:#fff}
.sidebar .brand{display:block;padding:9px 11px}
.sidecaption{margin:32px 12px 15px}
.sideitem{border-radius:12px;padding:13px 14px;line-height:1.45}
.sideitem:hover:not(.active){background:#f1f5fd;color:#2559a9}
.sideitem.active{background:linear-gradient(110deg,#3073eb,#488cf3);box-shadow:0 7px 15px #3578e522}
.work{padding:clamp(18px,3vw,38px);max-width:1800px;width:100%}
.workhead{background:linear-gradient(110deg,#e3efff,#eae9ff 70%,#e4f8f3);border:1px solid #e2eafb;border-radius:21px;padding:25px 28px;margin-bottom:23px}
.workhead h2{font-size:clamp(22px,3vw,30px)}
.statgrid{gap:14px}
.stat{border-radius:18px;box-shadow:0 5px 25px #284f8b09;min-width:0}
.stat:nth-child(1){background:#eaf2ff}.stat:nth-child(2){background:#f0ecff}.stat:nth-child(3){background:#e7f8f2}
.stat b{color:#285cae}
.page>.panel{max-width:none;border-radius:19px;box-shadow:0 6px 25px #284f8b09}
.page>.panel h3{font-size:18px}
.page table{background:white}
.page th{background:#f5f8fe;white-space:nowrap}
.page td{vertical-align:middle}
.page tr:hover td{background:#f9fbff}
.page .feedback{font-size:13px}
@media(max-width:950px){.adminlayout{grid-template-columns:220px minmax(0,1fr)}}
@media(max-width:650px){.loginwrap{min-height:100dvh;padding:20px 15px}.loginbox{padding:26px 22px}.adminlayout{display:block}.work{padding:14px}.workhead{padding:18px 16px;border-radius:17px}.statgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat{padding:18px}.stat b{font-size:27px}.sidebar{width:min(285px,85vw)}.page>.panel{padding:18px}.loginbox .brand{font-size:24px}}
@media(max-width:390px){.statgrid{grid-template-columns:1fr}.loginbox h1{font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}