:root {
    --utama: #1d4ed8;
    --utama-gelap: #1e3a8a;
    --aksen: #0ea5e9;
    --latar: #f4f7fb;
    --permukaan: #ffffff;
    --teks: #172033;
    --redup: #64748b;
    --garis: #dbe3ef;
    --sukses: #15803d;
    --bahaya: #b91c1c;
    --peringatan: #a16207;
    --radius: 16px;
    --bayangan: 0 14px 38px rgba(15, 37, 87, .09);
}

* { box-sizing: border-box; }
html { color-scheme: light; }
body {
    margin: 0;
    background: var(--latar);
    color: var(--teks);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.55;
}
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }

.layar-publik {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(300px, 42%) 1fr;
}
.panel-merek {
    position: relative;
    overflow: hidden;
    padding: clamp(32px, 7vw, 88px);
    color: #fff;
    background: linear-gradient(145deg, #0f2557, #112f6e 56%, #0b1f49);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.panel-merek::before,
.panel-merek::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,.08);
}
.panel-merek::before { width: 340px; height: 340px; right: -140px; top: -110px; }
.panel-merek::after { width: 220px; height: 220px; left: -100px; bottom: -80px; }
.logo-teks {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    position: relative;
    z-index: 1;
}
.logo-lambang {
    width: 46px; height: 46px;
    border-radius: 14px;
    display: grid; place-items: center;
    font-weight: 800;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
}
.panel-merek h1 {
    margin: 28px 0 12px;
    max-width: 620px;
    font-size: clamp(32px, 5vw, 64px);
    line-height: 1.05;
    letter-spacing: -.04em;
}
.panel-merek p { max-width: 620px; color: rgba(255,255,255,.78); font-size: 17px; }
.label-versi {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: fit-content;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    font-size: 12px;
}
.panel-formulir {
    padding: clamp(24px, 6vw, 76px);
    display: grid;
    place-items: center;
}
.kartu-formulir { width: min(100%, 720px); }
.kartu-formulir.kecil { width: min(100%, 460px); }
.judul-halaman h2 { margin: 0; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.03em; }
.judul-halaman p { margin: 8px 0 28px; color: var(--redup); }
.bagian-formulir {
    background: var(--permukaan);
    border: 1px solid var(--garis);
    border-radius: var(--radius);
    box-shadow: var(--bayangan);
    padding: 24px;
    margin-bottom: 18px;
}
.bagian-formulir h3 { margin: 0 0 18px; font-size: 17px; }
.grid-formulir {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.grup { display: grid; gap: 7px; }
.grup.penuh { grid-column: 1 / -1; }
.grup label { font-weight: 650; font-size: 13px; }
.grup input, .grup textarea, .grup select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
    color: var(--teks);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.grup textarea { min-height: 88px; resize: vertical; }
.grup input:focus, .grup textarea:focus, .grup select:focus {
    border-color: var(--utama);
    box-shadow: 0 0 0 3px rgba(29,78,216,.12);
}
.petunjuk { color: var(--redup); font-size: 12px; }
.galat-input { color: var(--bahaya); font-size: 12px; }
.tombol {
    min-height: 44px;
    border: 0;
    border-radius: 10px;
    padding: 10px 17px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
}
.tombol-utama { color: #fff; background: linear-gradient(135deg, var(--utama), var(--aksen)); }
.tombol-utama:hover { filter: brightness(.96); }
.tombol-penuh { width: 100%; }
.notifikasi {
    border-radius: 12px;
    padding: 13px 15px;
    margin-bottom: 18px;
    border: 1px solid;
}
.notifikasi-galat { color: #7f1d1d; border-color: #fecaca; background: #fef2f2; }
.notifikasi-sukses { color: #14532d; border-color: #bbf7d0; background: #f0fdf4; }
.daftar-syarat {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 9px;
}
.daftar-syarat li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}
.status-bulat {
    width: 18px; height: 18px;
    border-radius: 50%;
    display: grid; place-items: center;
    font-size: 11px; color: #fff;
}
.status-ok { background: var(--sukses); }
.status-gagal { background: var(--bahaya); }

.kerangka {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
}
.sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 22px 16px;
    color: #fff;
    background: linear-gradient(180deg, #0f2557, #112f6e 55%, #0b1f49);
}
.sidebar .logo-teks { padding: 0 8px 24px; }
.menu-label {
    padding: 18px 12px 8px;
    color: rgba(255,255,255,.48);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .14em;
}
.menu {
    display: grid;
    gap: 5px;
}
.menu a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 11px;
    text-decoration: none;
    color: rgba(255,255,255,.76);
}
.menu a:hover, .menu a.aktif {
    color: #fff;
    background: rgba(14,165,233,.20);
}
.area-utama { min-width: 0; }
.topbar {
    min-height: 72px;
    background: #fff;
    border-bottom: 1px solid var(--garis);
    padding: 12px clamp(18px, 4vw, 38px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.identitas-pengguna { display: flex; align-items: center; gap: 10px; }
.avatar {
    width: 40px; height: 40px;
    border-radius: 13px;
    background: #dbeafe;
    color: var(--utama-gelap);
    display: grid; place-items: center;
    font-weight: 800;
}
.identitas-pengguna strong, .identitas-pengguna small { display: block; }
.identitas-pengguna small { color: var(--redup); }
.tombol-keluar {
    border: 1px solid var(--garis);
    background: #fff;
    min-height: 38px;
    border-radius: 10px;
    padding: 7px 12px;
}
.konten { padding: clamp(20px, 4vw, 38px); }
.kepala-konten {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}
.kepala-konten h1 { margin: 0; font-size: clamp(26px, 4vw, 38px); letter-spacing: -.035em; }
.kepala-konten p { margin: 6px 0 0; color: var(--redup); }
.pill {
    display: inline-flex;
    padding: 7px 11px;
    border: 1px solid var(--garis);
    border-radius: 999px;
    background: #fff;
    color: var(--redup);
    font-size: 12px;
}
.grid-kpi {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}
.kartu {
    background: #fff;
    border: 1px solid var(--garis);
    border-radius: var(--radius);
    box-shadow: 0 8px 24px rgba(15,37,87,.05);
}
.kpi { padding: 20px; }
.kpi .angka { font-size: 32px; font-weight: 800; letter-spacing: -.04em; }
.kpi .nama { color: var(--redup); font-size: 13px; }
.grid-dashboard {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: 20px;
}
.kartu-isi { padding: 22px; }
.kartu-isi h2 { margin: 0 0 16px; font-size: 18px; }
.daftar-tahap { display: grid; gap: 12px; }
.tahap {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 13px;
    border: 1px solid var(--garis);
    border-radius: 12px;
}
.nomor-tahap {
    flex: 0 0 30px;
    width: 30px; height: 30px;
    border-radius: 10px;
    display: grid; place-items: center;
    background: #dbeafe;
    color: var(--utama-gelap);
    font-weight: 800;
}
.tahap strong { display: block; }
.tahap small { color: var(--redup); }
.tabel-responsif { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--garis); text-align: left; vertical-align: top; }
th { color: var(--redup); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.keadaan-kosong { padding: 30px; text-align: center; color: var(--redup); }
.hanya-mobile { display: none; }

@media (max-width: 980px) {
    .layar-publik { grid-template-columns: 1fr; }
    .panel-merek { min-height: 320px; }
    .kerangka { grid-template-columns: 1fr; }
    .sidebar {
        position: fixed;
        z-index: 20;
        width: 270px;
        transform: translateX(-100%);
        transition: transform .2s;
    }
    body.menu-terbuka .sidebar { transform: translateX(0); }
    .hanya-mobile { display: inline-flex; }
    .grid-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-dashboard { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .grid-formulir, .grid-kpi { grid-template-columns: 1fr; }
    .panel-formulir { padding: 18px; align-items: start; }
    .bagian-formulir { padding: 18px; }
    .topbar { padding: 10px 16px; }
    .konten { padding: 18px; }
    .kepala-konten { align-items: flex-start; flex-direction: column; }
    .identitas-pengguna .teks-identitas { display: none; }
}

/* Komponen Data Induk v0.2 */
.topbar-kiri,.topbar-kanan,.judul-dengan-aksi,.aksi-baris,.aksi-formulir,.baris-filter{display:flex;align-items:center;gap:12px}
.topbar-kanan{margin-left:auto}.nama-halaman-topbar{display:block}.teks-redup{display:block;color:var(--redup);font-size:12px}.teks-bahaya{color:var(--bahaya)!important}
.versi-sidebar{position:absolute;left:20px;right:20px;bottom:16px;color:rgba(255,255,255,.45);font-size:11px;text-align:center}.sidebar{padding-bottom:56px;overflow-y:auto}.menu a{gap:10px}.menu a>span:first-child{width:20px;text-align:center}.menu-badge{margin-left:auto;padding:2px 6px;border-radius:999px;background:rgba(255,255,255,.12);font-size:9px}
.tombol-sekunder{color:var(--teks);background:#fff;border:1px solid var(--garis)}.tombol-sekunder:hover{background:#f8fafc}.aksi-formulir{margin-top:22px;flex-wrap:wrap}.jarak-atas{margin-top:20px}.jarak-atas-kecil{margin-top:14px}
.grid-dua{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.grid-data-form{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:20px}.grid-ringkasan-enam{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:18px}.ringkasan-mini{padding:16px;text-decoration:none;transition:.16s transform,.16s border-color}.ringkasan-mini:hover{transform:translateY(-2px);border-color:#93c5fd}.ringkasan-mini.aktif{border-color:var(--utama);box-shadow:0 0 0 2px rgba(29,78,216,.08)}.ringkasan-mini strong{display:block;font-size:25px}.ringkasan-mini span{display:block;color:var(--redup);font-size:11px;line-height:1.25;margin-top:4px}
.tab-scroll{display:flex;gap:7px;overflow-x:auto;padding-bottom:8px;margin-bottom:12px}.tab-item{white-space:nowrap;text-decoration:none;padding:9px 13px;border:1px solid var(--garis);background:#fff;border-radius:10px;color:var(--redup);font-size:12px;font-weight:700}.tab-item.aktif{color:#fff;border-color:var(--utama);background:var(--utama)}
.baris-filter{align-items:end;display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(150px,.7fr));gap:12px;margin-bottom:20px;padding:15px;background:#f8fafc;border:1px solid var(--garis);border-radius:12px}.baris-filter .grup-aksi{align-self:end}.baris-filter .grup-aksi .tombol{width:100%}
.judul-kartu,.judul-dengan-aksi{justify-content:space-between}.judul-kartu h2,.judul-dengan-aksi h2{margin:0}.judul-dengan-aksi p{margin:4px 0 0}.angka-progres{font-size:28px;color:var(--utama)}
.badge{display:inline-flex;align-items:center;width:fit-content;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;text-decoration:none;margin:2px 3px 2px 0}.badge-sukses{color:#166534;background:#dcfce7}.badge-netral{color:#475569;background:#e2e8f0}.badge-bahaya{color:#991b1b;background:#fee2e2}.badge-info{color:#1e40af;background:#dbeafe}
.aksi-baris{align-items:flex-start;flex-wrap:wrap}.aksi-baris form{margin:0}.tautan-aksi{appearance:none;border:0;background:transparent;color:var(--utama);font:inherit;font-weight:700;font-size:12px;padding:0;text-decoration:none;cursor:pointer}.tautan-aksi:hover{text-decoration:underline}
td small.teks-redup{margin-top:3px}.pilihan-kartu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pilihan-item{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--garis);border-radius:11px;background:#fff;cursor:pointer}.pilihan-item:hover{border-color:#93c5fd}.pilihan-item input{width:17px;height:17px;margin-top:2px}.pilihan-item span{min-width:0}.pilihan-item strong,.pilihan-item small{display:block}.pilihan-item small{color:var(--redup);font-size:11px}.daftar-pilih-siswa{display:grid;gap:8px;max-height:480px;overflow:auto;margin-top:15px;padding-right:4px}
.paginasi{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}.paginasi a{min-width:36px;height:36px;display:grid;place-items:center;text-decoration:none;border:1px solid var(--garis);border-radius:9px;background:#fff;color:var(--redup);font-size:12px;font-weight:700}.paginasi a.aktif{color:#fff;background:var(--utama);border-color:var(--utama)}
.batang-progres{height:10px;border-radius:999px;background:#e2e8f0;overflow:hidden}.batang-progres span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--utama),var(--aksen))}.tahap-tautan{text-decoration:none;color:inherit}.tahap-tautan:hover{border-color:#93c5fd;background:#f8fbff}.nomor-tahap.selesai{color:#fff;background:var(--sukses)}
.grid-kpi-enam{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-kpi-dua{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:16px}.grid-kpi-dua .kpi{border:1px solid var(--garis);border-radius:12px}.daftar-sederhana{margin:0;padding-left:18px}.daftar-sederhana li{margin:6px 0}.daftar-sederhana code{font-size:12px;color:#334155}
.kartu-isi>h2:first-child{margin-top:0}.kartu-isi p.teks-redup{font-size:13px}.grup input[type="checkbox"]{min-height:auto}.tabel-responsif table{min-width:720px}

@media (max-width:1200px){.grid-kpi-enam{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-ringkasan-enam{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-data-form{grid-template-columns:1fr}.baris-filter{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.grid-dua,.pilihan-kartu{grid-template-columns:1fr}.grid-kpi-enam,.grid-ringkasan-enam{grid-template-columns:repeat(2,minmax(0,1fr))}.baris-filter{grid-template-columns:1fr}.topbar-kanan .identitas-pengguna{display:none}.topbar{gap:8px}.nama-halaman-topbar{font-size:13px}.aksi-formulir{align-items:stretch}.aksi-formulir .tombol{width:100%}}
@media (max-width:420px){.grid-kpi-enam,.grid-ringkasan-enam{grid-template-columns:1fr 1fr}.ringkasan-mini{padding:12px}.ringkasan-mini strong{font-size:21px}}
.grid-peran-izin{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px}.daftar-peran{align-self:start;position:sticky;top:92px}.peran-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;margin-bottom:7px;border:1px solid var(--garis);border-radius:11px;text-decoration:none}.peran-item:hover,.peran-item.aktif{border-color:#93c5fd;background:#eff6ff}.peran-item strong,.peran-item small{display:block}.peran-item small{color:var(--redup);font-size:10px}.kelompok-izin{display:grid;gap:22px;margin-top:20px}.kelompok-izin section{padding-top:4px}.judul-kelompok-izin{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.judul-kelompok-izin h3{margin:0;font-size:15px}
@media(max-width:900px){.grid-peran-izin{grid-template-columns:1fr}.daftar-peran{position:static}}

/* Fondasi 3 — Kelas Pembelajaran dan Operasional Akademik */
.notifikasi-info{color:#1e3a8a;border-color:#bfdbfe;background:#eff6ff}.tombol-bahaya{color:#fff;background:var(--bahaya)}
.grid-kpi-delapan{grid-template-columns:repeat(8,minmax(0,1fr))}.grid-kpi-delapan .angka{font-size:27px}
.grid-kelas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.kartu-kelas{overflow:hidden}.sampul-kelas{min-height:118px;padding:20px;color:#fff;background:linear-gradient(135deg,#0f2557,#1d4ed8 65%,#0ea5e9);display:flex;align-items:center;gap:14px}.sampul-kelas>span{width:48px;height:48px;border:1px solid rgba(255,255,255,.28);border-radius:14px;display:grid;place-items:center;font-weight:900;background:rgba(255,255,255,.12)}.sampul-kelas small,.sampul-kelas strong{display:block}.sampul-kelas small{color:rgba(255,255,255,.7);font-size:11px}.sampul-kelas strong{font-size:17px}.kartu-kelas-isi{padding:18px}.kartu-kelas h2{font-size:17px;margin:0}.statistik-kelas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}.statistik-kelas span{padding:9px;border-radius:9px;background:#f8fafc;color:var(--redup);font-size:11px}.statistik-kelas strong{color:var(--teks);font-size:15px;margin-right:3px}
.kepala-workspace{align-items:center}.tab-workspace{display:flex;gap:8px;overflow:auto;margin:-4px 0 22px;padding-bottom:5px}.tab-workspace a{white-space:nowrap;text-decoration:none;padding:10px 14px;border:1px solid var(--garis);border-radius:10px;background:#fff;color:var(--redup);font-size:12px;font-weight:800}.tab-workspace a:hover,.tab-workspace a.aktif{color:#fff;background:var(--utama);border-color:var(--utama)}
.daftar-agenda,.daftar-orang{display:grid;gap:10px}.agenda-item,.orang-item{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--garis);border-radius:12px;background:#fff}.agenda-item strong,.agenda-item small,.orang-item strong,.orang-item small{display:block}.agenda-item small,.orang-item small{color:var(--redup);font-size:11px}.agenda-hari{width:70px;flex:0 0 70px;padding:8px;border-radius:9px;background:#eff6ff;color:var(--utama-gelap);font-size:11px;font-weight:900;text-align:center}.agenda-tautan{text-decoration:none}.agenda-tautan:hover{border-color:#93c5fd;background:#f8fbff}.tanggal-agenda{width:48px;height:48px;flex:0 0 48px;border-radius:12px;background:#eff6ff;display:grid;place-items:center;align-content:center;color:var(--utama-gelap)}.tanggal-agenda strong,.tanggal-agenda small{line-height:1}.tanggal-agenda strong{font-size:18px}.tanggal-agenda small{text-transform:uppercase;font-size:9px;margin-top:3px}.avatar.mini{width:38px;height:38px;border-radius:11px}.vertikal{align-content:start}
.select-mini,.aksi-baris select{min-height:34px;border:1px solid var(--garis);border-radius:8px;background:#fff;padding:5px 8px;font-size:11px}.baris-filter-lima{grid-template-columns:minmax(200px,1.2fr) repeat(3,minmax(135px,.7fr)) minmax(120px,.5fr)}
.jadwal-mingguan{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.kolom-hari{display:grid;align-content:start;gap:10px}.kolom-hari h2{font-size:16px;margin:0 0 2px}.slot-jadwal{display:flex;gap:12px;padding:14px;border:1px solid var(--garis);border-radius:12px;background:#f8fafc}.waktu-slot{width:54px;flex:0 0 54px;text-align:center;padding-right:10px;border-right:1px solid var(--garis)}.waktu-slot strong,.waktu-slot small,.isi-slot strong,.isi-slot span,.isi-slot small{display:block}.waktu-slot strong{color:var(--utama);font-size:14px}.waktu-slot small,.isi-slot small{color:var(--redup);font-size:10px}.isi-slot{min-width:0}.isi-slot span{font-size:12px;margin:2px 0}.isi-slot strong{font-size:13px}
.linimasa-kalender{display:grid;gap:14px}.item-kalender{display:grid;grid-template-columns:92px minmax(0,1fr);gap:18px;padding:16px;border:1px solid var(--garis);border-radius:13px}.tanggal-kalender{display:grid;align-content:center;text-align:center;padding:12px;border-radius:11px;background:#eff6ff;color:var(--utama-gelap)}.tanggal-kalender strong{font-size:28px;line-height:1}.tanggal-kalender small{font-size:10px;text-transform:uppercase;margin-top:5px}.isi-kalender h2{font-size:18px;margin:5px 0}.isi-kalender p{margin:6px 0;color:var(--redup);font-size:13px}
fieldset{border:0;padding:0;margin:0;min-width:0}fieldset:disabled{opacity:.78}fieldset:disabled input,fieldset:disabled textarea,fieldset:disabled select{background:#f1f5f9}.tabel-responsif td form{margin:0}
@media(max-width:1350px){.grid-kpi-delapan{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-kelas{grid-template-columns:repeat(2,minmax(0,1fr))}.jadwal-mingguan{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.grid-kelas,.jadwal-mingguan{grid-template-columns:1fr}.baris-filter-lima{grid-template-columns:repeat(2,minmax(0,1fr))}.item-kalender{grid-template-columns:70px minmax(0,1fr)}}
@media(max-width:620px){.grid-kpi-delapan{grid-template-columns:repeat(2,minmax(0,1fr))}.baris-filter-lima{grid-template-columns:1fr}.tab-workspace{margin-left:-4px;margin-right:-4px}.item-kalender{grid-template-columns:1fr}.tanggal-kalender{display:flex;gap:6px;justify-content:flex-start;align-items:baseline}.tanggal-kalender strong{font-size:20px}}

/* Fondasi 4 — Konten Pembelajaran dan Progres */
.kartu-form{padding:24px}.grid-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.grid-form label{display:grid;align-content:start;gap:7px}.grid-form label>span,.bagian-form>h3,.form-unggah-ringkas label>span{font-size:12px;font-weight:800}.grid-form .span-2{grid-column:span 2}.cek-baris{display:flex!important;align-items:center!important;grid-auto-flow:column;justify-content:start;align-content:center!important;gap:9px!important;padding-top:26px}.cek-baris input{width:18px;height:18px;min-height:auto}.aksi-form{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.bagian-form{margin-top:22px;padding-top:20px;border-top:1px solid var(--garis)}.bagian-form h3{margin:0 0 5px;font-size:16px}.daftar-centang{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px;max-height:340px;overflow:auto}.daftar-centang label{display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--garis);border-radius:10px}.daftar-centang input{width:17px;height:17px;min-height:auto;margin-top:2px}.daftar-centang strong,.daftar-centang small{display:block}.daftar-centang small{color:var(--redup);font-size:10px}.tombol-kecil{padding:7px 10px;font-size:11px;min-height:32px}
.ruang-konten-utama{display:grid;gap:18px}.ruang-konten-samping{display:grid;align-content:start;gap:18px}.modul-kartu{overflow:hidden}.modul-kartu>.judul-dengan-aksi{padding-bottom:14px;border-bottom:1px solid var(--garis)}.keadaan-kosong.ringkas{padding:18px}.daftar-materi{display:grid;margin-top:8px}.materi-item{display:flex;align-items:center;gap:13px;padding:14px 4px;border-bottom:1px solid var(--garis)}.materi-item:last-child{border-bottom:0}.materi-terkunci{opacity:.72}.nomor-materi{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;border-radius:10px;background:#eff6ff;color:var(--utama);font-weight:900}.materi-info{min-width:0;flex:1}.baris-judul-materi{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.materi-info small{display:block;color:var(--redup);margin-top:3px}.aksi-materi{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.progress-ringkas{height:8px;margin-top:10px;background:#e2e8f0;border-radius:999px;overflow:hidden}.progress-ringkas span{display:block;height:100%;background:linear-gradient(90deg,var(--utama),var(--aksen));border-radius:inherit}.progress-ringkas.kecil{height:6px;max-width:230px}.progress-dengan-angka{display:flex;align-items:center;gap:10px}.progress-dengan-angka .progress-ringkas{flex:1;min-width:100px;margin:0}.badge-peringatan{color:#92400e;background:#fef3c7}.daftar-pengumuman-ringkas{display:grid;gap:10px}.pengumuman-ringkas{display:grid;gap:3px;padding:11px;border-left:3px solid #cbd5e1;background:#f8fafc;border-radius:0 10px 10px 0}.pengumuman-ringkas.penting{border-left-color:#f59e0b;background:#fffbeb}.pengumuman-ringkas small,.pengumuman-ringkas span{color:var(--redup);font-size:10px}.pengumuman-ringkas strong{font-size:12px}
.meta-materi{display:flex;gap:5px;flex-wrap:wrap}.ringkasan-materi{padding:16px;border-radius:12px;background:#eff6ff;color:#1e3a8a;font-weight:600}.isi-materi{font-size:15px;line-height:1.75;white-space:normal;overflow-wrap:anywhere}.kartu-tautan-eksternal{display:flex;align-items:center;gap:13px;margin-top:24px;padding:16px;border:1px solid #bfdbfe;border-radius:13px;background:#eff6ff;text-decoration:none}.kartu-tautan-eksternal>span{font-size:24px;color:var(--utama)}.kartu-tautan-eksternal strong,.kartu-tautan-eksternal small{display:block}.kartu-tautan-eksternal small{color:var(--redup);overflow-wrap:anywhere}.daftar-lampiran{display:grid;gap:9px}.lampiran-item{display:flex;align-items:center;gap:7px;padding:10px;border:1px solid var(--garis);border-radius:10px}.lampiran-item>div{min-width:0;flex:1}.lampiran-item strong,.lampiran-item small{display:block}.lampiran-item strong{font-size:12px;overflow-wrap:anywhere}.lampiran-item small{color:var(--redup);font-size:10px}.lampiran-item form{margin:0}.form-unggah-ringkas{display:grid;gap:10px;margin-top:18px;padding-top:18px;border-top:1px solid var(--garis)}.form-unggah-ringkas label{display:grid;gap:6px}.pusat-aksi-progres{display:flex;align-items:center;justify-content:space-between;gap:20px}.pusat-aksi-progres h2{margin-bottom:4px}
.daftar-pengumuman-besar{display:grid;gap:16px}.pengumuman-besar{border-left:4px solid #cbd5e1}.pengumuman-besar.penting{border-left-color:#f59e0b}.isi-pengumuman{margin-top:16px;line-height:1.65}.meta-jadwal{margin-top:15px;padding-top:12px;border-top:1px solid var(--garis);color:var(--redup);font-size:11px}.form-inline{display:flex;align-items:center;gap:7px}.form-inline select{min-width:150px;min-height:34px}
@media(max-width:900px){.daftar-centang{grid-template-columns:1fr}.materi-item{align-items:flex-start;flex-wrap:wrap}.aksi-materi{width:100%;justify-content:flex-start;padding-left:45px}.pusat-aksi-progres{align-items:flex-start;flex-direction:column}.pusat-aksi-progres form,.pusat-aksi-progres .tombol{width:100%}}
@media(max-width:620px){.grid-form{grid-template-columns:1fr}.grid-form .span-2{grid-column:span 1}.cek-baris{padding-top:4px}.kartu-form{padding:18px}.materi-item{padding:13px 0}.aksi-materi{padding-left:0}.lampiran-item{align-items:flex-start;flex-wrap:wrap}.lampiran-item>div{flex-basis:100%}.form-inline{align-items:stretch;flex-direction:column}.form-inline select,.form-inline .tombol{width:100%}}
.kartu-lanjut-belajar{display:flex;align-items:center;gap:16px;padding:18px;border:1px solid #bfdbfe;border-radius:14px;background:linear-gradient(135deg,#eff6ff,#f8fbff);text-decoration:none}.kartu-lanjut-belajar .ikon-lanjut{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:14px;background:var(--utama);color:#fff}.kartu-lanjut-belajar>div{min-width:0;flex:1}.kartu-lanjut-belajar strong,.kartu-lanjut-belajar small{display:block}.kartu-lanjut-belajar small{color:var(--redup);font-size:11px}.kartu-lanjut-belajar strong{margin-top:4px;font-size:16px}.daftar-pengumuman-ringkas a{text-decoration:none;color:inherit}.daftar-pengumuman-ringkas a:hover{border-left-color:var(--utama);background:#eff6ff}

/* Fondasi 5 — tugas, pengumpulan, rubrik, dan penilaian */
.grid-kartu-tugas{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px;margin-top:18px}.tugas-kartu{display:flex;flex-direction:column;gap:14px}.tugas-kartu h2{margin:.55rem 0 .2rem}.meta-tugas{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.82rem;color:var(--muted,#64748b)}.meta-tugas.besar{margin-top:18px;padding-top:14px;border-top:1px solid #e2e8f0}.teks-bahaya{color:#b91c1c!important;font-weight:700}.rubrik-ringkas{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #e2e8f0}.nilai-besar{font-size:2.6rem;font-weight:800;line-height:1;margin:18px 0}.nilai-besar small{font-size:1rem;color:#64748b}.nilai-panel{text-align:center}.alur-komentar{display:grid;gap:12px;margin:14px 0}.komentar-item{padding:14px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0}.komentar-item p{margin:.5rem 0}.komentar-item small{color:#64748b}.komentar-revisi{background:#fff7ed;border-color:#fdba74}.form-komentar{display:grid;gap:10px}.form-inline-akademik{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.form-inline-akademik label{flex:1;min-width:240px}.tabel-responsif input[type=number],.tabel-responsif input[type=text]{min-width:110px;width:100%}@media(max-width:720px){.grid-kartu-tugas{grid-template-columns:1fr}.form-inline-akademik{display:grid}.nilai-besar{font-size:2rem}}

/* Fondasi 6 — Bank Soal, Kuis, dan CBT */
.cbt-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.cbt-header h1{margin:7px 0 2px}.timer-cbt{min-width:155px;padding:14px 18px;border:1px solid #bfdbfe;border-radius:14px;background:#eff6ff;text-align:center}.timer-cbt small,.timer-cbt strong{display:block}.timer-cbt strong{font-size:26px;color:var(--utama-gelap);font-variant-numeric:tabular-nums}.timer-cbt.kritis{background:#fef2f2;border-color:#fecaca}.timer-cbt.kritis strong{color:#b91c1c}.layout-cbt{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:20px;align-items:start}.daftar-soal-cbt{display:grid;gap:18px}.navigasi-cbt{position:sticky;top:84px}.judul-soal-cbt{display:flex;align-items:center;gap:11px}.judul-soal-cbt>div{flex:1}.judul-soal-cbt strong,.judul-soal-cbt small{display:block}.judul-soal-cbt small{color:var(--redup)}.pertanyaan-cbt{margin:18px 0;font-size:15px;line-height:1.7;white-space:normal}.opsi-cbt{display:grid;gap:10px}.opsi-cbt label{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--garis);border-radius:11px;cursor:pointer}.opsi-cbt label:hover{border-color:#93c5fd;background:#f8fbff}.opsi-cbt input{width:18px;height:18px;min-height:auto;margin-top:2px}.opsi-cbt span{display:flex;gap:10px;line-height:1.45}.opsi-cbt b{display:grid;place-items:center;flex:0 0 25px;height:25px;border-radius:8px;background:#e2e8f0}.cbt-ragu{padding-top:12px}.status-simpan{display:block;color:var(--redup);margin-top:8px}.grid-nomor-cbt{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin:12px 0 16px}.grid-nomor-cbt a{height:38px;display:grid;place-items:center;border:1px solid var(--garis);border-radius:9px;text-decoration:none;color:var(--teks);font-weight:800;background:#fff}.grid-nomor-cbt a.terjawab{background:#dcfce7;border-color:#86efac;color:#166534}.grid-nomor-cbt a.ragu{background:#fef3c7;border-color:#fcd34d;color:#92400e}.legenda-cbt{display:grid;gap:6px;margin-bottom:18px;font-size:11px;color:var(--redup)}.legenda-cbt span{display:flex;align-items:center;gap:7px}.legenda-cbt i{width:13px;height:13px;border:1px solid var(--garis);border-radius:4px;background:#fff}.legenda-cbt i.terjawab{background:#dcfce7;border-color:#86efac}.legenda-cbt i.ragu{background:#fef3c7;border-color:#fcd34d}.jawaban-hasil{padding:14px;border-radius:11px;background:#f8fafc;border:1px solid var(--garis);line-height:1.6}.pembahasan-cbt{margin-top:14px;padding:12px;border:1px solid #bfdbfe;border-radius:10px;background:#eff6ff}.pembahasan-cbt summary{cursor:pointer;font-weight:800}.pembahasan-cbt>div{margin-top:10px;line-height:1.65}
@media(max-width:920px){.layout-cbt{grid-template-columns:1fr}.navigasi-cbt{position:static;order:-1}.cbt-header{align-items:flex-start}.grid-nomor-cbt{grid-template-columns:repeat(10,1fr)}}
@media(max-width:620px){.cbt-header{flex-direction:column}.timer-cbt{width:100%}.grid-nomor-cbt{grid-template-columns:repeat(5,1fr)}.pertanyaan-cbt{font-size:14px}.opsi-cbt label{padding:10px}}

/* Fondasi 8 */
.ikon-badge-besar{font-size:3rem;line-height:1;text-align:center;margin:.5rem 0}.badge-kartu{text-align:center}.konten-artikel h2{margin-top:1.4rem}.konten-artikel p{line-height:1.75}.formulir-besar>label{display:block;margin-top:1rem}.formulir-besar textarea{width:100%}.notifikasi-peringatan{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.tombol-bahaya{background:#b91c1c;color:#fff;border-color:#b91c1c}@media print{.sidebar,.topbar,.tombol,.tab-workspace{display:none!important}.area-utama,.konten{margin:0!important;padding:0!important}.kartu{box-shadow:none!important}}

/* Fondasi 10 — komunikasi, notifikasi, dan portal orang tua */
.badge-menu{margin-left:auto;background:#ef4444;color:#fff;border-radius:999px;padding:1px 7px;font-size:11px}.ikon-topbar{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid #dbe4f0;border-radius:12px;text-decoration:none;color:#1e3a8a;background:#fff}.ikon-topbar span{position:absolute;right:-5px;top:-7px;background:#dc2626;color:#fff;border-radius:999px;min-width:19px;height:19px;padding:0 5px;font-size:10px;display:flex;align-items:center;justify-content:center;border:2px solid #fff}.kartu-komunikasi{display:flex;gap:14px;align-items:flex-start}.avatar-mini{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e0e7ff;color:#1e3a8a;font-weight:800;flex:0 0 auto}.gelembung-pesan{max-width:78%;padding:12px 14px;border-radius:16px;background:#f1f5f9;margin:9px 0}.gelembung-pesan.milik-sendiri{margin-left:auto;background:#dbeafe}.daftar-pesan{max-height:58vh;overflow:auto;padding:8px}.nomor-notifikasi{width:12px;height:12px;border-radius:50%;background:#2563eb;display:inline-block}.notifikasi-item-belum{border-left:4px solid #2563eb;background:#f8fbff}.ringkasan-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px}.ringkasan-kpi .kartu{padding:16px}.nilai-kpi{font-size:1.7rem;font-weight:800;color:#1e3a8a}.topik-tersemat{border-left:4px solid #f59e0b}.konten-diskusi{white-space:pre-wrap;line-height:1.65}.balasan-bertingkat{margin-left:38px;border-left:2px solid #dbe4f0;padding-left:14px}.grid-komunikasi{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:18px}@media(max-width:900px){.grid-komunikasi{grid-template-columns:1fr}.gelembung-pesan{max-width:94%}}

/* Fondasi 11 — Analitik dan Peringatan Dini */
.metrik-baris{margin:0 0 16px}.metrik-baris>div:first-child{display:flex;justify-content:space-between;gap:16px;margin-bottom:7px}.batang{height:10px;background:#e8edf5;border-radius:999px;overflow:hidden}.batang span{display:block;height:100%;background:linear-gradient(90deg,#1d4ed8,#0ea5e9);border-radius:inherit}.badge-risiko-aman{background:#dcfce7;color:#166534}.badge-risiko-perhatian{background:#fef3c7;color:#92400e}.badge-risiko-tinggi{background:#fed7aa;color:#9a3412}.badge-risiko-kritis{background:#fee2e2;color:#991b1b}.baris-risiko-terpicu{background:#fff7ed}.kotak-tindak-lanjut{border:1px solid #e2e8f0;border-radius:14px;padding:16px;margin-top:12px}.distraktor{display:block;padding:3px 7px;border-radius:7px;margin:3px 0;background:#f1f5f9}.distraktor-kunci{background:#dcfce7;color:#166534}.distraktor-efektif{background:#dbeafe;color:#1e40af}.distraktor-lemah{background:#fee2e2;color:#991b1b}.input-berpasangan{display:flex;align-items:center;gap:8px}.input-berpasangan input{min-width:90px}.ikon-kpi{font-size:1.2rem;color:#2563eb}.daftar-ringkas{display:grid;gap:8px}.baris-ringkas{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #eef2f7;color:inherit;text-decoration:none}.baris-ringkas span:first-child{display:grid}.baris-ringkas small{color:#64748b}.aksi-kepala{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.aksi-kepala form{margin:0}
@media(max-width:760px){.baris-ringkas{align-items:flex-start;flex-direction:column}.aksi-kepala{width:100%}.aksi-kepala .tombol,.aksi-kepala form,.aksi-kepala form .tombol{width:100%}}

.input-kecil{min-height:34px;max-width:150px;border:1px solid var(--garis);border-radius:8px;padding:5px 8px;background:#fff}.status-baik{color:var(--sukses)}

/* ==========================================================
   E-KREASI LMS SMK V1.0 — Inventory Visual Language + Excel Center
   Tema administrasi modern E-KREASI LMS SMK V1.0
   ========================================================== */
:root{
    --utama:#1d4ed8;--utama-gelap:#1e3a8a;--aksen:#0ea5e9;--latar:#f4f7fb;
    --teks:#172033;--redup:#64748b;--garis:#e5eaf2;--sukses:#16a34a;
    --peringatan:#d97706;--bahaya:#dc2626;--radius:16px;
}
body{font-family:Poppins,Inter,"Segoe UI",Arial,sans-serif;background:var(--latar);font-size:.94rem}
.area-utama{background:linear-gradient(180deg,#f8fbff 0,#f4f7fb 100%);min-height:100vh}
.sidebar{background:linear-gradient(180deg,#0f2557 0%,#112f6e 50%,#0b1f49 100%);box-shadow:4px 0 22px rgba(15,23,42,.08)}
.sidebar .logo-teks{border-bottom:1px solid rgba(255,255,255,.1);margin:0 -2px 8px;padding:0 10px 20px}
.logo-lambang{background:#fff;color:#1d4ed8;border-color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.16)}
.menu-label{font-size:.7rem;letter-spacing:.09em;color:#93c5fd;font-weight:700;padding-top:16px}
.menu{gap:2px}.menu a{border-radius:10px;margin:1px 0;color:#d7e5ff;transition:.18s ease}.menu a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(1px)}
.menu a.aktif{background:linear-gradient(135deg,#2563eb,#0ea5e9);box-shadow:0 8px 18px rgba(14,165,233,.25);color:#fff}
.menu a>span:first-child{display:inline-flex;align-items:center;justify-content:center}
.versi-sidebar{color:rgba(255,255,255,.55)}
.inventory-topbar{min-height:58px;padding:9px clamp(18px,4vw,38px);border-bottom:1px solid rgba(15,23,42,.06);box-shadow:0 3px 16px rgba(15,23,42,.05);position:sticky;top:0;z-index:12}
.navbar-app-name{font-weight:700;color:var(--utama);letter-spacing:.01em}.navbar-date{color:var(--redup);font-size:.84rem;display:inline-flex;gap:7px;align-items:center}
.navbar-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#dbeafe,#e0f2fe);border:2px solid #fff;box-shadow:0 2px 8px rgba(15,23,42,.1)}
.identitas-pengguna strong{font-size:.82rem}.identitas-pengguna small{font-size:.72rem}.tombol-logout{display:inline-flex;gap:7px;align-items:center}
.ikon-topbar{width:36px;height:36px;border-radius:10px;color:#334155}.ikon-topbar:hover{color:#1d4ed8;background:#f8fbff}
.konten{padding-top:26px}
.kartu{border:1px solid rgba(226,232,240,.78);border-radius:16px;box-shadow:0 8px 25px rgba(15,23,42,.06);overflow:hidden}
.kartu-isi{padding:1.2rem}.kartu-isi h2{font-size:.98rem;color:#263246}
.kepala-konten,.content-header-panel{position:relative;background:transparent;color:var(--teks);padding:0 0 0 62px;border-radius:0;margin:8px 0 22px;box-shadow:none;min-height:50px;display:flex;flex-direction:column;justify-content:center}
.kepala-konten:before,.content-header-panel:before{content:"\f007";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:1px;width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#dbeafe,#e0f2fe);color:#1d4ed8;font-size:1.08rem}
.kepala-konten h1,.content-header-panel h1{font-size:1.55rem;font-weight:750;margin:0;color:var(--teks);line-height:1.25;letter-spacing:-.02em}
.kepala-konten p,.content-header-panel p{color:var(--redup);font-size:.88rem;margin:4px 0 0}
.content-header-panel.page-excel:before{content:"\f1c3"}.content-header-panel .judul-dengan-aksi{width:100%;justify-content:space-between;align-items:center;flex-wrap:wrap}
.grup input,.grup textarea,.grup select,.input,.select{min-height:44px;border-radius:10px;border-color:#dbe3ef;color:#263246;background:#fff}.grup input:focus,.grup textarea:focus,.grup select:focus{border-color:#60a5fa;box-shadow:0 0 0 .18rem rgba(37,99,235,.12)}
.tombol{border-radius:10px;font-weight:600;transition:all .18s ease}.tombol:hover{transform:translateY(-1px)}
.tombol-utama{background:linear-gradient(135deg,#2563eb,#1d4ed8)}
.tombol-sukses{color:#fff;background:linear-gradient(135deg,#22c55e,#16a34a);border:1px solid #16a34a}
.tombol-outline-sukses{color:#15803d;background:#fff;border:1px solid #86efac}.tombol-outline-sukses:hover{background:#f0fdf4}
.tombol-outline-bahaya{color:#b91c1c;background:#fff;border:1px solid #fecaca}.tombol-outline-bahaya:hover{background:#fef2f2}
.tabel-responsif{border-radius:12px}.inventory-table,.tabel-responsif table{color:#263246;margin-bottom:0}.inventory-table thead th,.tabel-responsif table thead th{border-top:0;border-bottom:1px solid #dfe6f0;background:#f8fafc;color:#475569;font-size:.72rem;text-transform:uppercase;letter-spacing:.035em;white-space:nowrap;padding:.82rem .75rem}.inventory-table td,.tabel-responsif table td{vertical-align:middle;border-bottom:1px solid #edf1f7;padding:.78rem .75rem}.inventory-table tbody tr:hover,.tabel-responsif table tbody tr:hover{background:#f8fbff}
.badge{border-radius:999px;padding:.45em .72em;font-weight:600}.badge-peringatan{color:#92400e;background:#fef3c7}.badge-info{color:#1e40af;background:#dbeafe}
.notifikasi{border:0;border-radius:12px;display:flex;gap:9px;align-items:flex-start;box-shadow:0 5px 16px rgba(15,23,42,.04)}
.pill{border-color:#dbe3ef;box-shadow:0 2px 8px rgba(15,23,42,.03)}

/* Pusat Data Excel */
.excel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.excel-module-card{padding:20px;position:relative;min-height:190px;background:#fff}.excel-module-card:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-48px;top:-48px;background:rgba(37,99,235,.045)}
.excel-module-head{display:flex;align-items:flex-start;gap:14px;position:relative;z-index:1}.excel-module-icon{width:48px;height:48px;flex:0 0 48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#dbeafe,#e0f2fe);color:#1d4ed8;font-size:1.05rem}.excel-module-head h2{font-size:1rem;margin:1px 0 5px}.excel-module-head p{font-size:.78rem;line-height:1.55;color:var(--redup);margin:0}.excel-actions{margin-top:18px;position:relative;z-index:1;flex-wrap:wrap}.excel-actions .tombol{gap:6px}.card-heading-flex{display:flex;align-items:center;justify-content:space-between;gap:16px}.card-heading-flex h2{margin-bottom:2px}.card-heading-flex p{margin:0}.back-link{display:inline-flex;gap:7px;align-items:center;color:#1d4ed8;text-decoration:none;font-size:.8rem;font-weight:600;margin-bottom:5px}.excel-import-layout{grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr)}.excel-security-note{display:flex;gap:12px;padding:13px 15px;border-radius:12px;background:#eff6ff;color:#1e3a8a;border:1px solid #bfdbfe}.excel-security-note>i{font-size:1.2rem;margin-top:2px}.excel-security-note strong,.excel-security-note small{display:block}.excel-security-note small{color:#475569;margin-top:3px}.excel-rules{padding-left:21px;margin:0;display:grid;gap:10px;color:#475569;font-size:.84rem}.excel-rules code{background:#f1f5f9;padding:2px 5px;border-radius:5px;color:#1e3a8a}

@media(max-width:1100px){.excel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.excel-grid,.excel-import-layout{grid-template-columns:1fr}.kepala-konten,.content-header-panel{padding-left:56px}.kepala-konten:before,.content-header-panel:before{width:42px;height:42px}.kepala-konten h1,.content-header-panel h1{font-size:1.28rem}.navbar-date{display:none}.tombol-logout span{display:none}.content-header-panel .judul-dengan-aksi{align-items:flex-start}.excel-module-card{min-height:0}}
@media print{.sidebar,.topbar{display:none!important}.kerangka{grid-template-columns:1fr}.konten{padding:0}.kepala-konten,.content-header-panel{padding-left:0}.kepala-konten:before,.content-header-panel:before{display:none}.kartu{box-shadow:none}}
/* Sidebar modern E-KREASI LMS SMK V1.0 */
.inventory-brand{display:flex!important;align-items:center;gap:11px;text-decoration:none;color:#fff}
.inventory-brand small{display:block;color:rgba(255,255,255,.55);font-size:.68rem;margin-top:2px}
.sidebar-user-panel{display:flex;align-items:center;gap:10px;margin:10px 4px 4px;padding:12px 8px 14px;border-bottom:1px solid rgba(255,255,255,.10);min-width:0}
.sidebar-user-panel>div{min-width:0}.sidebar-user-panel strong,.sidebar-user-panel small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-panel strong{font-size:.79rem;color:#fff;font-weight:600}.sidebar-user-panel small{font-size:.67rem;color:#93c5fd;margin-top:2px}
.sidebar-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.24);box-shadow:none}
.menu a i{font-size:.93rem;width:18px}.menu a.aktif i{filter:drop-shadow(0 1px 2px rgba(0,0,0,.08))}

/* Dashboard produksi V1.0 */
.grid-kpi-produksi{grid-template-columns:repeat(7,minmax(0,1fr));gap:14px}.kpi-produksi{position:relative;min-height:132px;overflow:hidden}.kpi-produksi .ikon-kpi{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;background:#eff6ff;margin-bottom:12px}.kpi-produksi .angka{font-size:29px}.kpi-produksi small{display:block;margin-top:5px}.dashboard-hero{flex-direction:row;align-items:center;justify-content:space-between;gap:18px}.dashboard-hero>div{min-width:0}
@media(max-width:1450px){.grid-kpi-produksi{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:820px){.grid-kpi-produksi{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-hero{flex-direction:column;align-items:flex-start}}@media(max-width:440px){.grid-kpi-produksi{grid-template-columns:1fr 1fr}.kpi-produksi{min-height:118px;padding:16px}.kpi-produksi .angka{font-size:25px}}


/* Konsistensi formulir universal — UAT R3
   Catatan: input tanpa atribut type tetap ditangkap sebagai text field. */
.konten :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea),
.panel-formulir :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea){
    width:100%;min-height:44px;box-sizing:border-box;border:1px solid #dbe3ef;border-radius:12px;padding:10px 12px;background:#fff;color:var(--teks);font:inherit;outline:none;box-shadow:0 1px 2px rgba(15,23,42,.025);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease
}
.konten textarea,.panel-formulir textarea{min-height:104px;resize:vertical;line-height:1.5}
.konten select[multiple],.panel-formulir select[multiple]{min-height:120px}
.konten input[type="file"],.panel-formulir input[type="file"]{padding:7px 9px;background:#f8fafc}
.konten input[type="file"]::file-selector-button,.panel-formulir input[type="file"]::file-selector-button{margin-right:10px;border:0;border-radius:10px;padding:7px 11px;background:#eaf2ff;color:#1e40af;font-weight:700;cursor:pointer}
.konten :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea)::placeholder,
.panel-formulir :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea)::placeholder{color:#94a3b8;opacity:1}
.konten :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea):focus,
.panel-formulir :where(input:not([type]),input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"],input[type="url"],input[type="search"],input[type="tel"],input[type="file"],select,textarea):focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(59,130,246,.12);background:#fff}
.konten :where(input,select,textarea):disabled,.konten :where(input,textarea)[readonly],.panel-formulir :where(input,select,textarea):disabled,.panel-formulir :where(input,textarea)[readonly]{background:#f1f5f9;color:#64748b;cursor:not-allowed}
.konten :where(input[type="checkbox"],input[type="radio"]),.panel-formulir :where(input[type="checkbox"],input[type="radio"]){accent-color:var(--utama);width:17px;height:17px;vertical-align:middle}
/* Field kompak boleh lebih pendek, tetapi tetap memakai bahasa visual/radius yang sama. */
.konten .aksi-baris select,.konten .select-mini,.konten .input-kecil{border-radius:12px}
.form-grid,.grid-form,.grid-formulir{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.form-grid>label,.grid-form>label,.grid-formulir>.grup,.kartu form>label{min-width:0}
.form-grid>label,.grid-form>label,.kartu form>label{display:grid;gap:7px;color:#334155;font-size:12px;font-weight:700}
.form-grid>.penuh,.grid-form>.penuh,.grid-form>.span-2,.grid-formulir>.penuh,.form-grid>.span-2{grid-column:1/-1}
.grup label,.form-grid label>span,.grid-form label>span{color:#334155;font-size:12px;font-weight:700}
.grup small,.form-grid label>small,.grid-form label>small{color:var(--redup);font-weight:400;line-height:1.45}
.baris-filter :where(input[type="text"],input[type="search"],input[type="date"],select),.aksi-baris :where(input[type="number"],input[type="text"],select),.input-kecil{width:auto;min-width:90px}
.tabel-responsif td form:not(.form-grid):not(.grid-form):not(.grid-formulir){display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tabel-responsif td form :where(input[type="text"],input[type="email"],input[type="number"],input[type="date"],select){min-width:135px;flex:1 1 135px}
.footer-aplikasi{margin-top:auto;padding:18px 28px 22px;border-top:1px solid #e5eaf1;color:#7b8798;font-size:11px;text-align:center;display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;background:rgba(255,255,255,.72)}
.footer-aplikasi b{color:#64748b}.footer-pemisah{color:#cbd5e1}.area-utama{min-height:100vh;display:flex;flex-direction:column}.konten{flex:1 0 auto}
@media(max-width:620px){.form-grid,.grid-form,.grid-formulir{grid-template-columns:1fr}.form-grid>.penuh,.grid-form>.penuh,.grid-form>.span-2,.grid-formulir>.penuh,.form-grid>.span-2{grid-column:auto}.footer-aplikasi{padding:16px 18px}.footer-pemisah{display:none}.footer-aplikasi span{width:100%}}
.detail-teknis{margin-top:14px;padding:12px 14px;border:1px dashed #cbd5e1;border-radius:10px;background:#f8fafc}.detail-teknis summary{cursor:pointer;font-weight:700;color:#334155}.detail-teknis code{display:block;overflow:auto;margin:10px 0;padding:10px 12px;border-radius:8px;background:#0f172a;color:#e2e8f0;font-size:12px;white-space:nowrap}
.konten label:has(>input[type="checkbox"]),.konten label:has(>input[type="radio"]){display:flex;align-items:center;gap:8px;min-height:36px;font-size:12px;font-weight:600;color:#475569}.konten label:has(>input[type="checkbox"]) input,.konten label:has(>input[type="radio"]) input{flex:0 0 auto;margin:0}
/* Komponen utilitas yang sebelumnya belum memiliki style eksplisit */
.tombol-primer{color:#fff;background:linear-gradient(135deg,var(--utama),var(--aksen));border-color:transparent}.tombol-primer:hover{filter:brightness(.96)}
.kepala-halaman{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.kepala-halaman h1{margin-bottom:5px}.kepala-halaman p{margin:0;color:var(--redup)}
.alert{padding:12px 14px;border:1px solid var(--garis);border-radius:10px;margin:10px 0;font-size:13px;line-height:1.55}.alert.sukses{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.alert.galat{background:#fef2f2;border-color:#fecaca;color:#991b1b}.alert.peringatan{background:#fff7ed;border-color:#fed7aa;color:#9a3412}.alert.informasi{background:#eff6ff;border-color:#bfdbfe;color:#1e3a8a}
.baris-daftar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--garis)}.baris-daftar:last-child{border-bottom:0}.baris-daftar>div{min-width:0}.baris-daftar strong,.baris-daftar small{display:block}.baris-daftar small{margin-top:3px;color:var(--redup);word-break:break-word}.baris-daftar form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.baris-daftar form :where(input,select){width:auto;min-width:120px}
.jarak-bawah{margin-bottom:16px}.baris-sebar{display:flex;align-items:center;justify-content:space-between;gap:12px}.baris-tautan{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--garis)}.pilihan-centang{display:flex!important;align-items:center!important;gap:8px!important}.statistik strong{display:block;font-size:26px;margin-top:4px}.statistik small{color:var(--redup)}
@media(max-width:720px){.kepala-halaman,.baris-daftar,.baris-sebar,.baris-tautan{align-items:stretch;flex-direction:column}.baris-daftar form{width:100%}.baris-daftar form :where(input,select){width:100%}}
.daftar-rinci{display:grid;grid-template-columns:minmax(120px,160px) minmax(0,1fr);gap:9px 14px;margin:0}.daftar-rinci dt{font-size:12px;font-weight:700;color:var(--redup)}.daftar-rinci dd{margin:0;color:var(--teks);word-break:break-word}.teks-bantu{margin:7px 0 0;color:var(--redup);font-size:12px;line-height:1.5}
.grid-kartu{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.grid-kartu.empat{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.grid-kartu.empat .kartu{padding:18px}
.form-jawaban-cbt{display:grid;gap:12px}.soal-cbt{scroll-margin-top:90px}.materi-pembaca{min-width:0}
@media(max-width:900px){.grid-kartu.empat{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.daftar-rinci{grid-template-columns:1fr;gap:3px}.daftar-rinci dd{margin-bottom:9px}.grid-kartu.empat{grid-template-columns:1fr}}


/* Sidebar UAT: posisi menu dipertahankan dan versi tidak menutupi menu terbawah */
.sidebar{scrollbar-gutter:stable;overscroll-behavior:contain;padding-bottom:22px}
.versi-sidebar{position:static;left:auto;right:auto;bottom:auto;margin-top:18px;padding:13px 8px 3px;border-top:1px solid rgba(255,255,255,.08);text-align:center}

/* =========================================================
   CUSTOM LOGIN — SMK SATYA PRAJA 2 PETARUKAN
   ========================================================= */
body.halaman-login-sekolah {
    min-height: 100vh;
    background: #eef3f9;
}

.login-sekolah {
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    grid-template-columns: minmax(520px, 58%) minmax(420px, 42%);
    background: #eef3f9;
}

.login-visual {
    position: relative;
    min-height: 100vh;
    min-height: 100svh;
    overflow: hidden;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(30px, 4.5vw, 68px);
    isolation: isolate;
}

.login-foto-sekolah {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 48% center;
    z-index: -3;
    transform: scale(1.015);
}

.login-lapisan {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(180deg, rgba(5, 22, 52, .52) 0%, rgba(6, 29, 67, .34) 34%, rgba(6, 27, 64, .78) 100%),
        linear-gradient(90deg, rgba(10, 45, 98, .42), rgba(4, 18, 43, .08));
}

.login-visual::after {
    content: "";
    position: absolute;
    inset: auto -110px -150px auto;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.16);
    box-shadow:
        0 0 0 48px rgba(255,255,255,.035),
        0 0 0 96px rgba(255,255,255,.025);
    z-index: -1;
}

.login-identitas-sekolah {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 16px;
    width: fit-content;
    max-width: 100%;
    padding: 11px 17px 11px 11px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 18px;
    background: rgba(7, 31, 72, .42);
    box-shadow: 0 14px 38px rgba(0,0,0,.16);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.login-logo-sekolah {
    width: 58px;
    height: 72px;
    object-fit: contain;
    filter: drop-shadow(0 4px 7px rgba(0,0,0,.25));
}

.login-identitas-sekolah strong,
.login-identitas-sekolah span {
    display: block;
}

.login-identitas-sekolah strong {
    margin-top: 4px;
    font-size: clamp(15px, 1.35vw, 21px);
    line-height: 1.2;
    letter-spacing: .035em;
}

.login-keterangan-kecil {
    color: rgba(255,255,255,.76);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.login-pesan-merek {
    position: relative;
    z-index: 1;
    max-width: 780px;
    margin: auto 0 clamp(30px, 4vh, 60px);
}

.login-badge {
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.24);
    background: rgba(255,255,255,.12);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.login-pesan-merek h1 {
    margin: 17px 0 15px;
    max-width: 780px;
    font-size: clamp(38px, 5.2vw, 76px);
    line-height: .98;
    letter-spacing: -.045em;
    text-shadow: 0 3px 18px rgba(0,0,0,.28);
}

.login-pesan-merek p {
    max-width: 650px;
    margin: 0;
    color: rgba(255,255,255,.84);
    font-size: clamp(14px, 1.3vw, 18px);
    line-height: 1.65;
}

.login-fitur-ringkas {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}

.login-fitur-ringkas span {
    padding: 7px 10px;
    border-radius: 9px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(8, 28, 62, .34);
    color: rgba(255,255,255,.92);
    font-size: 11px;
    font-weight: 700;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.login-versi {
    position: relative;
    z-index: 1;
    color: rgba(255,255,255,.64);
    font-size: 11px;
    font-weight: 650;
    letter-spacing: .04em;
}

.login-panel-formulir {
    min-width: 0;
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    place-items: center;
    padding: clamp(28px, 5vw, 72px);
    background:
        radial-gradient(circle at 100% 0, rgba(37,99,235,.08), transparent 28%),
        radial-gradient(circle at 0 100%, rgba(14,165,233,.06), transparent 30%),
        #f7f9fc;
}

.kartu-login-sekolah {
    width: min(100%, 470px);
    padding: clamp(26px, 3vw, 40px);
    border: 1px solid #dce5f1;
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 24px 70px rgba(27, 57, 104, .12);
}

.login-logo-mobile {
    display: none;
    align-items: center;
    gap: 11px;
    margin-bottom: 24px;
}

.login-logo-mobile img {
    width: 48px;
    height: 60px;
    object-fit: contain;
}

.login-logo-mobile strong,
.login-logo-mobile span {
    display: block;
}

.login-logo-mobile strong {
    color: #173a75;
    font-size: 14px;
    line-height: 1.2;
}

.login-logo-mobile span {
    margin-top: 2px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .13em;
}

.judul-login-sekolah {
    margin-bottom: 28px;
}

.login-eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #2563eb;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.judul-login-sekolah h2 {
    margin: 0;
    color: #172033;
    font-size: clamp(30px, 3vw, 40px);
    line-height: 1.08;
    letter-spacing: -.035em;
}

.judul-login-sekolah p {
    margin: 10px 0 0;
    color: #64748b;
    font-size: 14px;
    line-height: 1.65;
}

.form-login-sekolah {
    display: grid;
    gap: 18px;
}

.grup-login {
    display: grid;
    gap: 8px;
}

.grup-login label {
    color: #344155;
    font-size: 12px;
    font-weight: 750;
}

.input-login {
    position: relative;
    display: flex;
    align-items: center;
}

.input-login input {
    width: 100%;
    min-height: 52px;
    padding: 12px 44px 12px 44px;
    border: 1px solid #ced8e6;
    border-radius: 13px;
    outline: none;
    background: #fbfdff;
    color: #172033;
    font-size: 14px;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.input-login input::placeholder {
    color: #9aa8ba;
}

.input-login input:focus {
    border-color: #3b82f6;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(59,130,246,.10);
}

.ikon-input {
    position: absolute;
    left: 14px;
    top: 50%;
    z-index: 1;
    width: 20px;
    height: 20px;
    color: #7890ad;
    transform: translateY(-50%);
    pointer-events: none;
}

.ikon-input svg,
.tombol-lihat-sandi svg,
.tombol-login-sekolah svg {
    width: 100%;
    height: 100%;
}

.tombol-lihat-sandi {
    position: absolute;
    right: 8px;
    top: 50%;
    width: 36px;
    height: 36px;
    padding: 8px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #71839b;
    transform: translateY(-50%);
}

.tombol-lihat-sandi:hover,
.tombol-lihat-sandi:focus-visible {
    background: #edf4ff;
    color: #2563eb;
    outline: none;
}

.tombol-login-sekolah {
    width: 100%;
    min-height: 52px;
    margin-top: 2px;
    padding: 12px 17px;
    border: 0;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #fff;
    background: linear-gradient(135deg, #1d4ed8, #2563eb 55%, #0ea5e9);
    box-shadow: 0 12px 24px rgba(37,99,235,.22);
    font-weight: 800;
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.tombol-login-sekolah svg {
    width: 19px;
    height: 19px;
}

.tombol-login-sekolah:hover {
    transform: translateY(-1px);
    box-shadow: 0 15px 30px rgba(37,99,235,.27);
    filter: saturate(1.05);
}

.tombol-login-sekolah:active {
    transform: translateY(0);
}

.kartu-login-sekolah .notifikasi {
    margin-bottom: 18px;
    border-radius: 12px;
}

.login-bantuan {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #e6edf5;
    color: #7b899d;
    font-size: 11px;
}

.login-bantuan span:last-child {
    color: #43546a;
    font-weight: 700;
    text-align: right;
}

.login-footer-sekolah {
    margin-top: 28px;
    color: #98a4b4;
    font-size: 10px;
    text-align: center;
}

@media (max-width: 1100px) {
    .login-sekolah {
        grid-template-columns: minmax(450px, 54%) minmax(400px, 46%);
    }
    .login-pesan-merek h1 {
        font-size: clamp(36px, 5vw, 58px);
    }
}

@media (max-width: 900px) {
    .login-sekolah {
        grid-template-columns: 1fr;
    }
    .login-visual {
        min-height: 330px;
        padding: 28px;
    }
    .login-identitas-sekolah {
        padding: 8px 13px 8px 8px;
    }
    .login-logo-sekolah {
        width: 44px;
        height: 55px;
    }
    .login-keterangan-kecil,
    .login-fitur-ringkas,
    .login-versi {
        display: none;
    }
    .login-pesan-merek {
        margin: auto 0 0;
        max-width: 620px;
    }
    .login-pesan-merek h1 {
        margin: 10px 0 8px;
        font-size: clamp(34px, 8vw, 54px);
    }
    .login-pesan-merek p {
        max-width: 590px;
        font-size: 14px;
    }
    .login-panel-formulir {
        min-height: auto;
        padding: 34px 22px 46px;
    }
}

@media (max-width: 560px) {
    .login-visual {
        min-height: 245px;
        padding: 18px;
    }
    .login-identitas-sekolah {
        display: none;
    }
    .login-pesan-merek h1 {
        font-size: 35px;
        line-height: 1.02;
    }
    .login-pesan-merek p {
        display: none;
    }
    .login-badge {
        font-size: 9px;
    }
    .login-panel-formulir {
        padding: 18px 14px 30px;
        place-items: start center;
    }
    .kartu-login-sekolah {
        margin-top: -42px;
        position: relative;
        z-index: 3;
        padding: 24px 20px;
        border-radius: 20px;
    }
    .login-logo-mobile {
        display: flex;
    }
    .judul-login-sekolah {
        margin-bottom: 23px;
    }
    .judul-login-sekolah h2 {
        font-size: 30px;
    }
    .login-bantuan {
        display: block;
        line-height: 1.6;
    }
    .login-bantuan span {
        display: block;
    }
    .login-bantuan span:last-child {
        text-align: left;
    }
}

/* Learning Path berbasis kompetensi — E-KREASI LMS SMK V1.0 */
.learning-path-admin{align-items:start}.learning-path-editor{overflow:hidden}.learning-path-list{display:grid;gap:12px;margin-top:18px}.learning-path-step{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start;padding:15px;border:1px solid var(--garis);border-radius:14px;background:#fff}.learning-path-number{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#eaf2ff;color:#1d4ed8;font-weight:900}.learning-path-body{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:16px}.learning-path-head{min-width:0}.learning-path-head strong,.learning-path-head small{display:block}.learning-path-head strong{margin:7px 0 3px;font-size:15px}.learning-path-head small{color:var(--redup);line-height:1.45}.learning-path-step.selesai{border-color:#bbf7d0;background:#f7fff9}.learning-path-step.selesai .learning-path-number{background:#dcfce7;color:#166534}.learning-path-step.sekarang{border-color:#93c5fd;box-shadow:0 0 0 3px rgba(59,130,246,.07)}.learning-path-step.terkunci{background:#f8fafc;opacity:.76}.learning-path-step.terkunci .learning-path-number{background:#e2e8f0;color:#64748b}.learning-path-row-locked{opacity:.74;background:#f8fafc}.learning-path-editor .tautan-aksi:disabled{opacity:.35;cursor:not-allowed;text-decoration:none}.learning-path-student>.judul-dengan-aksi{margin-bottom:4px}
@media(max-width:720px){.learning-path-body{align-items:stretch;flex-direction:column}.learning-path-step{grid-template-columns:40px minmax(0,1fr);gap:10px}.learning-path-number{width:36px;height:36px;border-radius:11px}.learning-path-admin{grid-template-columns:1fr}}
.learning-path-kpi{grid-template-columns:repeat(2,minmax(0,1fr));max-width:680px}
@media(max-width:620px){.learning-path-kpi{grid-template-columns:1fr 1fr;max-width:none}}
