/* KEMBANGLAMPIR V1 — KANDIDAT UI TAMBAHAN, tidak mengubah autentikasi/DB */
:root{--kl-dark:#083e2a;--kl-green:#12804e;--kl-soft:#e9f8ef;--kl-line:#c9e7d7;--kl-ink:#173c2b}
/* Student */
body.kl-v1-student{background:#f4fbf7;color:var(--kl-ink)}
.kl-v1-student .top{background:linear-gradient(110deg,#063b27,#168350);min-height:64px}
.kl-v1-student .top .logo{background:#195f44}
.kl-v1-student #logout{display:none!important}
.kl-v1-student .primary{background:#168350;color:white}
.kl-v1-student .hero{background:linear-gradient(115deg,#0b603a,#42aa75);box-shadow:0 12px 22px #0b603a12}
.kl-v1-student .tab.active{background:#117448;border-color:#117448;color:white}
.kl-v1-student .eyebrow{color:var(--kl-green)}
.kl-v1-student .tag{color:#14623c;background:#e6f7ee}
.kl-v1-student .panel,.kl-v1-student .stat,.kl-v1-student .card{border-color:#d8ebdf}
.kl-v1-student .field input:focus{border-color:#15945e;outline:2px solid #ceeedb}
.kl-v1-student .btn:not(:disabled){transition:background .16s,transform .16s}
.kl-v1-student .kn-timer{font-variant-numeric:tabular-nums}
/* Admin: cosmetic overrides, preserve long-standing navigation and Supabase online center */
body.kl-v1-admin{--purple:#138455;--purpleLight:#e9f8ef;--navy:#09412e;--navy2:#09543a;--bg:#f6fcf8;--line:#d7eadd;background:#f6fcf8}
.kl-v1-admin .sidebar{background:linear-gradient(155deg,#073722,#135a3c 85%)}
.kl-v1-admin .topbar{background:#fff;border-color:#cfe8d8;box-shadow:0 1px 6px #0737220c}
.kl-v1-admin .nav-item.active,.kl-v1-admin .hero,.kl-v1-admin .btn.primary,.kl-v1-admin .avatar{background:linear-gradient(105deg,#126b44,#2c9b66);color:#fff}
.kl-v1-admin .brand-mark{background:linear-gradient(125deg,#168350,#36b979)}
.kl-v1-admin .brand strong b{color:#bbf6d7}
.kl-v1-admin .sidebar .brand span{color:#baead0}
.kl-v1-admin .stat-icon,.kl-v1-admin .module-symbol{background:#e2f6e9}
.kl-v1-admin .toast{position:relative;background:#e9f8ef;color:#185b38;border:1px solid #a5dabc;padding-right:37px;animation:kl-toast-out 5s forwards}
.kl-v1-admin .toast.kl-toast-error{background:#fff0f0;color:#ab2534;border-color:#f1c1c5}
.kl-toast-x{position:absolute;right:9px;top:9px;background:transparent;border:0;font-size:17px;color:inherit;cursor:pointer}
@keyframes kl-toast-out{0%,88%{opacity:1}100%{opacity:0}}
.kl-v1-admin .top-actions{position:relative}
.kl-v1-admin #ke-sign-out{display:none!important} /* Exit only from avatar; original button stays callable */
/* top-right profile dropdown */
.kl-avatar-trigger{min-height:38px;min-width:38px;border-radius:50%;background:#d8f3e4;color:#095b38;border:2px solid #89c9a4;font-size:13px;font-weight:800}
.kl-menu{position:absolute;top:calc(100% + 12px);right:0;z-index:200;background:#fff;color:#1b4630;min-width:235px;max-width:min(90vw,310px);border:1px solid #cfe6da;border-radius:15px;padding:10px;box-shadow:0 16px 50px #0d392a25}
.kl-menu[hidden]{display:none!important}
.kl-menu-heading{display:block;padding:11px 10px 12px;font-size:11px;letter-spacing:.7px;color:#668876;border-bottom:1px solid #e3f0e9;margin-bottom:8px;font-weight:800}
.kl-menu button{display:flex;align-items:center;width:100%;min-height:44px;padding:10px 13px;border:0;border-radius:9px;gap:10px;text-align:left;background:transparent;color:#174931;font-size:13px;font-weight:750}
.kl-menu button:hover,.kl-menu button:focus-visible{background:#ebf8f0}
.kl-menu button.kl-exit{color:#ba3844;border-top:1px solid #edf0ec;margin-top:8px}
.kl-menu button.kl-exit:hover{background:#fff1f1}
.kl-profile{position:fixed;inset:0;z-index:300;background:#0b3426a8;display:grid;place-items:center;padding:18px;overflow:auto}
.kl-profile[hidden]{display:none!important}
.kl-profile-panel{width:min(100%,510px);background:#fff;border-radius:19px;padding:24px;box-shadow:0 20px 65px #062b1e30;max-height:95vh;overflow:auto}
.kl-profile-panel h2{font-size:22px;margin:3px 0 7px;color:#0b603a}
.kl-profile-panel p,.kl-profile-panel label{font-size:13px;line-height:1.6}
.kl-profile-panel .kl-line{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid #e7f2eb;flex-wrap:wrap}
.kl-profile-panel .kl-line span{color:#638171}
.kl-profile-panel .kl-line strong{overflow-wrap:anywhere;max-width:100%}
.kl-profile-panel .kl-action{border:0;border-radius:10px;background:#137b4d;color:#fff;padding:10px 16px;min-height:42px;font-size:13px;font-weight:800;cursor:pointer}
.kl-profile-panel .kl-action:disabled{opacity:.55;cursor:wait}
.kl-profile-panel input{display:block;width:100%;padding:12px;margin:5px 0 12px;border:1px solid #cbded2;border-radius:9px}
.kl-profile-panel .kl-feedback{min-height:22px;color:#ab3144;font-weight:700}
.kl-profile-buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;justify-content:flex-end}
/* Welcome once after verified login, user must click to dismiss */
.kl-welcome{position:fixed;inset:0;background:#052b1eb0;z-index:400;display:grid;place-items:center;padding:20px}
.kl-welcome[hidden]{display:none!important}
.kl-welcome-inner{background:linear-gradient(#fff,#e7f8ed);text-align:center;border:1px solid #bdddc8;border-radius:19px;width:min(100%,460px);padding:38px 25px;box-shadow:0 20px 60px #04291930}
.kl-welcome h2{font-size:23px;color:#0e6740;line-height:1.35;margin:7px 0 15px}
.kl-welcome p{color:#61806d;line-height:1.6}
.kl-welcome button{background:#137c4e;border:0;color:white;border-radius:9px;padding:13px 23px;font-weight:850;cursor:pointer}
/* Student exam final confirmation — only MONGGO can submit */
#kl-submit-dialog{z-index:500}
#kl-submit-dialog .kl-welcome-inner{width:min(100%,500px)}
#kl-submit-dialog h2{font-size:21px}
#kl-submit-dialog .kl-choice{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin-top:21px}
#kl-submit-dialog .kl-choice button:last-child{background:#f1f7f2;color:#176242;border:1px solid #9ad0ad}
/* 5 second fade for native teacher toast */
.ken-toast-fade{opacity:0!important;transition:opacity .3s ease!important;pointer-events:none}
@media(max-width:640px){.kl-v1-admin .topbar{padding:8px 15px}.kl-v1-admin .crumb{display:none}.kl-v1-admin .grade-chip{display:none}.kl-menu{right:3px}.kl-profile-panel{padding:19px}}