:root{
  --bg:#f4f7fb; --panel:#ffffff; --text:#162033; --muted:#6c778b; --line:#e6ecf5;
  --primary:#2364d2; --primary2:#0f3d91; --danger:#d93025; --success:#168a52; --warning:#b7791f;
  --soft-danger:#fff0ee; --soft-success:#eaf8f0; --soft-warning:#fff7e6; --soft-blue:#eef5ff;
  --shadow:0 12px 34px rgba(22,32,51,.08); --radius:18px;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit} .sidebar{position:fixed;inset:0 auto 0 0;width:270px;background:linear-gradient(180deg,#0e265d,#153b88);color:#fff;padding:22px;display:flex;flex-direction:column;gap:22px;z-index:2}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:46px;height:46px;border-radius:14px;background:#fff;color:#153b88;display:grid;place-items:center;font-weight:900;letter-spacing:.4px}.brand strong{display:block;font-size:18px}.brand span{display:block;font-size:12px;opacity:.75;margin-top:2px}.login-brand{color:var(--text)}.login-brand .brand-mark{background:var(--primary);color:#fff}
.sidebar nav{display:flex;flex-direction:column;gap:8px}.sidebar nav a{padding:12px 14px;border-radius:12px;text-decoration:none;color:#dbe7ff;font-weight:650}.sidebar nav a:hover,.sidebar nav a.active{background:rgba(255,255,255,.14);color:#fff}.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:5px;background:rgba(255,255,255,.1);padding:14px;border-radius:14px}.sidebar-footer small{opacity:.7}.sidebar-footer a{font-size:13px;color:#fff;margin-top:6px}
.main{margin-left:270px;padding:30px}.topbar{margin-bottom:24px}.topbar h1{margin:0 0 8px;font-size:30px;letter-spacing:-.6px}.topbar p{margin:0;color:var(--muted)}
.grid{display:grid;gap:18px}.cards-4{grid-template-columns:repeat(4,1fr)}.two-col{grid-template-columns:1.3fr .7fr}.three-col{grid-template-columns:repeat(3,1fr)}.grid-form{grid-template-columns:1fr 1fr;align-items:end}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:22px;margin-bottom:20px}.panel h2{font-size:19px;margin:0 0 14px}.panel p{color:var(--muted)}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.panel-head h2{margin-bottom:3px}.panel-head p{margin:0;color:var(--muted)}
.stat-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:7px}.stat-card span{color:var(--muted);font-weight:700}.stat-card strong{font-size:36px;line-height:1}.stat-card small{color:var(--muted)}.stat-card.danger{background:var(--soft-danger);border-color:#ffd5d0}.big-note{font-size:22px;font-weight:800;color:var(--text)!important}.hint{background:var(--soft-blue);padding:14px;border-radius:14px;color:#22416f;border:1px solid #dbe9ff}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}.table-wrap.wide{max-width:100%}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:12px 13px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#607088;background:#f8fafc}td{font-size:14px}tr:last-child td{border-bottom:0}.small,small{color:var(--muted);font-size:12px}.row-danger{background:var(--soft-danger)}.cell-drop{background:var(--soft-danger);color:#9c1c13;font-weight:800}.cell-up{background:var(--soft-success);color:#0d663b;font-weight:800}.matrix th,.matrix td{text-align:center}.matrix td:first-child,.matrix th:first-child{text-align:left;position:sticky;left:0;background:#fff;z-index:1}.matrix th:first-child{background:#f8fafc}
.badge,.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.badge-danger,.pill.danger{background:var(--soft-danger);color:var(--danger)}.badge-success{background:var(--soft-success);color:var(--success)}.badge-warning{background:var(--soft-warning);color:var(--warning)}.badge-neutral{background:#eef1f6;color:#596579}.link{font-weight:800;color:var(--primary);text-decoration:none}.empty{text-align:center;color:var(--muted);padding:22px!important}.muted{color:var(--muted)}
.form{display:grid;gap:14px}.form label{display:grid;gap:7px;font-weight:750}.form input,.form select,.filters input,.filters select{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:14px;background:#fff;color:var(--text)}.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.btn{border:0;border-radius:12px;padding:11px 15px;background:#eaf0fb;color:#153b88;text-decoration:none;font-weight:850;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;min-height:42px}.btn.primary{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff}.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--text)}.btn.small{padding:8px 10px;min-height:32px;font-size:12px}.alert{border-radius:14px;padding:14px 15px;margin:0 0 16px}.alert.success{background:var(--soft-success);color:#0d663b}.alert.danger{background:var(--soft-danger);color:#9c1c13}.file-drop{grid-column:1/-1;border:2px dashed #c7d4e8;border-radius:16px;padding:22px;background:#f9fbff;text-align:center;cursor:pointer}.file-drop input{border:0;padding:0;background:transparent}.file-drop span{display:block;color:var(--muted);font-weight:600;margin-top:8px}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(440px,100%);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:24px;padding:28px}.login-card h2{font-size:28px;margin:22px 0 8px}.login-card p{color:var(--muted);margin:0 0 20px}.student-hero{background:linear-gradient(135deg,#163b86,#2364d2);color:#fff;border-radius:22px;padding:24px;margin-bottom:20px;display:flex;justify-content:space-between;gap:18px;align-items:center;box-shadow:var(--shadow)}.student-hero h2{margin:0 0 6px;font-size:28px}.student-hero p{margin:0;color:#dce8ff}.student-hero .btn{background:#fff;color:#153b88}.timeline{display:flex;gap:12px;flex-wrap:wrap}.timeline div{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:12px 14px}.timeline strong{display:block}.timeline span{color:var(--muted);font-size:12px}.list{display:grid;gap:10px}.list-row{display:flex;justify-content:space-between;align-items:center;background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:12px}.list-row strong{display:block}.list-row span{display:block;color:var(--muted);font-size:12px}.prose{line-height:1.65}.prose ol{margin-top:0}.upload-panel{max-width:980px}
@media(max-width:1100px){.cards-4,.two-col,.three-col,.grid-form,.filters{grid-template-columns:1fr}.sidebar{position:static;width:auto}.main{margin-left:0;padding:18px}.topbar h1{font-size:24px}.student-hero{flex-direction:column;align-items:flex-start}}

/* Pembaruan keterbacaan laporan penurunan */
.report-filter-panel{position:sticky;top:0;z-index:1}
.report-filters{grid-template-columns:1fr 1fr 1.15fr 1.25fr .7fr .6fr .8fr;align-items:end}
.report-filters label{display:grid;gap:6px;font-weight:800;color:#42526b}
.report-filters label span{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#6c778b}
.report-filters .search-field input{font-weight:750;background:#fff;border-color:#cfd9ea}
.report-summary{grid-template-columns:repeat(4,1fr);margin-bottom:20px}
.report-table-wrap{border-radius:16px;border-color:#dfe7f3}
.report-table th{font-size:12px;background:#f3f6fb;color:#41516b;white-space:nowrap}
.report-table td{font-size:14px;line-height:1.35;padding:14px 13px}
.report-table .row-danger{background:#fff7f5}
.report-table .row-danger:hover{background:#ffefec}
.student-cell{min-width:230px}.student-cell strong{display:block;font-size:14px;text-transform:uppercase;margin-bottom:5px}.student-cell small{display:block;color:#6c778b}
.subject-cell{min-width:180px}.subject-cell strong{display:block;font-size:15px}.subject-cell small{display:block;color:#6c778b;margin-top:3px}
.period-cell{min-width:315px}.period-flow{display:flex;align-items:center;gap:10px}.period-flow div{border:1px solid #e4eaf3;background:#fff;border-radius:12px;padding:8px 10px;min-width:125px}.period-flow b,.period-flow span,.period-flow small{display:block}.period-flow b{font-size:11px;color:#6c778b;text-transform:uppercase;letter-spacing:.04em}.period-flow span{font-weight:850;color:#172033}.period-flow small{color:#6c778b}.period-flow em{font-style:normal;color:#d93025;font-weight:900}
.score-cell{min-width:135px}.score-flow{display:flex;align-items:center;gap:8px}.score-flow em{font-style:normal;color:#6c778b;font-weight:900}.score{display:inline-grid;place-items:center;min-width:42px;height:34px;border-radius:11px;font-weight:900;border:1px solid #dce5f1}.score.old{background:#fff;color:#172033}.score.now{background:#fff0ee;color:#b42318;border-color:#ffd3cc}
.delta-cell{min-width:110px}.teacher-cell{min-width:150px;color:#334155}.badge-danger{font-size:13px;padding:8px 11px}
@media(max-width:1300px){.report-filters{grid-template-columns:1fr 1fr}.report-summary{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.report-filters,.report-summary{grid-template-columns:1fr}.period-flow{align-items:stretch;flex-direction:column}.period-flow em{text-align:center}.student-cell,.period-cell,.subject-cell{min-width:220px}}

/* Dropdown siswa dan generator nilai RDM */
.student-filters{grid-template-columns:1fr 1fr 1.6fr .7fr;align-items:end}
.filters label{display:grid;gap:6px;font-weight:800;color:#42526b}
.filters label span{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#6c778b}
.form textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:14px;background:#fff;color:var(--text);resize:vertical;font-family:inherit}
.check-inline{display:flex!important;grid-template-columns:auto!important;align-items:center;gap:10px;font-weight:800;background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:12px}.check-inline input{width:auto!important}
.report-filters{grid-template-columns:1fr 1fr 1.15fr 1.7fr .7fr .6fr .8fr;align-items:end}
.report-filters select[name="student_id"], .student-filters select[name="student_id"]{font-weight:800;border-color:#c9d6ea;background:#fff}
@media(max-width:1300px){.student-filters{grid-template-columns:1fr 1fr}.report-filters{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.student-filters{grid-template-columns:1fr}}

/* Kontrol nilai proporsional */
.grade-control-filters{grid-template-columns:1fr 1fr 1.15fr 1.6fr .75fr .65fr;align-items:end}
.grade-action-grid{grid-template-columns:1.25fr .8fr 1.4fr .75fr;align-items:end;margin-bottom:14px}
.method-card{border-left:6px solid var(--primary)}
.control-table th{white-space:nowrap}.control-table td{vertical-align:top}.control-table input[type="checkbox"]{width:18px;height:18px}.safe-chain{display:flex;gap:8px;align-items:stretch;min-width:520px}.safe-chain div{background:#fff;border:1px solid #e4eaf3;border-radius:12px;padding:8px 10px;min-width:145px}.safe-chain b,.safe-chain span{display:block}.safe-chain b{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#6c778b}.safe-chain span{font-weight:900;color:#172033}.safe-chain em{display:grid;place-items:center;font-style:normal;color:#d93025;font-weight:900}.danger-text{color:#b42318!important}.control-table .badge-success{font-size:12px;padding:7px 10px}.control-table .badge-danger{font-size:12px;padding:7px 10px}
@media(max-width:1350px){.grade-control-filters,.grade-action-grid{grid-template-columns:1fr 1fr}.safe-chain{min-width:460px}}
@media(max-width:720px){.grade-control-filters,.grade-action-grid{grid-template-columns:1fr}.safe-chain{flex-direction:column;min-width:240px}.safe-chain em{text-align:center}}

/* Upload roster dan deteksi guru mapel */
.roster-note{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:12px;color:#42526b}
.roster-summary-table td:first-child{font-weight:800}

/* Penanda perbaikan nilai dan pengingat cetak ulang rapor */
.fix-marker-cell{min-width:230px;background:#fffdf7}
.marker-form{margin:0;display:block}
.check-marker{display:flex;gap:9px;align-items:flex-start;background:#fff;border:1px solid #e5edf8;border-radius:12px;padding:9px 10px;font-weight:850;color:#26354f;cursor:pointer;line-height:1.25}
.check-marker input{width:18px!important;height:18px!important;margin-top:1px;accent-color:#168a52}
.check-marker span{display:block;font-size:13px}
.fix-marker-cell small,.reprint-form+small{display:block;margin-top:7px;line-height:1.35}
.status-ok{color:#168a52;font-weight:800}.status-warn{color:#b7791f;font-weight:800}
.reprint-panel{border-left:6px solid var(--warning)}
.reprint-panel .table-wrap td{vertical-align:top}
.reprint-form{margin-top:8px}.reprint-form .check-marker{background:#fffaf0;border-color:#fde7bd}
@media(max-width:720px){.fix-marker-cell{min-width:220px}.check-marker{padding:8px}.reprint-panel .table-wrap{max-height:none}}
/* Penanda metode perbaikan: semester target dinaikkan vs semester sebelumnya diturunkan */
.fix-method-cell{min-width:310px;background:#fffdf7}
.fix-method-form{display:grid;gap:8px}
.method-marker{background:#ffffff;border-color:#dce7f7}
.method-marker:has(input:checked){background:#eefaf3;border-color:#76c99b;box-shadow:0 0 0 2px rgba(22,138,82,.08)}
.method-marker b{display:inline-block;margin-bottom:2px;color:#123f73}
.method-marker small{margin-top:2px!important;color:#6c778b;font-weight:700}
.status-info{color:#315070;font-weight:800}
.btn.tiny{font-size:12px;padding:7px 10px;border-radius:10px;width:max-content}
@media(max-width:720px){.fix-method-cell{min-width:260px}}
/* Update 7: deteksi risiko berantai jika Cara 2 menurunkan semester sebelumnya */
.status-danger{display:block;margin-top:7px;line-height:1.35;color:#b42318;font-weight:850}
.method-marker.method-disabled{background:#f8fafc;border-color:#e2e8f0;color:#8a94a6;cursor:not-allowed;opacity:.8}
.method-marker.method-disabled input{accent-color:#cbd5e1;cursor:not-allowed}
.method-marker.method-disabled b,.method-marker.method-disabled small{color:#8a94a6!important}
.control-table .row-unsafe-lower{outline:2px solid rgba(180,35,24,.12);outline-offset:-2px}
.alert.info{background:#e0f2fe;border:1px solid #7dd3fc;color:#075985;padding:12px 14px;border-radius:14px;margin:0 0 16px 0}.inline-reset{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.inline-reset input{min-width:140px;padding:8px 10px;border:1px solid #d1d5db;border-radius:10px}.badge-success{background:#dcfce7;color:#166534}.reprint-panel .big-note{font-size:1rem;line-height:1.7}.status-ok{color:#166534}.status-warn{color:#92400e}.status-danger{color:#991b1b}.status-info{color:#075985}

/* Update profesional: alur lebih sederhana, elegan, dan pusat download */
:root{
  --bg:#eef3f8; --panel:#ffffff; --text:#14213d; --muted:#68758a; --line:#dfe7f0;
  --primary:#1d4ed8; --primary2:#0f766e; --nav:#0f172a;
  --shadow:0 18px 45px rgba(15,23,42,.08); --radius:20px;
}
body{background:radial-gradient(circle at top left,#e0f2fe 0,#eef3f8 34%,#f8fafc 100%);font-size:15px;line-height:1.45}.sidebar{background:linear-gradient(180deg,#0b1220,#102042 72%,#11346f);box-shadow:10px 0 30px rgba(15,23,42,.18);overflow:auto}.sidebar nav a{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;font-size:14px}.sidebar nav a.active{background:#fff;color:#0f2453;box-shadow:0 8px 18px rgba(0,0,0,.13)}.main{max-width:1680px}.topbar{background:rgba(255,255,255,.72);border:1px solid rgba(223,231,240,.9);backdrop-filter:blur(10px);border-radius:24px;padding:20px 22px;box-shadow:var(--shadow)}.topbar h1{font-size:28px}.panel,.stat-card{box-shadow:var(--shadow);border-color:#edf2f7}.panel-head{align-items:center}.panel h2{letter-spacing:-.02em}.table-wrap{background:#fff}.table-wrap table tbody tr:hover{background:#f8fbff}.btn{transition:.18s transform,.18s box-shadow,.18s background}.btn:hover{transform:translateY(-1px);box-shadow:0 9px 18px rgba(15,23,42,.08)}.btn.primary{background:linear-gradient(135deg,#2563eb,#0f766e)}.stat-card strong{letter-spacing:-.06em}.stat-card.danger{border-color:#fecaca}.hero-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(135deg,#ffffff,#f7fbff);border:1px solid #dbeafe}.hero-panel h2{font-size:28px;margin:3px 0 7px}.hero-panel p{max-width:800px;margin:0}.eyebrow{display:inline-flex;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#1d4ed8;background:#eff6ff;border:1px solid #dbeafe;border-radius:999px;padding:5px 9px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.quick-flow,.quick-actions,.download-grid,.checklist-grid{display:grid;gap:14px}.quick-flow{grid-template-columns:repeat(5,1fr);margin:0 0 20px}.quick-actions{grid-template-columns:repeat(5,1fr)}.download-grid{grid-template-columns:repeat(3,1fr);margin-bottom:20px}.quick-card,.download-card{background:#fff;border:1px solid #e4edf7;border-radius:18px;padding:16px;text-decoration:none;box-shadow:0 10px 28px rgba(15,23,42,.06);transition:.18s transform,.18s box-shadow}.quick-card:hover,.download-card:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(15,23,42,.1)}.quick-card b,.download-card strong{display:block;font-size:16px;color:#132238}.quick-card span,.download-card p{display:block;color:#68758a;font-size:13px;margin:4px 0 0}.primary-card{background:linear-gradient(135deg,#1d4ed8,#0f766e);border-color:transparent;color:#fff}.primary-card b,.primary-card span{color:#fff}.download-card{display:flex;align-items:center;justify-content:space-between;gap:14px}.download-card p{max-width:420px}.download-filter{grid-template-columns:2fr .7fr .5fr;align-items:end}.checklist-grid{grid-template-columns:repeat(2,1fr)}.checklist-grid div{background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:12px;font-weight:800;color:#1e293b}.danger-text{color:#b42318!important}.table-wrap{max-height:70vh}.student-hero{background:linear-gradient(135deg,#0f172a,#1d4ed8 55%,#0f766e)}
@media(max-width:1300px){.quick-flow,.quick-actions{grid-template-columns:repeat(2,1fr)}.download-grid{grid-template-columns:1fr 1fr}.download-filter{grid-template-columns:1fr}}
@media(max-width:760px){.hero-panel{flex-direction:column;align-items:flex-start}.download-grid,.quick-flow,.quick-actions,.checklist-grid{grid-template-columns:1fr}.hero-actions{justify-content:flex-start}.main{padding:14px}.panel{padding:16px}.topbar{padding:16px}.download-card{align-items:flex-start;flex-direction:column}}

/* Update menu ringkas + kelola nilai RDM lebih sederhana */
.subnav{display:flex;gap:10px;flex-wrap:wrap;margin:-6px 0 18px;background:rgba(255,255,255,.72);border:1px solid #dfe7f0;border-radius:18px;padding:8px;box-shadow:0 10px 24px rgba(15,23,42,.06)}
.subnav a{padding:10px 14px;border-radius:12px;text-decoration:none;color:#334155;font-weight:850;background:#fff;border:1px solid #e2e8f0}
.subnav a.active{background:linear-gradient(135deg,#2563eb,#0f766e);color:#fff;border-color:transparent;box-shadow:0 8px 18px rgba(37,99,235,.18)}
.quick-flow-compact{grid-template-columns:repeat(4,1fr)}
.compact-actions{grid-template-columns:repeat(3,1fr)}
.simple-steps{display:grid;gap:12px;margin-bottom:16px}.simple-steps div{display:flex;gap:12px;align-items:flex-start;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:12px}.simple-steps b{width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:#dbeafe;color:#1d4ed8}.simple-steps span{font-weight:750;color:#334155}.grade-template-form label small{font-weight:650;color:#64748b}.result-actions .quick-card{min-height:110px}.action-stack{display:flex;gap:8px;flex-wrap:wrap}.edit-template-table input[type=number]{width:92px;border:1px solid #cbd5e1;border-radius:10px;padding:8px 10px;font-weight:900;text-align:center}.edit-score-cell{background:#f8fafc}.sticky-action{position:sticky;bottom:16px;z-index:3;display:flex;gap:10px;align-items:center;justify-content:flex-end;background:rgba(255,255,255,.92);backdrop-filter:blur(10px)}
@media(max-width:1200px){.quick-flow-compact,.compact-actions{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.quick-flow-compact,.compact-actions{grid-template-columns:1fr}.subnav{overflow:auto;flex-wrap:nowrap}.subnav a{white-space:nowrap}.sticky-action{position:static;justify-content:flex-start;flex-wrap:wrap}}

/* Update: Kelola Nilai RDM dibuat lebih sederhana sesuai dua alur upload */
.grade-workflow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 18px}.workflow-step{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:14px;display:flex;gap:12px;align-items:center;box-shadow:0 10px 24px rgba(15,23,42,.05)}.workflow-step b{width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:#e0f2fe;color:#075985;font-weight:950}.workflow-step span{font-weight:850;color:#334155;line-height:1.3}.workflow-step.active{border-color:#bfdbfe;background:linear-gradient(135deg,#eff6ff,#fff)}
.grade-template-page.two-col{grid-template-columns:1fr 1fr;align-items:start}.grade-upload-card{border-top:6px solid #2563eb}.grade-upload-card.semester-card{border-top-color:#0f766e}.grade-upload-card .panel-head p{max-width:720px}.grade-template-form.grid-form{grid-template-columns:1fr 1fr}.grade-template-form .file-drop,.grade-template-form .form-actions,.grade-template-form .kd-dynamic-box,.grade-template-form .logic-note{grid-column:1/-1}.kd-dynamic-box{border:1px dashed #bfdbfe;background:#f8fbff;border-radius:16px;padding:14px}.field-title{font-weight:950;color:#1e3a8a;margin-bottom:10px}.kd-fields{display:grid;grid-template-columns:1fr;gap:10px}.kd-field{background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:10px}.kd-field span{display:block;font-weight:900;color:#334155;margin-bottom:6px}.kd-field textarea{width:100%;resize:vertical;min-height:54px;border:1px solid #cbd5e1;border-radius:12px;padding:10px 12px;font:inherit}.logic-note{background:#ecfdf5;border:1px solid #bbf7d0;color:#14532d;border-radius:16px;padding:14px;line-height:1.55}.logic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.logic-grid div{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:14px}.logic-grid b{display:block;color:#0f2453;font-size:15px;margin-bottom:5px}.logic-grid span{display:block;color:#64748b;font-weight:700;line-height:1.45}.grade-upload-card .file-drop span{font-weight:750}.form-actions{display:flex;justify-content:flex-start;gap:10px}
@media(max-width:1200px){.grade-workflow,.logic-grid{grid-template-columns:1fr 1fr}.grade-template-page.two-col{grid-template-columns:1fr}.grade-template-form.grid-form{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.grade-workflow,.logic-grid,.grade-template-form.grid-form{grid-template-columns:1fr}.workflow-step{align-items:flex-start}}

/* Update: Pantau Nilai Acuan semester sebelumnya */
.monitor-filters{grid-template-columns:minmax(190px,1.05fr) minmax(130px,.75fr) minmax(190px,1fr) minmax(170px,.95fr) auto;align-items:end}
.reference-periods{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.period-chip{display:flex;flex-direction:column;gap:2px;text-decoration:none;border:1px solid #dbe7f5;background:#fff;border-radius:14px;padding:11px 15px;min-width:145px;box-shadow:0 8px 18px rgba(15,23,42,.05);transition:.18s transform,.18s box-shadow,.18s background}
.period-chip:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(15,23,42,.09)}
.period-chip b{color:#172033;font-size:14px}.period-chip span{color:#64748b;font-weight:800;font-size:13px}
.period-chip.active{background:linear-gradient(135deg,#2563eb,#0f766e);border-color:transparent}.period-chip.active b,.period-chip.active span{color:#fff}
.score-cell .score.now{display:inline-flex;align-items:center;justify-content:center;min-width:48px;padding:6px 10px;border-radius:12px;background:#eff6ff;color:#1d4ed8;font-weight:950}
@media(max-width:1100px){.monitor-filters{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.monitor-filters{grid-template-columns:1fr}.monitor-filters .btn{width:100%}.period-chip{width:100%}}

/* Update: akses guru, kelas aktif, dan prestasi akademik */
.rank-badge{display:inline-grid;place-items:center;min-width:34px;height:34px;border-radius:999px;background:#eef2ff;color:#3730a3;font-weight:950;border:1px solid #c7d2fe}
.table-wrap tr:nth-child(1) .rank-badge{background:#fef3c7;color:#92400e;border-color:#fcd34d}
.table-wrap tr:nth-child(2) .rank-badge{background:#f1f5f9;color:#334155;border-color:#cbd5e1}
.table-wrap tr:nth-child(3) .rank-badge{background:#ffedd5;color:#9a3412;border-color:#fdba74}

/* Update: kembalikan navigasi sidebar yang bisa dimunculkan/disembunyikan */
.sidebar-toggle,.sidebar-close,.sidebar-backdrop{display:none}
.sidebar{width:270px;min-height:100vh}
.main{margin-left:270px}
@media(max-width:1100px){
  body{overflow-x:hidden}
  .sidebar-toggle{display:inline-flex;position:fixed;top:14px;left:14px;width:46px;height:46px;border:0;border-radius:14px;background:#0f172a;color:#fff;z-index:1200;align-items:center;justify-content:center;flex-direction:column;gap:5px;box-shadow:0 12px 28px rgba(15,23,42,.28);cursor:pointer}
  .sidebar-toggle span{display:block;width:21px;height:2px;border-radius:999px;background:#fff}
  .sidebar-close{display:grid;position:absolute;top:14px;right:14px;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.12);color:#fff;font-size:27px;line-height:1;place-items:center;cursor:pointer}
  .sidebar{position:fixed!important;top:0;left:0;bottom:0;width:min(305px,86vw)!important;height:100vh;min-height:100vh;z-index:1100;transform:translateX(-110%);transition:transform .24s ease;overflow-y:auto;padding-top:22px;box-shadow:18px 0 42px rgba(15,23,42,.28)}
  body.sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.48);backdrop-filter:blur(2px);z-index:1050}
  body.sidebar-open .sidebar-backdrop{display:block}
  .main{margin-left:0!important;padding:76px 18px 22px;max-width:none}
  .topbar{padding:18px 18px;margin-bottom:18px}
  .topbar h1{font-size:24px;padding-left:48px}
  .topbar p{padding-left:48px}
  .brand{padding-right:44px}
  .sidebar nav{padding-top:8px}
}
@media(max-width:520px){
  .main{padding-left:12px;padding-right:12px}
  .topbar h1,.topbar p{padding-left:0;margin-left:48px}
  .sidebar-toggle{top:12px;left:12px}
  .table-wrap{max-height:68vh}
}

/* ==========================================================
   AUDIT UI 2026-06-14: layout lebih ringkas, dropdown opsi,
   responsif HP/tablet/desktop, dan Pantau Nilai jadi menu utama.
   ========================================================== */
:root{
  --radius:14px;
  --shadow:0 8px 22px rgba(15,23,42,.055);
  --shadow-soft:0 4px 14px rgba(15,23,42,.045);
}
body{background:linear-gradient(180deg,#eef6ff 0,#f7f9fc 260px,#f7f9fc 100%)}
.main{padding:20px 22px 26px;max-width:1640px}
.topbar{position:sticky;top:0;z-index:18;background:rgba(247,249,252,.88);backdrop-filter:blur(12px);border:1px solid rgba(226,232,240,.9);border-radius:18px;padding:14px 18px;margin-bottom:14px;box-shadow:0 8px 22px rgba(15,23,42,.04)}
.topbar h1{font-size:24px;line-height:1.18;margin-bottom:2px}.topbar p{font-size:13px;line-height:1.35}
.panel{padding:16px;margin-bottom:14px;border-radius:16px}.panel h2{font-size:17px;margin-bottom:8px}.panel p{margin-top:4px;margin-bottom:8px;line-height:1.45}.panel-head{align-items:center;margin-bottom:9px}.panel-head h2{font-size:17px}.panel-head p{font-size:13px}.hero-panel{padding:16px 18px;gap:14px}.hero-panel h2{font-size:22px;margin:4px 0}.eyebrow{font-size:11px;padding:4px 8px}.hero-actions{gap:8px}.btn{min-height:36px;padding:9px 12px;border-radius:10px;font-size:13px}.btn.small{min-height:29px;padding:7px 9px}.stat-card{padding:14px;border-radius:16px;gap:4px}.stat-card strong{font-size:28px}.stat-card span{font-size:13px}.stat-card small{font-size:11px}.grid{gap:12px}.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}.two-col{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr)}
.sidebar{width:248px;padding:18px 16px;gap:14px}.main{margin-left:248px}.brand{gap:10px}.brand-mark{width:40px;height:40px;border-radius:12px}.brand strong{font-size:16px}.brand span{font-size:11px}.sidebar nav{gap:5px}.sidebar nav a{padding:9px 11px;border-radius:10px;font-size:13px;line-height:1.25}.sidebar-footer{padding:11px;border-radius:12px;font-size:12px}.sidebar-footer strong{font-size:13px}
.form input,.form select,.filters input,.filters select,.form textarea{min-height:38px;padding:8px 10px;border-radius:10px;font-size:13px}.filters{gap:10px}.filters label span,.form label span{font-size:11px}.file-drop{padding:15px;border-radius:14px}.file-drop span{font-size:13px}.subnav{padding:5px;margin:0 0 12px;border-radius:14px;gap:6px}.subnav a{padding:8px 10px;border-radius:10px;font-size:13px}.table-wrap{max-height:62vh;border-radius:12px}th,td{padding:8px 10px;font-size:13px}th{font-size:11px}.badge,.pill{padding:5px 8px;font-size:11px}.alert{padding:11px 12px;border-radius:12px;font-size:13px}.student-hero{padding:18px;border-radius:18px}.student-hero h2{font-size:23px}.timeline{gap:8px}.timeline div,.list-row{padding:9px 10px;border-radius:12px}
.quick-flow,.quick-actions,.download-grid,.grade-workflow,.logic-grid{gap:10px}.quick-card,.download-card,.workflow-step{border-radius:14px;padding:12px;box-shadow:var(--shadow-soft)}.quick-card b,.download-card strong{font-size:14px}.quick-card span,.download-card p{font-size:12px;line-height:1.35}.quick-flow{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.quick-flow-compact,.quick-actions{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.download-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.grade-workflow{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.workflow-step b{width:28px;height:28px;font-size:13px}.workflow-step span{font-size:13px}.grade-template-page.two-col{gap:12px}.grade-template-form.grid-form{gap:10px}.kd-dynamic-box{padding:12px}.kd-field{padding:9px}.kd-field textarea{min-height:46px}.logic-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.report-filter-panel{position:relative;top:auto}.report-filters{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.report-summary{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.monitor-filters{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.reference-periods{gap:8px}.period-chip{min-width:128px;padding:9px 11px;border-radius:12px}.period-chip b{font-size:13px}.period-chip span{font-size:12px}.download-filter{grid-template-columns:minmax(240px,1fr) auto auto}.sticky-action{bottom:10px;border:1px solid var(--line);border-radius:14px;padding:10px}
.ux-module-picker{display:flex;align-items:end;gap:10px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);border-radius:16px;padding:12px;margin:0 0 12px}.ux-module-picker label{display:grid;gap:5px;flex:1;min-width:220px;font-weight:850;color:#42526b}.ux-module-picker label span{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#6c778b}.ux-module-picker select{width:100%;min-height:39px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff;font-weight:800;color:var(--text)}.ux-details{margin:0 0 14px}.ux-details>summary{cursor:pointer;list-style:none;display:inline-flex;gap:8px;align-items:center;background:#f8fafc;border:1px solid var(--line);color:#334155;padding:8px 11px;border-radius:999px;font-weight:850;font-size:12px;box-shadow:var(--shadow-soft)}.ux-details>summary::-webkit-details-marker{display:none}.ux-details>summary:after{content:'▾';font-size:12px;opacity:.8}.ux-details[open]>summary:after{content:'▴'}.ux-details .quick-flow,.ux-details .quick-actions,.ux-details .download-grid{margin-top:10px}.ux-subnav-select{display:none;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);border-radius:14px;padding:10px;margin:0 0 12px;gap:8px;align-items:center}.ux-subnav-select select{flex:1;border:1px solid var(--line);border-radius:10px;padding:9px 10px;background:#fff;font-weight:850}.ux-subnav-select .btn{white-space:nowrap}.mobile-only-hint{display:none;color:#64748b;font-size:12px}.section-tight{margin-bottom:10px}.collapse-ready[data-collapsed="true"]{display:none!important}
/* tables stay useful on phone without breaking layout */
@media(max-width:1100px){
  .sidebar{width:min(292px,86vw)!important}.main{padding:72px 14px 20px}.topbar{padding:13px 14px}.topbar h1{font-size:22px}.topbar p{font-size:12px}.cards-4,.three-col,.two-col,.grid-form,.filters{grid-template-columns:1fr}.ux-subnav-select{display:flex}.subnav{display:none}.panel{padding:14px}.hero-panel{align-items:flex-start;flex-direction:column}.hero-actions{justify-content:flex-start}.table-wrap{max-height:65vh}.download-filter{grid-template-columns:1fr}.ux-module-picker{align-items:stretch;flex-direction:column}.ux-module-picker label{min-width:0}.mobile-only-hint{display:block}
}
@media(max-width:720px){
  .main{padding-left:10px;padding-right:10px}.topbar h1,.topbar p{margin-left:46px;padding-left:0}.panel{padding:12px;border-radius:14px;margin-bottom:12px}.panel-head{align-items:flex-start;flex-direction:column}.panel-head .btn,.panel-head .pill{align-self:flex-start}.btn{width:auto;min-height:34px}.hero-actions .btn,.form-actions .btn{width:100%}.quick-card,.download-card{padding:11px}.stat-card strong{font-size:24px}.student-hero{padding:14px}.student-hero h2{font-size:20px}.period-flow{gap:6px}.score-flow{gap:5px}.edit-template-table input[type=number]{width:70px}.sticky-action{position:static;align-items:stretch;flex-direction:column}.sticky-action .btn{width:100%}th,td{padding:7px 8px;font-size:12px}.reference-periods{display:grid;grid-template-columns:1fr}.period-chip{width:100%}.ux-details>summary{width:100%;justify-content:center}
}
@media(min-width:1500px){.main{padding-right:34px}.topbar{max-width:100%}}

/* Update: semester acuan di Pantau Nilai dibuat dropdown agar hemat layar HP */
.compact-empty{margin-top:10px;padding:10px 12px;border-radius:12px;background:#f8fafc;border:1px dashed #cbd5e1;color:#64748b;font-weight:700}.monitor-filters label small{line-height:1.35}.monitor-filters select{min-height:42px}
@media(max-width:760px){.monitor-filters label small{font-size:11px}.monitor-filters{gap:8px}.monitor-filters label{gap:5px}}

/* ==========================================================
   PRAKTIS UI 2026-06-15: audit praktis seluruh aplikasi.
   Fokus: hemat area layar, alur pendek, konteks kerja reusable,
   dropdown/compact panels, dan responsif semua perangkat.
   ========================================================== */
.main{padding-top:16px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.topbar h1{font-size:22px}.topbar p{max-width:760px}.compact-hero{padding:14px 16px}.compact-hero h2{font-size:21px}.compact-hero p{max-width:900px}.context-panel{border-color:#cfe0ff;background:linear-gradient(135deg,#ffffff,#f7fbff)}.compact-context-form{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) auto;gap:10px;align-items:end}.compact-context-form label{margin:0}.compact-context-form label span,.inline-fields label span{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#64748b}.compact-context-form small{font-weight:600;color:#64748b}.compact-flow{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:12px}.compact-flow .workflow-step{padding:10px 12px;min-height:auto}.practical-grade-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.compact-upload-form{gap:10px}.inline-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.inline-kd{grid-column:1/-1;border:1px solid var(--line);border-radius:14px;background:#f8fbff;overflow:hidden}.inline-kd>summary{cursor:pointer;padding:10px 12px;font-weight:900;color:#172033;list-style:none}.inline-kd>summary::-webkit-details-marker{display:none}.inline-kd>summary:after{content:'▾';float:right;color:#64748b}.inline-kd[open]>summary:after{content:'▴'}.inline-kd .kd-dynamic-box{border:0;border-top:1px solid var(--line);border-radius:0;background:#fff;padding:10px}.inline-kd .kd-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.inline-kd .kd-field{padding:8px;border-radius:10px}.inline-kd textarea{min-height:40px;resize:vertical}.compact-file-drop{padding:14px}.compact-file-drop span{font-size:12px}.compact-note{grid-column:1/-1;padding:12px;border-radius:12px;background:#eef6ff;border:1px solid #d6e8ff;color:#25405f}.compact-history table td,.compact-history table th{white-space:normal}.compact-history table td:first-child{white-space:nowrap}.compact-result{padding:14px}.logic-panel{box-shadow:none;margin:10px 0 0}.action-stack{display:flex;gap:6px;flex-wrap:wrap}.panel .panel-head .pill{white-space:nowrap}.form.grid-form{gap:10px}.upload-panel{max-width:none}.quick-flow,.quick-actions,.download-grid{margin-top:0}.quick-card,.download-card{min-height:auto}.sidebar nav a{display:flex;align-items:center}.sidebar nav a.active{box-shadow:inset 3px 0 0 rgba(255,255,255,.75)}
/* Kurangi scroll: form panjang dibuat padat dan elemen bantuan tidak mendominasi layar */
.hint,.logic-note,.compact-empty{font-size:12px;line-height:1.35}.file-drop{min-height:82px;display:grid;align-content:center}.filters.compact,.compact-filters{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));align-items:end}.table-wrap{overscroll-behavior:contain}.panel.tight-panel{padding:12px}.hero-panel .hero-actions{flex-wrap:wrap}.subnav a{white-space:nowrap}.ux-details:not([open]){margin-bottom:10px}.ux-details[open]{margin-bottom:10px}.ux-details>summary{user-select:none}
@media(max-width:1100px){.topbar{display:block}.compact-context-form{grid-template-columns:1fr}.compact-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.practical-grade-page{grid-template-columns:1fr}.inline-fields{grid-template-columns:1fr 1fr}.main{padding-top:72px}.panel-head{gap:6px}.topbar h1{padding-left:48px}.topbar p{padding-left:48px}}
@media(max-width:720px){.topbar{padding:12px}.topbar h1{font-size:20px;margin-left:44px;padding-left:0}.topbar p{font-size:12px;margin-left:44px;padding-left:0}.compact-hero h2{font-size:18px}.compact-flow{display:none}.compact-context-form{gap:8px}.inline-fields{grid-template-columns:1fr}.inline-kd .kd-fields{grid-template-columns:1fr}.context-panel .panel-head{display:block}.context-panel .pill{margin-top:6px}.file-drop{min-height:70px;padding:10px}.quick-card span,.download-card p{display:block}.compact-history .table-wrap{max-height:55vh}.btn{font-size:12px}.panel p{font-size:12px}.sidebar-footer{position:static}.upload-panel .panel-head h2{font-size:16px}.practical-grade-page{gap:10px}.compact-note{font-size:12px}.action-stack{flex-direction:column}.action-stack .btn{width:100%}}
@media(max-width:480px){.main{padding-left:8px;padding-right:8px}.panel{padding:10px}.compact-context-form select,.compact-context-form input,.compact-upload-form input,.compact-upload-form select{font-size:12px}.inline-kd>summary{font-size:13px}.kd-field span{font-size:12px}.table-wrap{border-radius:10px}th,td{padding:6px 7px}}