.or-halaman { display: flex; flex-direction: column; gap: 14px; }
.or-judul h2 { font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 20px; font-weight: 800; color: #0F172A; margin: 0; }
.dark .or-judul h2 { color: #F1F5F9; }
.or-judul p { font-size: 12.5px; color: #64748B; margin: 3px 0 0; line-height: 1.55; }
.or-tab { display: flex; gap: 6px; padding: 5px; border-radius: 16px; background: #EEF2F7; overflow-x: auto; scrollbar-width: none; }
.dark .or-tab { background: #0B1424; }
.or-tab button { flex: 1 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 0 14px; border-radius: 12px; border: 0; background: transparent; font-size: 12.5px; font-weight: 800; color: #64748B; cursor: pointer; white-space: nowrap; }
.or-tab button[aria-selected="true"] { background: #fff; color: rgb(var(--c-primary-700)); box-shadow: 0 6px 16px -10px rgb(15 23 42 / .5); }
.dark .or-tab button[aria-selected="true"] { background: #16233A; color: rgb(var(--c-primary-300)); }
.or-muat { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 46px 0; font-size: 13px; color: #94A3B8; }
.or-kosong { display: grid; justify-items: center; gap: 6px; text-align: center; padding: 34px 18px; border-radius: 20px; border: 1px dashed #CBD5E1; background: #fff; color: #64748B; }
.dark .or-kosong { background: #0F192B; border-color: #233049; }
.or-kosong i { font-size: 26px; color: #CBD5E1; }
.or-kosong b { color: #0F172A; font-size: 14px; }
.dark .or-kosong b { color: #E2E8F0; }
.or-kosong p { margin: 0; font-size: 12.5px; max-width: 420px; line-height: 1.55; }
.or-bulan { display: flex; align-items: center; justify-content: center; gap: 14px; }
.or-bulan b { font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 15px; font-weight: 800; min-width: 150px; text-align: center; }
.or-bulan-btn { width: 38px; height: 38px; border-radius: 12px; border: 1px solid #E2E8F0; background: #fff; color: #334155; cursor: pointer; }
.or-bulan-btn:disabled { opacity: .4; cursor: default; }
.dark .or-bulan-btn { background: #0F192B; border-color: #233049; color: #CBD5E1; }
.or-hero { --c1: #2563EB; --c2: #1E3A8A; position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr auto; gap: 14px; padding: 18px; border-radius: 22px; color: #fff; background: linear-gradient(145deg, var(--c1), var(--c2)); box-shadow: 0 18px 36px -26px var(--c2); }
.or-hero[data-t="a"] { --c1: #059669; --c2: #064E3B; }
.or-hero[data-t="b"] { --c1: #0EA5E9; --c2: #0C4A6E; }
.or-hero[data-t="c"] { --c1: #6366F1; --c2: #312E81; }
.or-hero[data-t="d"] { --c1: #F59E0B; --c2: #92400E; }
.or-hero[data-t="e"] { --c1: #F43F5E; --c2: #881337; }
.or-hero-nilai small { font-size: 11.5px; font-weight: 700; opacity: .85; }
.or-hero-nilai b { display: block; font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 46px; font-weight: 800; line-height: 1; margin: 4px 0 6px; letter-spacing: -.03em; }
.or-pred { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgb(255 255 255 / .16); font-size: 12px; font-weight: 800; }
.or-pred [lang="ar"] { font-family: 'Amiri', 'Noto Naskh Arabic', serif; font-size: 15px; }
.or-hero-sisi { display: grid; gap: 8px; align-content: start; }
.or-hero-sisi div { padding: 8px 12px; border-radius: 14px; background: rgb(255 255 255 / .12); text-align: right; }
.or-hero-sisi b { display: block; font-size: 20px; font-weight: 800; line-height: 1.1; }
.or-hero-sisi b small { font-size: 12px; opacity: .7; }
.or-hero-sisi span { font-size: 10.5px; opacity: .85; font-weight: 700; }
.or-batang { grid-column: 1 / -1; display: flex; align-items: flex-end; gap: 8px; height: 74px; padding-top: 18px; border-top: 1px solid rgb(255 255 255 / .16); }
.or-batang span { flex: 1; height: var(--h); min-height: 6px; border-radius: 8px 8px 4px 4px; background: rgb(255 255 255 / .9); position: relative; }
.or-batang span[data-t="absen"], .or-batang span[data-t="nanti"], .or-batang span[data-t="menunggu"] { background: rgb(255 255 255 / .22); }
.or-batang i { position: absolute; top: -16px; left: 0; right: 0; text-align: center; font-style: normal; font-size: 10.5px; font-weight: 800; }
.or-kartu { background: #fff; border: 1px solid rgb(15 23 42 / .07); border-radius: 20px; padding: 16px; box-shadow: 0 10px 30px -24px rgb(15 23 42 / .45); }
.dark .or-kartu { background: #0F192B; border-color: rgb(255 255 255 / .06); }
.or-kepala { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.or-kepala h3 { margin: 0; font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 15px; font-weight: 800; color: #0F172A; }
.dark .or-kepala h3 { color: #F1F5F9; }
.or-kepala p { margin: 1px 0 0; font-size: 12px; color: #64748B; }
.or-kepala > div { min-width: 0; flex: 1; }
.or-pekan { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.or-pekan li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: #F8FAFC; border: 1px solid #EEF2F7; }
.dark .or-pekan li { background: rgb(255 255 255 / .03); border-color: rgb(255 255 255 / .05); }
.or-pekan li[data-st="nanti"] { opacity: .65; }
.or-pekan-no { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: #E2E8F0; color: #475569; flex-shrink: 0; }
.dark .or-pekan-no { background: #1E293B; color: #CBD5E1; }
.or-pekan-teks { flex: 1; min-width: 0; display: grid; gap: 1px; }
.or-pekan-teks b { font-size: 13px; color: #0F172A; }
.dark .or-pekan-teks b { color: #E2E8F0; }
.or-pekan-teks small { font-size: 11px; color: #64748B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.or-n { min-width: 48px; height: 36px; padding: 0 10px; border-radius: 11px; display: inline-grid; place-items: center; font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 17px; font-weight: 800; flex-shrink: 0; }
.or-n[data-t="a"] { background: #D1FAE5; color: #047857; }
.or-n[data-t="b"] { background: #E0F2FE; color: #0369A1; }
.or-n[data-t="c"] { background: #E0E7FF; color: #4338CA; }
.or-n[data-t="d"] { background: #FEF3C7; color: #B45309; }
.or-n[data-t="e"] { background: #FFE4E6; color: #BE123C; }
.dark .or-n[data-t="a"] { background: rgb(16 185 129 / .16); color: #6EE7B7; }
.dark .or-n[data-t="b"] { background: rgb(14 165 233 / .16); color: #7DD3FC; }
.dark .or-n[data-t="c"] { background: rgb(99 102 241 / .18); color: #C7D2FE; }
.dark .or-n[data-t="d"] { background: rgb(245 158 11 / .16); color: #FCD34D; }
.dark .or-n[data-t="e"] { background: rgb(244 63 94 / .16); color: #FDA4AF; }
.or-chip { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 11px; font-weight: 800; background: #F1F5F9; color: #64748B; white-space: nowrap; flex-shrink: 0; }
.or-chip.is-merah { background: #FFE4E6; color: #BE123C; }
.or-chip.is-kuning { background: #FEF3C7; color: #B45309; }
.or-chip.is-hijau { background: #D1FAE5; color: #047857; }
.dark .or-chip { background: #1E293B; color: #94A3B8; }
.dark .or-chip.is-merah { background: rgb(244 63 94 / .16); color: #FDA4AF; }
.dark .or-chip.is-kuning { background: rgb(245 158 11 / .16); color: #FCD34D; }
.dark .or-chip.is-hijau { background: rgb(16 185 129 / .16); color: #6EE7B7; }
.or-catatan { margin: 12px 0 0; font-size: 11.5px; color: #64748B; line-height: 1.55; }
.or-catatan i { color: rgb(var(--c-primary-500)); margin-right: 3px; }
.or-aksi { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.or-btn { flex: 1 1 160px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 13px; border: 1px solid #E2E8F0; background: #fff; color: #0F172A; font-size: 13px; font-weight: 800; cursor: pointer; }
.or-btn.is-utama { border-color: transparent; background: linear-gradient(145deg, rgb(var(--c-primary-600)), rgb(var(--c-primary-800))); color: #fff; box-shadow: 0 12px 24px -16px rgb(var(--c-primary-800)); }
.or-btn:disabled { opacity: .5; cursor: default; }
.dark .or-btn { background: #16233A; border-color: #233049; color: #E2E8F0; }
.dark .or-btn.is-utama { background: linear-gradient(145deg, rgb(var(--c-primary-500)), rgb(var(--c-primary-700))); color: #fff; }
.or-tw-daftar { display: grid; gap: 12px; }
.or-tw-ket { margin: -4px 0 0; font-size: 12px; color: #64748B; }
.or-tw-ringkas { margin-top: 12px; }
.or-tw-skala { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.or-tw-skala div { border-radius: 14px; padding: 10px 8px; text-align: center; background: #F8FAFC; border: 1px solid #EEF2F7; }
.or-tw-skala b { display: block; font-size: 22px; font-weight: 800; line-height: 1.1; }
.or-tw-skala span { font-size: 10.5px; font-weight: 700; color: #64748B; }
.or-tw-skala div[data-k="A"] b { color: #047857; }
.or-tw-skala div[data-k="B"] b { color: #0369A1; }
.or-tw-skala div[data-k="C"] b { color: #B45309; }
.or-tw-skala div[data-k="D"] b { color: #BE123C; }
.dark .or-tw-skala div { background: rgb(255 255 255 / .03); border-color: rgb(255 255 255 / .05); }
.or-tw-bag { margin-top: 8px; border-radius: 14px; border: 1px solid #EEF2F7; overflow: hidden; }
.dark .or-tw-bag { border-color: rgb(255 255 255 / .06); }
.or-tw-bag summary { cursor: pointer; padding: 11px 12px; font-size: 12.5px; font-weight: 800; background: #F8FAFC; }
.dark .or-tw-bag summary { background: rgb(255 255 255 / .03); }
.or-tw-bag ul { list-style: none; margin: 0; padding: 6px 12px 10px; display: grid; gap: 6px; }
.or-tw-bag li { display: flex; gap: 10px; align-items: flex-start; font-size: 12px; line-height: 1.45; }
.or-tw-n { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; flex-shrink: 0; font-weight: 800; font-size: 12px; background: #F1F5F9; color: #64748B; }
.or-tw-n[data-k="A"] { background: #D1FAE5; color: #047857; }
.or-tw-n[data-k="B"] { background: #E0F2FE; color: #0369A1; }
.or-tw-n[data-k="C"] { background: #FEF3C7; color: #B45309; }
.or-tw-n[data-k="D"] { background: #FFE4E6; color: #BE123C; }
.or-tw-cat { margin-top: 10px; padding: 12px; border-radius: 14px; background: #FFFBEB; border: 1px solid #FDE68A; font-size: 12.5px; }
.or-tw-cat p { margin: 4px 0 0; line-height: 1.55; }
.dark .or-tw-cat { background: rgb(245 158 11 / .08); border-color: rgb(245 158 11 / .25); }
.or-beranda-n { margin-left: auto; min-width: 52px; height: 40px; padding: 0 10px; border-radius: 13px; display: grid; place-items: center; font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 20px; font-weight: 800; background: #E0F2FE; color: #0369A1; }
.or-beranda-n[data-t="a"] { background: #D1FAE5; color: #047857; }
.or-beranda-n[data-t="d"] { background: #FEF3C7; color: #B45309; }
.or-beranda-n[data-t="e"] { background: #FFE4E6; color: #BE123C; }
.or-titik { display: flex; gap: 8px; margin-bottom: 10px; }
.or-titik span { flex: 1; min-width: 0; display: grid; justify-items: center; gap: 2px; padding: 8px 4px; border-radius: 14px; background: #F1F5F9; }
.or-titik b { font-size: 15px; font-weight: 800; color: #475569; }
.or-titik small { font-size: 10px; color: #94A3B8; font-weight: 700; }
.or-titik span[data-t="a"] { background: #D1FAE5; }
.or-titik span[data-t="a"] b { color: #047857; }
.or-titik span[data-t="b"] { background: #E0F2FE; }
.or-titik span[data-t="b"] b { color: #0369A1; }
.or-titik span[data-t="c"] { background: #E0E7FF; }
.or-titik span[data-t="c"] b { color: #4338CA; }
.or-titik span[data-t="d"] { background: #FEF3C7; }
.or-titik span[data-t="d"] b { color: #B45309; }
.or-titik span[data-t="e"], .or-titik span[data-t="absen"] { background: #FFE4E6; }
.or-titik span[data-t="e"] b, .or-titik span[data-t="absen"] b { color: #BE123C; }
.dark .or-titik span { background: rgb(255 255 255 / .04); }
.or-tw-pita { width: 100%; margin-top: 10px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; border: 1px solid rgb(139 92 246 / .25); background: linear-gradient(135deg, rgb(139 92 246 / .1), rgb(56 189 248 / .08)); color: #4C1D95; text-align: left; cursor: pointer; }
.or-tw-pita > i:first-child { font-size: 20px; color: #7C3AED; }
.or-tw-pita span { flex: 1; min-width: 0; display: grid; }
.or-tw-pita b { font-size: 13px; }
.or-tw-pita small { font-size: 11px; opacity: .8; }
.dark .or-tw-pita { color: #DDD6FE; }
@media (max-width: 420px) {
    .or-hero { grid-template-columns: 1fr; }
    .or-hero-sisi { grid-template-columns: 1fr 1fr; }
    .or-hero-sisi div { text-align: left; }
    .or-tw-skala { grid-template-columns: 1fr 1fr; }
}
html[data-ringan="1"] .po-hero-ornamen { display: none; }
/* Ukuran teks komponen v1.7 tidak ikut aturan "p/li minimal 1rem" ponsel (premium.css). */
.po-hero p.po-hero-salam { font-size: 11.5px; line-height: 1.4; }
.po-hero p.po-hero-sub { font-size: 11.5px; line-height: 1.45; }
.or-halaman .or-judul p { font-size: 12.5px; line-height: 1.55; }
div.or-kosong p { font-size: 12.5px; line-height: 1.55; }
.or-kartu p.or-catatan, .or-tw-ringkas p.or-catatan { font-size: 11.5px; line-height: 1.55; }
.or-kartu p.or-tw-ket { font-size: 12px; }
.or-kepala div p { font-size: 12px; line-height: 1.4; }
ol.or-pekan li, .or-tw-bag ul li { font-size: 12px; line-height: 1.45; }
div.or-tw-cat p { font-size: 12.5px; }

/* v20: ruang yang konsisten untuk rapor, data dan pendampingan. */
.v20-page,.or-halaman,.rp{--v20-ink:#172b4d;--v20-muted:#64748b;--v20-surface:#fff;--v20-line:#dce4ef;--v20-soft:#edf3fc;--v20-blue:#315ea8;color:var(--v20-ink);min-width:0}
.dark .v20-page,.dark .or-halaman,.dark .rp{--v20-ink:#e5edf9;--v20-muted:#a2b1c9;--v20-surface:#142136;--v20-line:#2a3c57;--v20-soft:#1b304d;--v20-blue:#96bbff}
.v20-page{max-width:1300px;margin:0 auto;display:grid;gap:20px}
.v20-hero,.or-judul{padding:26px;border-radius:24px;background:linear-gradient(120deg,#1b3866,#325e9a);color:white;position:relative;overflow:hidden}
.v20-hero h2,.or-judul h2{color:white;font-size:25px;font-weight:800;line-height:1.25;margin:5px 0 8px}
.v20-hero p,.or-halaman .or-judul p{color:#d9e7fa;font-size:13px;line-height:1.7;max-width:750px;margin:0}
.v20-eyebrow{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#bdd4f4}
.v20-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.v20-stat{background:var(--v20-surface);padding:18px;border:1px solid var(--v20-line);border-radius:18px;display:grid;gap:4px}
.v20-stat b{font-size:26px;font-weight:800;letter-spacing:-.04em;line-height:1.25}.v20-stat small{font-size:12px;color:var(--v20-muted)}
.v20-card,.v19-panel{background:var(--v20-surface,#fff);border:1px solid var(--v20-line,#dce4ef);border-radius:20px;padding:22px;box-shadow:0 6px 24px #17305606;margin:0}
.v20-card h3{font-size:16px;font-weight:800;margin:0 0 5px}.v20-card p{color:var(--v20-muted);font-size:13px;line-height:1.7}
.v20-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin:0 0 18px}.v20-toolbar label{flex:1 1 170px;min-width:0;display:grid;gap:7px;font-size:11px;font-weight:800;color:var(--v20-muted)}
.v20-toolbar input,.v20-toolbar select,.v20-form input,.v20-form select,.v20-form textarea{background:var(--v20-surface);color:var(--v20-ink);border:1px solid var(--v20-line);border-radius:12px;padding:11px 12px;font-size:14px;min-height:46px;width:100%;max-width:100%;box-sizing:border-box}
.v20-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--v20-line,#ccd9ea);border-radius:12px;padding:11px 15px;font-size:12px;font-weight:800;min-height:44px;background:var(--v20-surface,#fff);color:var(--v20-ink,#21385a);cursor:pointer;text-decoration:none;white-space:normal}
.v20-button.is-primary{background:#315ea8;color:white;border-color:#315ea8}.v20-button:disabled{opacity:.5;cursor:default}
.v20-button:focus-visible,.or-halaman button:focus-visible,.rp button:focus-visible{outline:3px solid #6ba8fb;outline-offset:3px}
.v20-roster{display:grid;gap:10px}.v20-person{display:grid;grid-template-columns:40px minmax(0,1fr) minmax(140px,200px) auto;gap:16px;align-items:center;padding:16px;border:1px solid var(--v20-line);border-radius:16px;background:var(--v20-surface)}
.v20-avatar{display:flex;align-items:center;justify-content:center;background:var(--v20-soft);color:var(--v20-blue);width:40px;height:40px;border-radius:13px;font-weight:800}
.v20-person strong{font-size:13px;display:block}.v20-person small{font-size:11px;color:var(--v20-muted);display:block;margin-top:4px;overflow-wrap:anywhere}.v20-progress{height:7px;background:var(--v20-soft);border-radius:8px;overflow:hidden;margin-top:7px}.v20-progress span{display:block;height:100%;background:#448c83;border-radius:8px}
.v20-person .v20-percent{display:flex;justify-content:space-between;font-size:11px;color:var(--v20-muted)}
.v20-count{font-size:12px;color:var(--v20-muted);margin:12px 0}.v20-empty{padding:30px;text-align:center;color:var(--v20-muted);font-size:13px}
.or-halaman{max-width:1120px!important;gap:20px}.or-tab{background:var(--v20-soft);padding:7px;border:1px solid var(--v20-line);border-radius:18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.or-tab button{min-width:0;min-height:48px;padding:10px;white-space:normal;line-height:1.4}.or-tab button[aria-selected=true]{background:var(--v20-surface);color:var(--v20-blue)}
.or-kartu{padding:24px;border-color:var(--v20-line);border-radius:22px;background:var(--v20-surface)}.or-bulan{justify-content:space-between;padding:0 4px 15px}.or-bulan-btn{width:42px;height:42px;border:1px solid var(--v20-line);background:var(--v20-surface);color:var(--v20-ink)}
.or-hero{padding:26px;border-radius:22px;background:linear-gradient(120deg,#1c456f,#31747d)!important;color:white!important;margin-bottom:20px}.or-hero-nilai small,.or-hero-sisi span{color:#e0edf8!important}.or-hero-nilai>b{font-size:56px;line-height:1.15}.or-hero .or-pred{color:white!important}
.or-pekan{display:grid;gap:10px}.or-pekan li{border:1px solid var(--v20-line);background:var(--v20-surface);padding:16px;border-radius:15px;gap:14px;min-width:0}.or-pekan-teks{min-width:0}.or-pekan-teks b{font-size:13px;line-height:1.5}.or-pekan-teks small{line-height:1.5;overflow-wrap:anywhere}.or-pekan-no{width:30px;height:30px;flex-shrink:0;background:var(--v20-soft);color:var(--v20-blue)}
.or-nilai{min-width:48px;min-height:44px;font-size:20px;border-radius:12px}.or-aksi{gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--v20-line)}.or-btn{min-height:46px;border-radius:12px;padding:11px 16px}
.or-catatan{padding:12px 0;font-size:12px!important;line-height:1.7!important}.v20-insight{padding:16px 18px;border:1px solid var(--v20-line);border-left:4px solid #438d89;border-radius:14px;background:var(--v20-surface);margin:0 0 18px;font-size:13px;line-height:1.65}
.rp{max-width:1400px;margin:auto}.rp-kartu{padding:24px;border-radius:22px;border:1px solid var(--v20-line);background:var(--v20-surface)}.rp-kartu-judul{padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--v20-line)}.rp-kartu-judul h3{font-size:20px;font-weight:800;line-height:1.35}.rp-kartu-judul p{font-size:12px;line-height:1.6;max-width:700px}
.rp-alat{gap:12px;align-items:end;background:var(--v20-soft);padding:16px;border-radius:16px}.rp-alat .rp-f{flex:1 1 170px;min-width:0!important}.rp-in,.rp-sel{min-height:44px;border-radius:10px;background:var(--v20-surface);font-size:14px}.rp-f label{font-size:11px;font-weight:800;margin-bottom:7px}.rp-ekspor{display:flex;gap:8px;flex-wrap:wrap;margin-left:0}.rp-btn{min-height:44px;border-radius:10px;padding:10px 13px}.rp-tabel-wrap{margin-top:16px;max-height:65dvh}.rp-tabel th{background:var(--v20-soft);font-size:11px;padding:11px 12px}.rp-tabel td{padding:11px 12px}.rp-tabel tbody tr:nth-child(even) td{background:var(--v20-soft)}.rp-tabel tbody tr:hover td{background:#e2edfc}.dark .rp-tabel tbody tr:hover td{background:#263e61}
.rp-tabel .rp-nama{min-width:185px;font-weight:700;text-align:left}.rp-tabel .rp-sel-n{min-width:65px;cursor:pointer}.rp-sel-n:hover{outline:2px solid #598ed8;outline-offset:-2px}.rp-pred-id{display:block;font-size:10px}.rp-hero{background:linear-gradient(115deg,#1b3866,#325e9a);border-radius:22px}.rp-tabs{gap:8px}.rp-tabs button{min-height:52px;border-radius:14px}
.v19-remedial{margin-bottom:18px;background:var(--v20-surface)}.v19-remedial .v19-summary{display:grid;gap:6px}.v19-remedial label{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.v19-remedial input{width:90px}.v20-auto{margin:0 0 18px}.v20-auto .v20-stats{margin-bottom:12px}.v20-auto .v20-stat b{font-size:24px}.v20-auto p{font-size:12px;color:var(--v20-muted);line-height:1.6}
.v20-goals{display:grid;gap:12px}.v20-goal{border:1px solid var(--v20-line);padding:18px;border-radius:17px;background:var(--v20-surface);display:grid;gap:9px}.v20-goal h4{font-size:15px;font-weight:800;overflow-wrap:anywhere}.v20-goal p{font-size:13px;white-space:pre-wrap;margin:0;line-height:1.65;overflow-wrap:anywhere}.v20-goal small{font-size:11px;color:var(--v20-muted)}.v20-goal footer{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.v20-pill{display:inline-flex;gap:6px;padding:5px 9px;border-radius:8px;background:var(--v20-soft);color:var(--v20-blue);font-size:11px;font-weight:800}.v20-form{display:grid;gap:14px}.v20-form label{display:grid;gap:6px;font-size:12px;font-weight:700}.v20-form textarea{min-height:100px;resize:vertical}
.ps-v20{margin-bottom:18px}.ps-v20 h3{font-size:16px;margin-bottom:10px}.ps-v20 .v20-goal{background:#17263b;border-color:#35435a;color:#e3edfc}.ps-v20 .v20-goal small{color:#adbdd6}
@media(max-width:700px){.v20-page,.or-halaman{gap:14px}.v20-hero,.or-judul{padding:20px;border-radius:20px}.v20-hero h2,.or-judul h2{font-size:22px}.v20-card,.rp-kartu,.or-kartu{padding:16px;border-radius:18px}.v20-person{grid-template-columns:36px minmax(0,1fr);gap:12px;padding:14px}.v20-person .v20-meter{grid-column:2}.v20-person .v20-button{grid-column:2;justify-self:start}.v20-stats{gap:8px}.v20-stat{padding:13px}.v20-stat b{font-size:23px}.v20-stat small{font-size:10px;line-height:1.5}.or-pekan li{padding:13px;gap:10px;flex-wrap:wrap}.or-pekan-teks{flex:1 1 calc(100% - 48px)}.or-pekan li>.or-chip,.or-pekan li>.or-nilai{margin-left:40px}.or-hero{padding:20px}.rp-alat{padding:12px}.rp-ekspor{width:100%}.rp-ekspor .rp-btn{flex:1 1 40%}.or-aksi .or-btn{flex:1 1 170px}.v20-auto .v20-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.or-halaman *,.v20-page *{animation:none!important;transition:none!important}}
@media print{.v20-page .v20-toolbar,.v20-auto{display:none!important}}

@media(max-width:700px){.v20-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.v20-toolbar label{width:100%;min-width:0}.v20-toolbar label:first-child{grid-column:1/-1}.v20-toolbar>.v20-button{width:100%}.v20-toolbar select{font-size:13px;padding:10px 7px}.rp-hero .ket{font-size:12px;line-height:1.6}.rp-hero{padding:18px}.rp-hero-chips{gap:5px}.v20-hero h2{font-size:21px}}

.v19-remedial summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none}.v19-remedial summary::-webkit-details-marker{display:none}.v19-remedial summary span{display:grid;gap:6px}.v19-remedial summary b{font-size:14px}.v19-remedial summary small{font-size:11px;color:var(--v20-muted);line-height:1.6}.v19-remedial summary i{font-size:12px;color:var(--v20-muted)}.v19-remedial[open] summary i{transform:rotate(180deg)}.v19-remedial label{margin-top:16px}

#askc-backdrop{z-index:1800!important}

.dark .or-halaman,.dark #content-area>.v20-page,.dark #content-area>.rp{background:#0b1424;box-shadow:0 0 0 20px #0b1424}

@media(max-width:1023px){#app-shell:has(#content-area>.v20-page) #fab-absen,#app-shell:has(#content-area>.rp) #fab-absen{display:none!important}}