:root{--emerald:#006b45;--emerald2:#087f50;--gold:#d5a52b;--ink:#20312a;--muted:#718078}*{box-sizing:border-box}body{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:#f4f7f5;color:var(--ink)}.sidebar{width:250px;position:fixed;inset:0 auto 0 0;background:linear-gradient(180deg,#00583a,#063d2d);color:#fff;padding:22px 14px;overflow:auto;z-index:10}.brand{font-weight:800;font-size:17px;letter-spacing:.3px;padding:8px 10px 22px;border-bottom:1px solid #ffffff26;margin-bottom:14px}.nav-link{color:#d9eee4;padding:10px 12px;border-radius:9px;margin:3px 0;font-size:14px}.nav-link:hover,.nav-link.active{background:#ffffff20;color:#fff}.main{margin-left:250px;padding:26px;min-height:100vh}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.card{border:0;border-radius:15px;box-shadow:0 5px 24px #173e2b0b}.stat{padding:20px}.stat .num{font-size:30px;font-weight:800;color:var(--emerald)}.btn-success{background:var(--emerald);border-color:var(--emerald)}.btn-success:hover{background:#005438}.form-control,.form-select{border-color:#dce6df;border-radius:9px;padding:10px}.table thead th{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:#66756d;background:#f7faf8}.school-logo{width:44px;height:44px;object-fit:contain}.badge-level{background:#e2f4e9;color:#006b45}.preview-wrap{background:#e9eeeb;padding:22px;border-radius:14px;overflow:auto}.exam-card{width:100mm;height:70mm;background:#fff;border:.4mm solid var(--emerald);position:relative;padding:3mm;color:#1b2821;font-family:Arial,sans-serif;overflow:hidden}.exam-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:2mm;background:var(--emerald)}.card-inner{margin-left:1mm;height:100%;position:relative}.card-head{display:flex;align-items:center;gap:2mm;border-bottom:.5mm solid #d5a52b;padding-bottom:1.5mm}.card-head img{width:13mm;height:13mm;object-fit:contain}.school-title{font-size:9pt;font-weight:800;line-height:1.1;text-transform:uppercase;color:#006b45}.school-sub{font-size:5.5pt;line-height:1.2}.card-title{text-align:center;font-weight:800;font-size:10pt;margin:1.6mm 0 .5mm;color:#006b45}.card-sub{text-align:center;font-size:6.5pt;margin-bottom:1.3mm}.identity{font-size:7.4pt;line-height:1.55;display:grid;grid-template-columns:27mm 1fr}.signature{position:absolute;right:1mm;bottom:0;text-align:center;width:37mm;font-size:6pt;line-height:1.15}.signature .sign-images{height:10mm;display:flex;align-items:center;justify-content:center;gap:1mm}.signature img{max-height:10mm;max-width:18mm;object-fit:contain}.signature .head{font-weight:bold;margin-top:1mm}.cut-grid{display:grid;grid-template-columns:repeat(2,100mm);grid-template-rows:repeat(4,70mm);gap:0;justify-content:center}.cut-cell{width:100mm;height:70mm;position:relative}.cut-cell:nth-child(odd){border-right:.15mm dashed #999}.cut-cell:nth-child(-n+6){border-bottom:.15mm dashed #999}.print-page{width:215.9mm;height:330.2mm;padding:25.1mm 7.95mm;display:flex;align-items:flex-start;justify-content:center;page-break-after:always;overflow:hidden}.print-page:last-child{page-break-after:auto}@media(max-width:900px){.sidebar{width:76px;padding:15px 8px}.brand{font-size:10px;padding:8px 2px}.nav-link{font-size:0;text-align:center}.nav-link i{font-size:18px}.nav-link:after{content:attr(data-short);font-size:10px;display:block}.main{margin-left:76px;padding:16px}}@media(max-width:600px){.main{padding:12px}.topbar{align-items:flex-start;gap:10px;flex-direction:column}.hide-mobile{display:none}}

/* Responsif lintas perangkat dan scroll vertikal dashboard */
html,body{min-height:100%;height:auto;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
.main{min-height:100vh;height:auto;overflow:visible;padding-bottom:36px}
.main>*{max-width:100%}
.mobile-menu{display:none;flex:0 0 auto}
.sidebar-backdrop{display:none}
img,canvas,svg{max-width:100%}
.table-responsive{width:100%;-webkit-overflow-scrolling:touch}
.form-control,.form-select,button,.btn{touch-action:manipulation}
@media(max-width:900px){
 .sidebar{width:220px;padding:18px 12px}
 .brand{font-size:15px}
 .nav-link{font-size:13px;text-align:left}
 .nav-link:after{content:none}
 .main{margin-left:220px;padding:18px}
}
@media(max-width:700px){
 .mobile-menu{display:inline-flex;align-items:center;justify-content:center}
 .sidebar{width:min(82vw,290px);height:100dvh;max-height:100dvh;overflow-y:auto;transform:translateX(-105%);transition:transform .22s ease;z-index:1050;box-shadow:8px 0 28px #0002}
 .sidebar.mobile-open{transform:translateX(0)}
 .sidebar .brand{font-size:16px;padding:8px 10px 18px}
 .sidebar .nav-link{font-size:14px;text-align:left;padding:11px 12px}
 .sidebar .nav-link:after{content:none}
 .main{margin-left:0;padding:14px 12px 32px;width:100%;min-width:0}
 .sidebar-backdrop.show{display:block;position:fixed;inset:0;background:#10251b80;z-index:1040}
 .topbar{display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
 .topbar h4{font-size:1.1rem}
 .topbar>.d-flex{flex-wrap:wrap}
 .card{border-radius:12px}
 .card.p-4{padding:1rem!important}
 .stat{padding:15px}
 .stat .num{font-size:26px}
 .table{min-width:620px}
 .preview-wrap{padding:12px}
 .exam-card{transform-origin:top left}
}
@media(max-width:420px){
 .main{padding-left:9px;padding-right:9px}
 .topbar .badge{white-space:normal;text-align:center}
 .btn{white-space:normal}
 .form-control,.form-select{font-size:16px}
}
@media(orientation:landscape) and (max-height:500px) and (max-width:900px){
 .sidebar{height:100dvh;max-height:100dvh}
}