:root {
    --ink: #172033;
    --muted: #718078;
    --line: #dce5e2;
    --paper: #ffffff;
    --canvas: #f3f7f5;
    --green-950: #06251f;
    --green-900: #0a342a;
    --green-700: #087a5a;
    --green-100: #e7f8f1;
    --yellow: #f7c451;
    --yellow-dark: #b77705;
    --red: #b42318;
    --red-bg: #fef3f2;
    --radius: 18px;
    --shadow: 0 15px 35px rgba(21, 48, 40, .08);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--canvas); }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--canvas); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, textarea, select { font: inherit; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 280px; z-index: 30; display: flex; flex-direction: column; color: #eef9f5; background: var(--green-950); }
.brand { min-height: 116px; padding: 26px 22px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.brand-mark { width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center; overflow: hidden; border-radius: 16px; color: var(--green-950); background: var(--yellow); font-size: 26px; font-weight: 800; }
.brand-mark img { width: 100%; height: 100%; object-fit: cover; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 18px; line-height: 1.25; }
.brand small { margin-top: 4px; color: #8fa9a1; }
.main-nav { padding: 24px 10px; display: grid; gap: 5px; overflow-y: auto; }
.main-nav a { min-height: 48px; padding: 0 16px; display: flex; align-items: center; gap: 13px; border-radius: 15px; color: #a9bbb6; font-weight: 650; }
.main-nav a:hover { color: #fff; background: rgba(255,255,255,.06); }
.main-nav a.active { color: var(--yellow); background: rgba(255,255,255,.11); }
.nav-icon { width: 25px; text-align: center; font-weight: 800; }
.sidebar-user { margin: auto 12px 16px; padding: 16px; display: grid; gap: 5px; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: rgba(255,255,255,.04); }
.sidebar-user small { color: #8fa9a1; }
.sidebar-user strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user span { color: #b9cbc5; font-size: 13px; }
.sidebar-user a { margin-top: 8px; color: var(--yellow); font-weight: 700; font-size: 14px; }
.main-content { min-height: 100vh; margin-left: 280px; }
.topbar { height: 116px; padding: 0 32px; display: flex; align-items: center; gap: 15px; border-bottom: 1px solid #b8c4c0; background: rgba(255,255,255,.88); backdrop-filter: blur(10px); }
.topbar small { color: var(--green-700); font-weight: 800; letter-spacing: .05em; }
.topbar h1 { margin: 5px 0 0; font-size: 23px; }
.menu-button { display: none; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: white; cursor: pointer; }
.page-content { max-width: 1500px; margin: 0 auto; padding: 30px 32px 60px; }
.sidebar-overlay { display: none; }

.page-title-row, .section-head, .action-row, .inline-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.page-title-row { margin-bottom: 20px; }
.page-title-row h2, .section-head h2 { margin: 0; }
.page-title-row p, .section-head p { margin: 5px 0 0; color: var(--muted); }
.grid { display: grid; gap: 22px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dashboard-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 24px; }
.card, .stat-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow); }
.card { padding: 24px; }
.card + .card { margin-top: 22px; }
.stat-card { min-height: 142px; padding: 22px; display: flex; flex-direction: column; justify-content: center; }
.stat-card > span { color: var(--muted); font-weight: 650; }
.stat-card strong { margin-top: 10px; font-size: clamp(25px, 3vw, 39px); color: var(--green-700); }
.stat-card small { margin-top: 6px; color: var(--muted); }
.hero-card { padding: 26px; color: white; background: linear-gradient(135deg, var(--green-950), #0b5b47); }
.hero-card h2 { margin: 3px 0 9px; font-size: 29px; }
.hero-card p { margin: 0; color: #c8ded7; }
.status-pill, .badge { width: fit-content; display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.status-pill { margin-bottom: 13px; padding: 8px 12px; color: #704802; background: var(--yellow); }
.badge { padding: 5px 9px; color: #086247; background: var(--green-100); }
.badge-muted { color: #5d6965; background: #eef1f0; }
.badge-warning { color: #885b05; background: #fff5d9; }
.badge-danger { color: var(--red); background: var(--red-bg); }

.btn { min-height: 42px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid transparent; border-radius: 12px; cursor: pointer; font-weight: 750; white-space: nowrap; }
.btn:hover { filter: brightness(.97); transform: translateY(-1px); }
.btn-primary { color: white; background: var(--green-700); }
.btn-secondary { color: var(--ink); border-color: var(--line); background: white; }
.btn-warning { color: #5f3d00; background: var(--yellow); }
.btn-danger { color: var(--red); border-color: #f0b8b3; background: var(--red-bg); }
.btn-small { min-height: 34px; padding: 0 11px; border-radius: 9px; font-size: 13px; }
.btn-block { width: 100%; }
.link { color: var(--green-700); font-weight: 750; }

.alert { margin-bottom: 20px; padding: 15px 18px; border: 1px solid; border-radius: 15px; }
.alert-success { color: #086247; border-color: #84e5c5; background: #eafbf5; }
.alert-error { color: #8d1c13; border-color: #f1aaa4; background: var(--red-bg); }
.alert-info { color: #24526d; border-color: #a9d5ec; background: #eff9ff; }
.alert-warning { color: #79510a; border-color: #f2d48f; background: #fff8e7; }

label { display: grid; gap: 7px; color: #29372f; font-size: 14px; font-weight: 700; }
input, select, textarea { width: 100%; min-height: 45px; padding: 10px 13px; border: 1px solid #cedbd6; border-radius: 12px; outline: none; color: var(--ink); background: #fff; }
textarea { min-height: 115px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--green-700); box-shadow: 0 0 0 3px rgba(8,122,90,.12); }
input:disabled, select:disabled, textarea:disabled { color: #697570; background: #f0f3f2; cursor: not-allowed; }
.stack-form { display: grid; gap: 16px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.form-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: span 3; }
.form-hint, .muted { color: var(--muted); }
.form-hint { font-size: 13px; line-height: 1.55; }
.field-error { color: var(--red); font-weight: 750; }
.checkbox-label { min-height: 45px; display: flex; align-items: center; gap: 9px; }
.checkbox-label input { width: 18px; min-height: 18px; }
.filter-bar { margin-bottom: 20px; padding: 16px; display: flex; align-items: end; gap: 12px; flex-wrap: wrap; border: 1px solid var(--line); border-radius: var(--radius); background: white; }
.filter-bar label { min-width: 150px; }
.search-bar { display: flex; gap: 10px; }
.search-bar input { min-width: min(360px, 60vw); }

.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 14px 12px; text-align: left; border-bottom: 1px solid #e7ecea; vertical-align: top; }
th { color: #61716a; background: #f7faf8; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
tbody tr:hover { background: #fbfdfc; }
td strong, td small { display: block; }
td small { margin-top: 4px; color: var(--muted); }
.amount { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.empty-state { padding: 38px 20px; text-align: center; color: var(--muted); }
.empty-state strong { display: block; margin-bottom: 7px; color: var(--ink); font-size: 18px; }
.pagination { margin-top: 18px; display: flex; gap: 7px; flex-wrap: wrap; }
.pagination a { min-width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: white; }
.pagination a.active { color: white; background: var(--green-700); }

.member-row { margin-bottom: 14px; padding: 18px; display: grid; grid-template-columns: 1.6fr .8fr 1fr 1fr 1.2fr; gap: 14px; align-items: end; border: 1px solid var(--line); border-radius: 14px; background: #f9fbfa; }
.member-row .member-name { grid-column: span 2; }
.member-row .member-whatsapp { grid-column: span 2; }
.member-row .member-action { justify-self: end; margin-bottom: 1px; }
.member-row label small { display: inline; margin-left: 4px; color: var(--muted); font-weight: 500; }
.autocomplete-wrap { position: relative; }
.autocomplete-list { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 20; max-height: 260px; overflow-y: auto; padding: 7px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 15px 35px rgba(21,48,40,.17); }
.autocomplete-list button { width: 100%; padding: 12px; text-align: left; border: 0; border-radius: 9px; color: var(--ink); background: white; cursor: pointer; }
.autocomplete-list button:hover { background: var(--green-100); }

.schedule-board { display: grid; grid-template-columns: repeat(7, minmax(190px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.schedule-day { padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: white; }
.schedule-day h3 { margin: 0 0 12px; font-size: 16px; }
.schedule-item { margin-bottom: 9px; padding: 11px; border-radius: 11px; background: #f2f8f5; }
.schedule-item strong, .schedule-item small { display: block; }
.schedule-item small { margin: 4px 0 9px; color: var(--muted); }

.detail-list { display: grid; gap: 11px; }
.detail-list > div { padding-bottom: 11px; display: flex; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); }
.detail-list dt { color: var(--muted); }
.detail-list dd { margin: 0; font-weight: 700; text-align: right; }
.audit-list { margin: 0; padding-left: 20px; color: #4f5c57; }
.audit-list li + li { margin-top: 9px; }

.auth-page { min-height: 100vh; padding: 28px 16px; display: grid; place-items: center; background: radial-gradient(circle at top left, #dff5eb 0, transparent 34%), var(--canvas); }
.auth-card { width: min(460px, 100%); padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: white; box-shadow: 0 25px 70px rgba(12,52,42,.13); }
.install-card { width: min(680px, 100%); }
.auth-brand { margin-bottom: 27px; display: flex; align-items: center; gap: 13px; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font-size: 19px; }
.auth-brand small { margin-top: 3px; color: var(--muted); }
.auth-card h1 { margin: 0 0 8px; }
.auth-card > p { margin: 0 0 23px; }
.success-panel dl { padding: 15px; display: grid; grid-template-columns: 1fr 1fr; border-radius: 14px; background: #f3f8f6; }
.success-panel dd { text-align: right; font-weight: 800; }

.modal { position: fixed; inset: 0; z-index: 100; padding: 20px; display: grid; place-items: center; background: rgba(3,24,19,.62); }
.modal-card { width: min(720px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; padding: 24px; border-radius: 20px; background: white; box-shadow: 0 20px 70px rgba(0,0,0,.25); }
.modal-card h2 { margin-top: 0; }
.modal-card > .section-head { margin-bottom: 22px; }
.modal-card > .section-head h2 { margin-bottom: 6px; }
.modal-card > .section-head p { margin: 0; }
.modal-actions { margin-top: 18px; display: flex; justify-content: end; gap: 10px; }

.print-only { display: none; }

@media (max-width: 1100px) {
    .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-3, .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .member-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .member-row .member-name, .member-row .member-whatsapp { grid-column: span 1; }
}

@media (max-width: 800px) {
    .sidebar { transform: translateX(-100%); transition: transform .2s ease; }
    .sidebar-open .sidebar { transform: translateX(0); }
    .sidebar-overlay { position: fixed; inset: 0; z-index: 25; background: rgba(3,24,19,.48); }
    .sidebar-open .sidebar-overlay { display: block; }
    .main-content { margin-left: 0; }
    .topbar { height: 88px; padding: 0 18px; }
    .topbar h1 { font-size: 19px; }
    .topbar small { font-size: 11px; }
    .menu-button { display: inline-grid; place-items: center; }
    .page-content { padding: 20px 16px 45px; }
    .grid-2, .grid-3, .grid-4, .form-grid, .form-grid-3 { grid-template-columns: 1fr; }
    .span-2, .span-3 { grid-column: auto; }
    .page-title-row { align-items: flex-start; flex-direction: column; }
    .member-row { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 520px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .card { padding: 18px; }
    .stat-card { min-height: 120px; }
    .filter-bar, .search-bar, .inline-actions { align-items: stretch; flex-direction: column; }
    .filter-bar label, .search-bar input { min-width: 0; width: 100%; }
    .member-row { grid-template-columns: 1fr; }
    .member-row .member-name, .member-row .member-whatsapp { grid-column: auto; }
    .member-row .member-action { justify-self: stretch; }
    .auth-card { padding: 23px; }
    .modal { padding: 10px; }
    .modal-card { max-height: calc(100vh - 20px); padding: 20px 16px; border-radius: 16px; }
}

@media print {
    body { color: black; background: white; }
    .sidebar, .topbar, .no-print, .sidebar-overlay, .btn { display: none !important; }
    .main-content { margin: 0; }
    .page-content { max-width: none; padding: 0; }
    .card { padding: 0; border: 0; box-shadow: none; }
    .print-only { display: block; }
    table { font-size: 11px; }
    th, td { padding: 8px 6px; }
}

.contribution-finish{display:flex;align-items:center;justify-content:space-between;gap:20px;border-color:#8ccbb8;background:#f3fbf8}.contribution-finish h2{margin:0 0 6px}.contribution-finish p{margin:0;max-width:700px}.contribution-finish form{flex:0 0 auto}code{padding:2px 6px;border-radius:6px;background:#f1f5f3;overflow-wrap:anywhere}@media(max-width:800px){.contribution-finish{align-items:stretch;flex-direction:column}.contribution-finish .btn{width:100%}}


/* v1.4.0 - modal konfirmasi dan notifikasi aplikasi */
body.dialog-open { overflow: hidden; }
.app-flash-source { display: none !important; }
.app-dialog[hidden] { display: none !important; }
.app-dialog { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 24px; }
.app-dialog-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(4, 28, 22, .62); backdrop-filter: blur(4px); cursor: default; }
.app-dialog-card { position: relative; z-index: 1; width: min(480px, 100%); padding: 30px; border: 1px solid rgba(255,255,255,.6); border-radius: 24px; background: #fff; box-shadow: 0 30px 90px rgba(0, 31, 24, .28); animation: appDialogIn .18s ease-out; }
.app-dialog-icon { width: 58px; height: 58px; margin-bottom: 18px; display: grid; place-items: center; border-radius: 18px; color: #fff; background: var(--green-700); font-size: 28px; font-weight: 900; box-shadow: 0 10px 24px rgba(8, 122, 90, .2); }
.app-dialog-eyebrow { display: block; margin-bottom: 7px; color: var(--green-700); font-size: 11px; font-weight: 900; letter-spacing: .09em; }
.app-dialog-content h2 { margin: 0 0 9px; color: var(--ink); font-size: 22px; }
.app-dialog-content p { margin: 0; color: var(--muted); line-height: 1.65; white-space: pre-line; }
.app-dialog-actions { margin-top: 24px; display: flex; justify-content: flex-end; gap: 10px; }
.app-dialog[data-tone="danger"] .app-dialog-icon,
.app-dialog[data-tone="error"] .app-dialog-icon { background: #b52b22; box-shadow: 0 10px 24px rgba(181,43,34,.2); }
.app-dialog[data-tone="warning"] .app-dialog-icon { color: #5d3c00; background: #f5b942; box-shadow: 0 10px 24px rgba(245,185,66,.25); }
.app-dialog[data-tone="info"] .app-dialog-icon { background: #2d6f92; box-shadow: 0 10px 24px rgba(45,111,146,.2); }
.app-notice-card { width: min(440px, 100%); }
.token-box { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.token-box code { max-width: min(520px, 70vw); padding: 8px 10px; border: 1px solid var(--line); background: #f6f9f8; font-size: 13px; word-break: break-all; }
.warning-panel { margin-top: 16px; padding: 14px 16px; border: 1px solid #efd083; border-radius: 14px; color: #6c4b08; background: #fff8e7; line-height: 1.55; }
.warning-panel strong { color: #513600; }
@keyframes appDialogIn { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 520px) {
    .app-dialog { padding: 14px; }
    .app-dialog-card { padding: 24px 20px; border-radius: 20px; }
    .app-dialog-actions { flex-direction: column-reverse; }
    .app-dialog-actions .btn { width: 100%; }
    .token-box { align-items: stretch; flex-direction: column; }
    .token-box code { max-width: 100%; }
}

/* v1.5.0: penanda koreksi jimpitan */
.contribution-mode{padding:13px 14px;border:1px solid #d9e5df;border-radius:14px;background:#f6faf8;color:#36564b;font-weight:700;line-height:1.5}
.contribution-mode.is-correction{border-color:#e6c76c;background:#fff9e8;color:#73580c}

.pagination-wrap { margin-top: 16px; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.pagination-info { color: var(--muted); font-size: 14px; }
.pagination-gap { min-width:26px; display:grid; place-items:center; color:var(--muted); }
.bulk-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:14px; padding:12px 14px; border:1px dashed var(--line); border-radius:12px; background:var(--surface-soft,#f8fbfa); }
.table-number { width:64px; white-space:nowrap; }

/* v1.7.7 - sidebar desktop ringkas + pengelompokan menu */
.sidebar,.main-content{transition:width .2s ease,margin-left .2s ease,transform .2s ease}
.sidebar-collapse-button{position:absolute;top:92px;right:-15px;width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:50%;color:#fff;background:var(--green-700);box-shadow:0 6px 18px rgba(0,0,0,.18);cursor:pointer;z-index:2}
.desktop-sidebar-button{width:42px;height:42px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:12px;color:var(--ink);background:#fff;cursor:pointer}
.nav-section{display:grid;gap:5px}
.nav-section+.nav-section{margin-top:16px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.nav-section-title{padding:0 16px 5px;color:#6f9187;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.11em}
.nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.sidebar-collapsed .sidebar{width:86px}
body.sidebar-collapsed .main-content{margin-left:86px}
body.sidebar-collapsed .brand{padding-left:17px;padding-right:17px;justify-content:center}
body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .nav-label,body.sidebar-collapsed .nav-section-title,body.sidebar-collapsed .sidebar-user small,body.sidebar-collapsed .sidebar-user strong,body.sidebar-collapsed .sidebar-user span{display:none}
body.sidebar-collapsed .main-nav{padding-left:10px;padding-right:10px}
body.sidebar-collapsed .main-nav a{padding:0;justify-content:center}
body.sidebar-collapsed .nav-icon{width:auto;font-size:17px}
body.sidebar-collapsed .sidebar-user{padding:9px;margin-left:10px;margin-right:10px;text-align:center}
body.sidebar-collapsed .sidebar-user a{margin:0;font-size:11px}
body.sidebar-collapsed .sidebar-collapse-button{transform:rotate(180deg)}

/* v1.7.7 - jadwal dikelompokkan per hari/RT */
.schedule-groups{display:block}
.schedule-day-block+.schedule-day-block{margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}
.schedule-day-heading{margin-bottom:12px;display:flex;align-items:baseline;gap:10px}
.schedule-day-heading span{font-size:20px;font-weight:850}
.schedule-day-heading small{color:var(--muted)}
.schedule-rt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.schedule-group-card{padding:18px;border:1px solid var(--line);border-radius:16px;background:#fbfdfc}
.schedule-group-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.schedule-group-top h3{margin:9px 0 3px;font-size:18px}
.schedule-group-top small{display:block;color:var(--muted)}
.schedule-member-count{padding:7px 10px;border-radius:999px;background:var(--green-100);color:var(--green-700);font-size:12px;font-weight:800;white-space:nowrap}
.schedule-group-actions{margin-top:15px;display:flex;gap:8px;flex-wrap:wrap}
.schedule-member-picker{display:grid;gap:10px}
.schedule-member-chips{display:flex;gap:8px;flex-wrap:wrap}
.schedule-member-chip{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 11px;border:1px solid #cfe0da;border-radius:12px;background:#f3f9f6}
.schedule-member-chip span{display:grid}
.schedule-member-chip strong{font-size:13px}
.schedule-member-chip small{color:var(--muted);font-size:10px}
.schedule-member-chip button{width:25px;height:25px;border:0;border-radius:8px;color:var(--red);background:#fff0ef;font-weight:900;cursor:pointer}

/* v1.7.7 - checklist report final */
.report-ready-card{margin-top:22px;border-color:#a7d7c7;background:#fbfffd}
.report-checklist{margin:14px 0 18px;display:flex;gap:9px;flex-wrap:wrap}
.report-checklist span{padding:8px 11px;border-radius:999px;font-size:12px;font-weight:800}
.report-checklist .done{color:#0c674e;background:#e5f7f0}
.report-checklist .pending{color:#7a5910;background:#fff5d9}

@media(max-width:1000px){.schedule-rt-grid{grid-template-columns:1fr}}
@media(max-width:800px){
  .desktop-sidebar-button,.sidebar-collapse-button{display:none}
  body.sidebar-collapsed .sidebar{width:280px}
  body.sidebar-collapsed .main-content{margin-left:0}
  body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .nav-label,body.sidebar-collapsed .nav-section-title,body.sidebar-collapsed .sidebar-user small,body.sidebar-collapsed .sidebar-user strong,body.sidebar-collapsed .sidebar-user span{display:initial}
  body.sidebar-collapsed .main-nav a{padding:0 16px;justify-content:flex-start}
  body.sidebar-collapsed .nav-icon{width:25px;font-size:inherit}
  .schedule-rt-grid{grid-template-columns:1fr}
}
.schedule-sequence{display:block;margin-bottom:7px;color:var(--muted);font-weight:800}

/* v1.7.11 - Landing page publik */
.public-page{min-height:100vh;color:var(--ink);background:linear-gradient(180deg,#f4faf7 0,#f8fbfa 45%,#eef6f2 100%)}
.public-topbar{position:sticky;top:0;z-index:30;min-height:82px;padding:14px max(24px,calc((100vw - 1320px)/2));display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid rgba(195,214,206,.8);background:rgba(255,255,255,.9);backdrop-filter:blur(18px)}
.public-brand{display:flex;align-items:center;gap:12px;color:var(--ink)}
.public-brand span:last-child{display:grid}.public-brand strong{font-size:18px}.public-brand small{margin-top:2px;color:var(--muted)}
.public-brand-mark{width:48px;height:48px;flex-basis:48px;border-radius:14px}
.public-shell{width:min(1320px,calc(100% - 36px));margin:0 auto;padding:36px 0 58px}
.public-hero{position:relative;overflow:hidden;padding:38px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr);gap:34px;align-items:center;border:1px solid #bed8cf;border-radius:32px;background:linear-gradient(135deg,#062d24 0%,#075c46 56%,#0b7a5b 100%);box-shadow:0 28px 80px rgba(7,73,56,.16)}
.public-hero:before{content:"";position:absolute;width:430px;height:430px;right:-140px;top:-210px;border-radius:50%;background:rgba(255,209,88,.16)}
.public-hero:after{content:"";position:absolute;width:300px;height:300px;left:35%;bottom:-245px;border-radius:50%;background:rgba(255,255,255,.09)}
.public-hero-copy,.public-login-card{position:relative;z-index:1}.public-hero-copy{padding:20px 10px;color:#fff}
.public-eyebrow,.public-section-heading span:first-child,.public-announcement span,.public-about>div:first-child>span,.public-login-heading>span{display:block;margin-bottom:10px;color:#8ed9c2;font-size:12px;font-weight:850;letter-spacing:.11em}
.public-hero h1{max-width:720px;margin:0 0 16px;font-size:clamp(38px,5vw,68px);line-height:1.03;letter-spacing:-.035em}.public-hero-copy>p{max-width:730px;margin:0;color:#d3e8e1;font-size:18px;line-height:1.7}
.public-hero-meta{margin:24px 0;display:flex;gap:9px;flex-wrap:wrap}.public-hero-meta span{padding:8px 11px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.08);font-size:13px;font-weight:700}
.public-contact-btn{margin-top:2px}
.public-login-card{padding:28px;border:1px solid rgba(255,255,255,.68);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 24px 65px rgba(0,33,25,.22)}
.public-login-heading{margin-bottom:22px}.public-login-heading>span{color:var(--green-700)}.public-login-heading h2{margin:0 0 6px;font-size:28px}.public-login-heading p{margin:0;color:var(--muted);line-height:1.55}
.public-login-card .form-hint{margin:16px 0 0}.public-login-card .alert{margin-bottom:15px}
.public-section{margin-top:38px}.public-section-heading{margin-bottom:18px;display:flex;align-items:end;justify-content:space-between;gap:20px}.public-section-heading span:first-child{color:var(--green-700);margin-bottom:5px}.public-section-heading h2{margin:0;font-size:30px;letter-spacing:-.02em}.public-section-heading p{margin:7px 0 0;color:var(--muted)}.public-section-heading>small{color:var(--muted);font-weight:700}
.public-time-chip{padding:9px 13px;border-radius:999px;color:#075a44;background:#dff5ec;font-size:13px;font-weight:800;white-space:nowrap}
.public-status-card{padding:22px 24px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;border:1px solid;border-radius:22px;background:#fff;box-shadow:var(--shadow)}.public-status-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;font-size:24px;font-weight:900}.public-status-card strong{font-size:19px}.public-status-card p{margin:5px 0 0;color:var(--muted);line-height:1.55}.public-status-progress{min-width:90px;text-align:right}.public-status-progress strong{display:block;font-size:27px}.public-status-progress span{color:var(--muted);font-size:12px}
.public-status-safe{border-color:#9bdcc8}.public-status-safe .public-status-icon{color:#087557;background:#dff8ef}.public-status-attention{border-color:#efc79d}.public-status-attention .public-status-icon{color:#9b4e08;background:#fff0dd}.public-status-running{border-color:#b8d9ce}.public-status-running .public-status-icon,.public-status-neutral .public-status-icon{color:#356258;background:#eaf3ef}.public-status-progress{border-left:1px solid var(--line);padding-left:18px}
.public-schedule-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.public-schedule-card{min-height:205px;padding:20px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow)}.public-schedule-card.is-empty{background:#f8faf9;box-shadow:none}.public-schedule-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.public-rt-badge{padding:7px 10px;border-radius:10px;color:#fff;background:var(--green-700);font-weight:850}.public-schedule-state{color:#0b7659;font-size:12px;font-weight:800}.is-empty .public-schedule-state{color:var(--muted)}.public-pic{margin-top:24px;display:grid;gap:4px}.public-pic small{color:var(--muted)}.public-pic strong{font-size:20px}.public-pic span{color:var(--green-700);font-size:12px;font-weight:750}.public-officer-count{margin-top:auto;padding-top:20px;display:flex;align-items:baseline;gap:8px}.public-officer-count strong{font-size:30px;color:var(--green-700)}.public-officer-count span{color:var(--muted)}.public-schedule-card>p{margin:auto 0;color:var(--muted);line-height:1.55}.public-privacy-note{margin:14px 0 0;color:var(--muted);font-size:13px}.public-empty-wide{grid-column:1/-1;padding:30px;text-align:center;border:1px dashed var(--line);border-radius:18px;color:var(--muted);background:#fff}
.public-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.public-stat-grid article{padding:23px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow)}.public-stat-grid span{display:block;color:var(--muted);font-weight:700}.public-stat-grid strong{display:block;margin:11px 0 3px;color:var(--green-700);font-size:38px}.public-stat-grid small{color:var(--muted)}
.public-announcement{padding:26px;display:grid;grid-template-columns:auto 1fr;gap:18px;border:1px solid #f0d384;border-radius:22px;background:linear-gradient(135deg,#fffdf5,#fff7d9);box-shadow:var(--shadow)}.public-announcement-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#ffd258;font-size:26px}.public-announcement span{color:#8a6100;margin-bottom:5px}.public-announcement h2{margin:0 0 8px}.public-announcement p{margin:0;color:#5e553d;line-height:1.65}
.public-about{padding:30px;display:grid;grid-template-columns:1.4fr 1fr;gap:30px;align-items:center;border:1px solid var(--line);border-radius:24px;background:#fff}.public-about>div:first-child>span{color:var(--green-700);margin-bottom:5px}.public-about h2{margin:0 0 8px}.public-about p{margin:0;color:var(--muted);line-height:1.65}.public-feature-list{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}.public-feature-list span{padding:9px 12px;border-radius:999px;color:#075a44;background:#e9f6f1;font-weight:750}
.public-footer{padding:24px max(24px,calc((100vw - 1320px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;color:#d0e4dd;background:#062d24}.public-footer div{display:grid}.public-footer strong{color:#fff}.public-footer span{margin-top:3px;font-size:13px}.public-footer small{color:#b4cec5}
@media(max-width:1100px){.public-hero{grid-template-columns:1fr}.public-schedule-grid,.public-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.public-login-card{width:min(620px,100%)}.public-about{grid-template-columns:1fr}.public-feature-list{justify-content:flex-start}}
@media(max-width:700px){.public-topbar{min-height:70px;padding:10px 16px}.public-brand strong{font-size:15px}.public-brand small{font-size:11px}.public-brand-mark{width:42px;height:42px;flex-basis:42px}.public-top-login{min-height:38px;padding:0 12px}.public-shell{width:min(100% - 24px,1320px);padding:18px 0 38px}.public-hero{padding:22px 16px;border-radius:23px}.public-hero-copy{padding:8px 3px}.public-hero h1{font-size:39px}.public-hero-copy>p{font-size:16px}.public-login-card{padding:22px 18px}.public-section{margin-top:30px}.public-section-heading{align-items:flex-start;flex-direction:column;gap:9px}.public-section-heading h2{font-size:25px}.public-status-card{grid-template-columns:auto 1fr}.public-status-progress{grid-column:1/-1;padding:14px 0 0;border-left:0;border-top:1px solid var(--line);text-align:left}.public-schedule-grid,.public-stat-grid{grid-template-columns:1fr}.public-about{padding:22px}.public-announcement{grid-template-columns:1fr}.public-footer{align-items:flex-start;flex-direction:column;padding:22px 18px}}

.public-setting-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px;border:1px solid var(--line);border-radius:16px;background:#f8fbfa}.public-setting-options .checkbox-label{padding:7px 9px;border-radius:10px;background:#fff}@media(max-width:900px){.public-setting-options{grid-template-columns:1fr 1fr}}@media(max-width:600px){.public-setting-options{grid-template-columns:1fr}}

/* v1.7.19 - Jimpitan QR scanner */
.contribution-methods{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}.contribution-method{min-height:86px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#f7faf9;text-align:left}.contribution-method strong,.contribution-method span{display:block}.contribution-method strong{margin-bottom:5px;color:var(--ink)}.contribution-method span{color:var(--muted);font-size:12px;line-height:1.45}.contribution-method.active{border-color:#98cab8;background:#eef9f5}.contribution-method-button{font:inherit;cursor:pointer}.contribution-method-button:hover:not(:disabled){border-color:#0d7b5c;background:#e9f7f2}.contribution-method-button:disabled{opacity:.55;cursor:not-allowed}.qr-scanner-card{width:min(760px,100%)}.qr-reader-frame{position:relative;width:min(100%,560px);aspect-ratio:4/3;margin:14px auto;overflow:hidden;border-radius:18px;background:#071a15}.qr-reader-frame video{width:100%;height:100%;display:block;object-fit:cover}.qr-reader-guide{position:absolute;left:50%;top:50%;width:min(64%,290px);aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid #f7c451;border-radius:20px;box-shadow:0 0 0 999px rgba(0,0,0,.2),inset 0 0 0 1px rgba(255,255,255,.45)}.qr-scanner-status{margin:12px 0 0}.qr-manual-scan{margin-top:18px;padding-top:16px;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;border-top:1px solid var(--line)}.qr-manual-scan label{margin:0}.qr-family-found{margin-bottom:18px;padding:18px;border:1px solid #a7d6c5;border-radius:16px;background:#f1fbf7}.qr-family-found h2{margin:8px 0 4px}.qr-family-found p{margin:0 0 5px}.qr-family-found small{color:var(--muted)}
@media(max-width:640px){.contribution-methods{grid-template-columns:1fr}.qr-manual-scan{grid-template-columns:1fr}.qr-reader-frame{aspect-ratio:1}.qr-scanner-card .modal-actions{align-items:stretch;flex-direction:column}.qr-scanner-card .modal-actions .btn{width:100%}}

/* v1.7.20 - Safari/iPhone QR compatibility */
.qr-camera-actions{flex-wrap:wrap}.qr-camera-actions .btn{min-width:132px}.qr-reader-frame video{background:#071a15;-webkit-transform:translateZ(0);transform:translateZ(0)}
@media(max-width:640px){.qr-camera-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}.qr-camera-actions .btn{min-width:0;width:100%}.qr-camera-actions [data-qr-start],.qr-camera-actions [data-qr-close]{grid-column:1/-1}}
