@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap";:root{color:#26333d;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#f6f8f7;font-family:DM Sans,system-ui,sans-serif}body{min-width:320px;margin:0}button:focus-visible{outline-offset:2px;outline:3px solid #95c9ba}:root{--bg:#f6f8f7;--surface:#fff;--surface-secondary:#f7faf9;--surface-tertiary:#eef7f4;--surface-hover:#f2f8f5;--text-primary:#26333d;--text-secondary:#7d8b91;--text-muted:#9aa7a7;--text-heading:#435158;--text-inverse:#fff;--border:#e6ece9;--border-light:#f0f3f2;--border-input:#d7e6e1;--primary:#247b68;--primary-hover:#1d6656;--primary-light:#e5f3ee;--primary-lighter:#ebf6f1;--primary-foreground:#fff;--gold-bg:#fff3d9;--gold-fg:#bf8b32;--blue-bg:#e5f0fa;--blue-fg:#5c91ba;--rose-bg:#fbe7e3;--rose-fg:#cb8276;--danger:#c62828;--danger-light:#ffebee;--warning-bg:#fff2d7;--warning-fg:#b68737;--info-bg:#e3f2fd;--info-fg:#1976d2;--success-bg:#e8f5e9;--success-fg:#2e7d32;--sidebar-bg:#fff;--header-bg:#fff;--bottom-nav-bg:#fff;--nav-hover:#f2f7f5;--nav-active:#e5f3ee;--input-bg:#fff;--overlay-bg:#fff;--toast-bg:#26333d;--toast-fg:#fff;--profile-bg:#f6f9f8;--hero-bg:#247b68;--hero-text:#fff;--hero-sub:#c9e5dc;--hero-label:#b8dfd2;--sun-color:#eac477;--avatar-bg:#d9c6ae;--avatar-fg:#725840;--shadow:#183b3021;--shadow-heavy:#183b3040;--icon-color:#839093;--icon-hover:#247b68;--status-unpaid-bg:#fff3d9;--status-unpaid-fg:#bf8b32;--status-paid-bg:#ebf6f1;--status-paid-fg:#247b68;--status-pending-bg:#eef7fa;--status-pending-fg:#5c91ba;--status-important-bg:#ffebee;--status-important-fg:#c62828;--status-verified-bg:#ebf6f1;--status-verified-fg:#247b68;--status-needverif-bg:#fff3d9;--status-needverif-fg:#bf8b32;--status-available-bg:#e8f5e9;--status-available-fg:#2e7d32;--status-active-bg:#e8f5e9;--status-active-fg:#2e7d32;--backdrop-bg:#162c2554;--backdrop-modal:#162c2570;--notice-icon-bg:#fff1d6;--notice-icon-fg:#be8730;--date-bg:#eef7f4;--finance-bg:#f5fbf9;--upload-bg:#fff6e5;--upload-border:#ffd580;--logout-bg:#fee;--logout-hover:#ffcdd2;--empty-bg:#fff8f6;--empty-fg:#ad8881;--detail-hero-bg:#e7f3ef;--detail-hero-border:#d2e9e1;--detail-hero-text:#698781;--switch-off:#cdd8d5;--toggle-icon-bg:#fff3d9;--toggle-icon-fg:#bf8b32;--member-row-bg:#eef7f4;--member-row-fg:#52756d;--form-context-bg:#f5fbf9;--step-bg:#f7faf9;--step-border:#d7e6e1;--step-fg:#698781;--step-active-bg:#e5f3ee;--step-active-border:#a9d6c8;--focus-ring:#95c9ba;--link-color:#cce8df;--crumb-fg:#a0acad;--crumb-active:#37474d;--event-border:#f0f3f2;--arrow-color:#bcc7c6}.dark-mode{--bg:#0f1a18;--surface:#1c2a27;--surface-secondary:#243530;--surface-tertiary:#1f3530;--surface-hover:#243d36;--text-primary:#e8f0ed;--text-secondary:#aabbb6;--text-muted:#7d948c;--text-heading:#d4e4df;--text-inverse:#fff;--border:#30443e;--border-light:#2a3d37;--border-input:#30443e;--primary:#3d9b86;--primary-hover:#358a76;--primary-light:#243d36;--primary-lighter:#1f3530;--primary-foreground:#fff;--gold-bg:#3a3528;--gold-fg:#d4a24a;--blue-bg:#28353a;--blue-fg:#7baccc;--rose-bg:#3a2a28;--rose-fg:#d48c82;--danger:#ef5350;--danger-light:#3a1e1e;--warning-bg:#3a3028;--warning-fg:#d4a24a;--info-bg:#25303a;--info-fg:#64b5f6;--success-bg:#25302a;--success-fg:#5cba6a;--sidebar-bg:#1c2a27;--header-bg:#1c2a27;--bottom-nav-bg:#1c2a27;--nav-hover:#243d36;--nav-active:#243d36;--input-bg:#243530;--overlay-bg:#1c2a27;--toast-bg:#1a2a27;--toast-fg:#e8f0ed;--profile-bg:#243530;--hero-bg:#247b68;--hero-text:#fff;--hero-sub:#b8dfd2;--hero-label:#a0d4c8;--sun-color:#eac477;--avatar-bg:#4a3d2e;--avatar-fg:#d4c4a8;--shadow:#0003;--shadow-heavy:#00000059;--icon-color:#7d948c;--icon-hover:#3d9b86;--status-unpaid-bg:#3a3528;--status-unpaid-fg:#d4a24a;--status-paid-bg:#1f3530;--status-paid-fg:#3d9b86;--status-pending-bg:#25353a;--status-pending-fg:#7baccc;--status-important-bg:#3a1e1e;--status-important-fg:#ef5350;--status-verified-bg:#1f3530;--status-verified-fg:#3d9b86;--status-needverif-bg:#3a3528;--status-needverif-fg:#d4a24a;--status-available-bg:#25302a;--status-available-fg:#5cba6a;--status-active-bg:#25302a;--status-active-fg:#5cba6a;--backdrop-bg:#00000073;--backdrop-modal:#00000080;--notice-icon-bg:#293f38;--notice-icon-fg:#d4a24a;--date-bg:#1f3530;--finance-bg:#1f3530;--upload-bg:#2a2a20;--upload-border:#4a4520;--logout-bg:#3a1e1e;--logout-hover:#4a2828;--empty-bg:#2a1e1e;--empty-fg:#c48a8a;--detail-hero-bg:#1c2f2a;--detail-hero-border:#2a4a40;--detail-hero-text:#8aada5;--switch-off:#4a6058;--toggle-icon-bg:#293f38;--toggle-icon-fg:#d4a24a;--member-row-bg:#1f3530;--member-row-fg:#7dad9a;--form-context-bg:#1f3530;--step-bg:#243530;--step-border:#30443e;--step-fg:#8aada5;--step-active-bg:#243d36;--step-active-border:#3d9b86;--focus-ring:#3d9b86;--link-color:#a0d4c8;--crumb-fg:#7d948c;--crumb-active:#c4d6d1;--event-border:#2a3d37;--arrow-color:#5a7068}*{box-sizing:border-box}body{min-width:320px;color:var(--text-primary);background:var(--bg);margin:0;font-family:DM Sans,system-ui,sans-serif}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}h1,h2,h3,p{margin:0}.app-shell{background:var(--bg);min-height:100vh;display:flex}.sidebar{background:var(--sidebar-bg);border-right:1px solid var(--border);z-index:4;flex-direction:column;width:250px;padding:25px 16px 17px;display:flex;position:fixed;inset:0 auto 0 0}.brand{padding:0 9px 24px;display:block}.brand-logo{object-fit:contain;object-position:left center;border-radius:10px;width:100%;height:112px;margin-bottom:9px;display:block}.brand-caption b{color:var(--text-primary);font-size:12px}.brand-caption small{color:var(--text-muted);margin-top:3px;font-size:10px;display:block}.brand b span{color:var(--primary)}.icon{color:var(--icon-color);background:0 0;border:0;border-radius:8px;place-items:center;padding:7px;display:grid}.icon:hover{background:var(--nav-hover);color:var(--icon-hover)}.profile{background:var(--profile-bg);border-radius:12px;gap:10px;margin-bottom:27px;padding:13px 11px}.profile b{color:var(--text-primary);font-size:12px}.profile small{color:var(--text-muted);font-size:10px;display:block}.avatar{background:var(--avatar-bg);width:35px;height:35px;color:var(--avatar-fg);border-radius:50%;flex:none;place-items:center;font-size:11px;font-weight:700;display:grid}.avatar.small{width:32px;height:32px}nav{flex-direction:column;gap:4px;display:flex}.caption{letter-spacing:1.4px;color:var(--text-muted);padding:0 12px 8px;font-size:9px;font-weight:700}.caption.other{margin-top:22px}.nav{color:var(--icon-color);text-align:left;background:0 0;border:0;border-radius:9px;align-items:center;gap:12px;padding:11px 12px;font-size:12px;display:flex}.nav:hover,.nav.active{background:var(--nav-active);color:var(--primary)}.nav.active{font-weight:700}.safe{border-top:1px solid var(--border);color:var(--text-muted);gap:8px;margin-top:auto;padding:17px 10px 0;font-size:10px;display:flex}.logout-btn{background:var(--logout-bg);color:var(--danger);border:0;border-radius:8px;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px 12px;font-size:11px;font-weight:600;display:flex}.logout-btn:hover{background:var(--logout-hover)}main{background:var(--bg);flex:1;min-width:0;margin-left:250px}header{background:var(--header-bg);border-bottom:1px solid var(--border);z-index:6;justify-content:space-between;align-items:center;height:73px;padding:0 clamp(20px,4vw,57px);display:flex;position:sticky;top:0}.crumb{color:var(--crumb-fg);align-items:center;gap:8px;font-size:12px;display:flex}.crumb b{color:var(--crumb-active)}.actions{align-items:center;gap:14px;display:flex}.dot{position:relative}.dot:after{content:"";background:#d99c4a;border-radius:50%;width:5px;height:5px;position:absolute;top:5px;right:6px}.page{max-width:1175px;margin:auto;padding:38px clamp(20px,4vw,58px) 20px}.welcome{justify-content:space-between;align-items:flex-start;display:flex}.eyebrow{letter-spacing:1.35px;color:var(--text-muted);margin-bottom:11px;font-size:10px;font-weight:700}.welcome h1{letter-spacing:-1px;color:var(--text-primary);margin-bottom:8px;font-size:30px}.muted{color:var(--text-secondary);font-size:12px;line-height:1.55}.online{color:var(--primary);background:var(--primary-lighter);border-radius:30px;padding:8px 12px;font-size:11px}.hero{background:var(--hero-bg);min-height:166px;color:var(--hero-text);border-radius:15px;justify-content:space-between;margin-top:29px;padding:27px 34px;display:flex;position:relative;overflow:hidden}.hero label{letter-spacing:1.4px;color:var(--hero-label);font-size:9px;font-weight:700}.hero h2{color:var(--hero-text);margin:8px 0 6px;font-size:22px}.hero p{color:var(--hero-sub);font-size:12px}.text,.link,.role{color:var(--link-color);background:0 0;border:0;align-items:center;gap:3px;margin-top:19px;padding:0;font-size:11px;font-weight:700;display:flex}.sun{background:var(--sun-color);border-radius:50%;width:86px;height:86px;margin:0 60px 30px 0}.heading{justify-content:space-between;align-items:end;margin:32px 0 15px;display:flex}.heading h2,.panel h2{color:var(--text-heading);font-size:16px}.heading .muted{margin-top:4px;font-size:11px}.link{color:var(--primary);margin:0}.cards{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:17px 18px}.card{min-height:170px}.card-icon{border-radius:9px;place-items:center;width:34px;height:34px;margin-bottom:13px;display:grid}.card-icon svg{width:17px}.gold{background:var(--gold-bg);color:var(--gold-fg)}.blue{background:var(--blue-bg);color:var(--blue-fg)}.rose{background:var(--rose-bg);color:var(--rose-fg)}.card p,.card small{color:var(--text-secondary);font-size:11px}.card h3{color:var(--text-primary);margin:6px 0 3px;font-size:18px}.card small{color:var(--text-muted);font-size:10px}.card button,.outline{color:var(--primary);background:0 0;border:0;align-items:center;gap:3px;margin-top:16px;padding:0;font-size:10px;font-weight:700;display:flex}.columns{grid-template-columns:1.1fr 1fr;gap:14px;margin-top:31px;display:grid}.panel-title{justify-content:space-between;align-items:flex-start;margin-bottom:15px;display:flex}.panel-title .muted{margin-top:4px;font-size:11px}.event,.notice{border-top:1px solid var(--event-border);gap:13px;padding:13px 0;display:flex}.date{background:var(--date-bg);text-align:center;border-radius:7px;flex:none;width:37px;padding:4px}.date b,.date small{color:var(--primary);display:block}.date small{font-size:8px}.event>div:nth-child(2),.notice>div:last-child{flex:1}.event b,.notice b{color:var(--text-heading);font-size:11px;display:block}.event .muted,.notice .muted{margin-top:3px;font-size:10px}.arrow{color:var(--arrow-color);margin-left:auto}.outline{border:1px solid var(--border-input);width:100%;color:var(--primary);background:0 0;justify-content:center;margin-top:9px;padding:9px}.outline:hover{background:var(--primary-light)}.notice-icon{background:var(--notice-icon-bg);color:var(--notice-icon-fg);border-radius:8px;flex:none;place-items:center;width:30px;height:30px;display:grid}.notice label{background:var(--warning-bg);color:var(--warning-fg);border-radius:3px;padding:3px 5px;font-size:8px}.notice small{color:var(--text-muted);margin-top:7px;font-size:9px;display:block}footer{color:var(--text-muted);justify-content:space-between;padding-top:30px;font-size:10px;display:flex}.role{color:var(--primary);margin:0}.bottom{display:none}.bottom .nav{flex-direction:column;gap:3px;padding:5px 10px;font-size:9px;display:flex}.overlay-card{z-index:8;background:var(--overlay-bg);border:1px solid var(--border);width:min(380px,100vw - 32px);box-shadow:0 18px 45px var(--shadow);border-radius:13px;padding:16px;position:fixed;top:68px;right:clamp(16px,4vw,57px)}.overlay-head{color:var(--text-primary);justify-content:space-between;align-items:center;margin-bottom:12px;font-size:13px;display:flex}.search-input{border:1px solid var(--border-input);width:100%;color:var(--text-primary);background:var(--input-bg);font:inherit;border-radius:8px;margin-bottom:8px;padding:10px 11px;font-size:12px}.search-input:focus{outline:2px solid var(--focus-ring)}.search-result{background:var(--overlay-bg);width:100%;color:var(--text-primary);text-align:left;border:0;border-radius:7px;align-items:center;gap:9px;padding:10px 4px;font-size:11px;display:flex}.search-result:hover{color:var(--primary);background:var(--surface-hover)}.search-result span{flex:1}.notification-item{border-top:1px solid var(--border-light);color:var(--primary);gap:10px;padding:12px 0;display:flex}.notification-item b{color:var(--text-heading);font-size:11px;display:block}.notification-item .muted{margin-top:3px;font-size:10px}.notification-panel .outline{margin-top:7px}.notification-empty{text-align:center;color:var(--text-muted);padding:20px 0}.notification-empty p{color:var(--text-primary);margin-top:8px;font-size:12px}.notification-empty small{color:var(--text-muted);font-size:10px}.toast{z-index:10;background:var(--toast-bg);color:var(--toast-fg);box-shadow:0 8px 25px var(--shadow);border-radius:9px;padding:11px 15px;font-size:11px;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.profile-menu-wrap{position:relative}.avatar-button{border:0;padding:0;overflow:hidden}.avatar-button img,.profile-avatar-large img{object-fit:cover;width:100%;height:100%}.profile-dropdown{background:var(--surface);border:1px solid var(--border);width:170px;box-shadow:0 12px 30px var(--shadow);border-radius:10px;padding:5px;position:absolute;top:42px;right:0}.profile-dropdown button{width:100%;color:var(--text-primary);text-align:left;background:0 0;border:0;border-radius:7px;align-items:center;gap:8px;padding:9px 8px;font-size:11px;display:flex}.profile-dropdown button:hover{background:var(--surface-hover);color:var(--primary)}.profile-dropdown .menu-danger{color:var(--danger)}.profile-dropdown .menu-danger:hover{background:var(--danger-light)}.profile-dropdown-header{border-bottom:1px solid var(--border);align-items:center;gap:9px;margin-bottom:5px;padding:8px 8px 11px;display:flex}.profile-dropdown-header b{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;display:block;overflow:hidden}.profile-dropdown-header small{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:9px;display:block;overflow:hidden}.profile-dropdown-header>span:last-child{min-width:0}.profile-dropdown-header .avatar{flex:none;width:34px;height:34px}.profile-dropdown-header .avatar img{object-fit:cover;width:100%;height:100%}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px;display:grid}.profile-card{min-height:0}.password-card{grid-column:1/-1}.profile-preview{align-items:center;gap:16px;padding-top:5px;display:flex}.profile-avatar-large{background:var(--avatar-bg);width:72px;height:72px;color:var(--avatar-fg);border-radius:50%;place-items:center;font-size:20px;font-weight:700;display:grid;position:relative;overflow:visible}.photo-upload{border:2px solid var(--surface);background:var(--primary);width:25px;height:25px;color:var(--primary-foreground);cursor:pointer;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:0;right:-3px}.photo-upload input{display:none}.theme-toggle{border:1px solid var(--border);background:var(--bg);text-align:left;width:100%;color:var(--text-primary);border-radius:10px;align-items:center;gap:11px;padding:12px;display:flex}.theme-toggle-icon{background:var(--toggle-icon-bg);width:30px;height:30px;color:var(--toggle-icon-fg);border-radius:8px;place-items:center;display:grid}.theme-toggle b,.theme-toggle small{display:block}.theme-toggle b{font-size:11px}.theme-toggle small{color:var(--text-secondary);margin-top:3px;font-size:10px}.theme-toggle>span:nth-child(2){flex:1}.switch{background:var(--switch-off);border-radius:20px;width:34px;height:20px;padding:3px}.switch i{background:#fff;border-radius:50%;width:14px;height:14px;transition:all .2s;display:block}.switch.on{background:var(--primary)}.switch.on i{transform:translate(14px)}.settings-form{max-width:520px}.settings-form .primary{align-self:flex-start;margin-top:2px}.detail-hero{background:var(--detail-hero-bg);border:1px solid var(--detail-hero-border);color:var(--primary);border-radius:15px;align-items:center;gap:17px;margin-top:29px;padding:25px 28px;display:flex}.detail-icon{background:var(--surface);border-radius:13px;place-items:center;width:48px;height:48px;display:grid}.detail-icon svg{width:23px}.detail-hero h2{color:var(--text-primary);margin-bottom:5px;font-size:19px}.detail-hero p{color:var(--detail-hero-text);font-size:12px}.module-panel{margin-top:20px}.module-list{max-height:400px;overflow-y:auto}.module-row{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:12px 0;display:flex}.module-row b{color:var(--text-heading);flex:1;font-size:12px}.module-row .muted{font-size:10px}.status{border-radius:12px;padding:4px 8px;font-size:9px;font-weight:600}.status-belum-dibayar{background:var(--status-unpaid-bg);color:var(--status-unpaid-fg)}.status-lunas,.status-selesai{background:var(--status-paid-bg);color:var(--status-paid-fg)}.status-diproses{background:var(--status-pending-bg);color:var(--status-pending-fg)}.status-penting{background:var(--status-important-bg);color:var(--status-important-fg)}.status-info{background:var(--info-bg);color:var(--info-fg)}.status-terverifikasi{background:var(--status-verified-bg);color:var(--status-verified-fg)}.status-perlu-verifikasi{background:var(--status-needverif-bg);color:var(--status-needverif-fg)}.status-tersedia{background:var(--status-available-bg);color:var(--status-available-fg)}.status-aktif{background:var(--status-active-bg);color:var(--status-active-fg)}.status-pemasukan{background:var(--success-bg);color:var(--success-fg)}.status-pengeluaran{background:var(--danger-light);color:var(--danger)}.status-terjadwal{background:var(--info-bg);color:var(--info-fg)}.finance-summary{background:var(--finance-bg);border-radius:10px;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px;padding:15px;display:grid}.finance-summary small{color:var(--text-secondary);font-size:10px}.finance-summary b{color:var(--text-primary);font-size:15px}.finance-summary .positive{color:var(--primary)}.finance-summary .negative{color:var(--danger)}.upload-box{background:var(--upload-bg);border:1px dashed var(--upload-border);border-radius:10px;align-items:center;gap:10px;margin-bottom:15px;padding:14px;display:flex}.upload-box label{color:var(--warning-fg);align-items:center;gap:6px;font-size:11px;font-weight:600;display:flex}.upload-box input[type=file]{flex:1}.upload-box .primary{white-space:nowrap}.upload-box small{color:var(--text-muted);font-size:9px}.add-row{gap:10px;margin-top:15px;display:flex}.add-row input{border:1px solid var(--border-input);background:var(--input-bg);color:var(--text-primary);border-radius:8px;flex:1;padding:9px;font-size:11px}.primary{background:var(--primary);color:var(--primary-foreground);border:0;border-radius:8px;margin-top:12px;padding:10px 15px;font-size:11px;font-weight:700}.primary:hover{background:var(--primary-hover)}.row-actions{gap:2px;display:flex}.danger{color:var(--danger)}.danger:hover{color:var(--danger);background:var(--danger-light)}.resident-management{margin-top:20px}.resident-summary-row{align-items:center;gap:14px;min-width:0;margin-bottom:10px;display:flex}.resident-summary{background:var(--detail-hero-bg);border:1px solid var(--detail-hero-border);color:var(--primary);border-radius:12px;flex:auto;align-items:center;gap:20px;min-width:0;margin-bottom:0;padding:13px 16px;font-size:12px;display:flex}.resident-summary span{color:var(--text-primary);white-space:nowrap;align-items:center;gap:6px;min-width:0;display:flex}.resident-summary span:nth-child(2){text-overflow:ellipsis;overflow:hidden}.summary-add{white-space:nowrap;align-items:center;gap:5px;width:auto;margin:0;padding:10px 14px;display:flex}.summary-add-label-mobile{display:none}.resident-list{margin-top:0}.resident-list-toolbar{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:8px;display:flex}.resident-search{border:1px solid var(--border-input);background:var(--input-bg);border-radius:9px;flex:1;align-items:center;gap:7px;min-width:180px;max-width:360px;padding:0 10px;display:flex;position:relative}.resident-search>svg{color:var(--text-muted);flex:none}.resident-search input{min-width:0;color:var(--text-primary);font:inherit;background:0 0;border:0;flex:1;padding:9px 0;font-size:11px}.resident-search input:focus{outline:none}.resident-search input::placeholder{color:var(--text-muted)}.resident-search:focus-within{border-color:var(--focus-ring);box-shadow:0 0 0 3px var(--primary-light)}.resident-search .icon{color:var(--text-muted);padding:4px}.resident-search .icon:hover{background:var(--nav-hover);color:var(--primary)}.household-card{border-top:1px solid var(--border-light);padding:15px 0}.household-heading,.head-row{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.household-heading b,.household-heading div b,.head-row b{color:var(--text-heading);font-size:12px}.household-heading .muted,.head-row .muted{margin-top:4px;font-size:10px}.house-menu-wrap{position:relative}.house-menu{z-index:5;background:var(--surface);border:1px solid var(--border);width:165px;box-shadow:0 12px 30px var(--shadow);border-radius:9px;padding:5px;position:absolute;top:34px;right:0}.house-menu button{width:100%;color:var(--text-primary);text-align:left;background:0 0;border:0;border-radius:6px;align-items:center;gap:8px;padding:9px 8px;font-size:10px;display:flex}.house-menu button:hover{background:var(--surface-hover);color:var(--primary)}.house-menu .menu-danger{color:var(--danger)}.house-menu .menu-danger:hover{background:var(--danger-light);color:var(--danger)}.head-row{background:var(--surface-secondary);border-radius:8px;align-items:center;margin-top:12px;padding:10px 12px}.empty-row{color:var(--empty-fg);background:var(--empty-bg);border-radius:8px;margin-top:12px;padding:10px;font-size:11px}.members{flex-direction:column;gap:6px;margin-top:10px;display:flex}.members>small{font-size:10px}.member-row{background:var(--member-row-bg);color:var(--member-row-fg);border-radius:8px;align-items:center;gap:8px;padding:8px 9px;font-size:10px;display:flex}.member-row>span{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.member-row b{color:var(--text-heading);font-size:11px}.member-row small{color:var(--text-secondary);font-size:10px}.member-row .icon{padding:5px}.person-menu{top:30px;right:0}.resident-empty{text-align:center;color:var(--text-muted);padding:30px 0}.resident-empty p{color:var(--text-primary);margin-top:8px;font-size:12px}.resident-empty small{font-size:10px}.modal-backdrop{z-index:20;background:var(--backdrop-modal);place-items:center;padding:20px;display:grid;position:fixed;inset:0;overflow-y:auto}.resident-modal{background:var(--surface);border:1px solid var(--border);width:min(540px,100%);max-height:calc(100vh - 40px);box-shadow:0 24px 70px var(--shadow-heavy);border-radius:16px;padding:22px;overflow-y:auto}.modal-title{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.modal-title .eyebrow{margin-bottom:7px}.modal-title h2{color:var(--text-primary);margin-bottom:5px;font-size:20px}.modal-title .muted{color:var(--text-secondary)}.stepper{border-bottom:1px solid var(--border);gap:5px;margin:20px 0 18px;padding-bottom:12px;display:flex}.step{border:1px solid var(--step-border);background:var(--step-bg);color:var(--step-fg);border-radius:7px;padding:8px 10px;font-size:10px}.step.active{background:var(--step-active-bg);border-color:var(--step-active-border);color:var(--primary);font-weight:700}.step.disabled{opacity:.5;cursor:not-allowed}.data-form{flex-direction:column;gap:12px;display:flex}.data-form label{color:var(--text-primary);flex-direction:column;gap:6px;font-size:11px;font-weight:600;display:flex}.data-form input,.data-form select{border:1px solid var(--border-input);color:var(--text-primary);font:inherit;background:var(--input-bg);border-radius:8px;padding:10px;font-size:12px}.data-form input:focus,.data-form select:focus{outline:2px solid var(--focus-ring)}.data-form .primary{align-self:flex-start;align-items:center;gap:5px;display:flex}.form-help{color:var(--text-muted);font-size:10px;line-height:1.5}.form-context{background:var(--form-context-bg);color:var(--primary);border-radius:8px;padding:10px;font-size:11px;font-weight:700}.form-actions{align-items:center;gap:9px;display:flex}.form-actions>.primary{flex:1;margin-top:0}.form-actions .form-submit{flex:1}.finish-button{border-radius:8px;flex:none;width:auto;margin-top:0;padding:10px 15px}.access-denied{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:40px 20px;display:flex}.access-denied h2{color:var(--text-primary)}.access-denied .muted{color:var(--text-secondary)}.app-loading{min-height:100vh;color:var(--text-secondary);background:var(--bg);justify-content:center;align-items:center;font-size:14px;display:flex}.backdrop,.menu{display:none}.success{color:var(--primary);width:19px}@media (width<=800px){.sidebar{box-shadow:none;transition:all .25s;top:62px;transform:translate(-100%)}.sidebar-open{box-shadow:10px 0 35px var(--shadow-heavy);transform:translate(0)}.menu,.backdrop{display:grid}.backdrop{background:var(--backdrop-bg);z-index:3;border:0;position:fixed;inset:0}.menu{margin-right:auto}main{margin-left:0}header{height:62px;padding:0 16px}.page{padding:28px 16px 76px}.welcome{display:block}.online{margin-top:14px;display:inline-block}.hero{min-height:180px;padding:23px 21px}.hero h2{max-width:245px;font-size:18px}.sun{opacity:.65;margin-right:15px}.cards,.columns{grid-template-columns:1fr;gap:10px}.card{min-height:0;padding:14px 16px}.heading{margin-top:23px}.bottom{z-index:2;background:var(--bottom-nav-bg);border-top:1px solid var(--border);flex-direction:row;justify-content:space-around;height:64px;padding:5px 8px;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom .nav{flex-direction:column;gap:3px;padding:5px 10px;font-size:9px;display:flex}}@media (width<=600px){html,body,#root{max-width:100%;overflow-x:clip}.settings-grid{grid-template-columns:1fr}.password-card{grid-column:auto}.profile-preview{align-items:flex-start}.profile-dropdown{right:-4px}.settings-form .primary{justify-content:center;width:100%}.resident-summary-row{align-items:stretch;gap:8px;width:100%}.resident-summary{flex:1;gap:10px;padding:11px 12px}.resident-summary span{gap:4px;font-size:11px}.resident-summary span:nth-child(2){flex:auto}.summary-add{flex:none;padding:9px 10px;font-size:10px}.summary-add-label{display:none}.summary-add-label-mobile{display:inline}.resident-modal{border-radius:13px;padding:17px}.stepper{overflow-x:auto}.step{white-space:nowrap}.household-heading,.head-row{gap:8px}.head-row{align-items:center;display:flex}.head-row>div:first-child{flex:1;min-width:0}.head-row .house-menu-wrap{flex:none}.form-actions{flex-direction:row;align-items:center}.form-actions .form-submit{flex:1;justify-content:center;width:auto;min-width:0}.form-actions .finish-button{flex:none;justify-content:center;width:auto}}.iuran-page{flex-direction:column;gap:16px;display:flex}.iuran-summary{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.iuran-summary-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:14px 16px;display:flex}.iuran-summary-card small{color:var(--text-secondary);font-size:11px;display:block}.iuran-summary-card b{margin-top:2px;font-size:17px;display:block}.iuran-summary-icon{border-radius:10px;flex:none;place-items:center;width:38px;height:38px;display:grid}.iuran-summary-icon.gold{background:var(--card-gold-bg,#fff3e0);color:#b26a00}.iuran-summary-icon.blue{background:var(--card-blue-bg,#e3f2fd);color:#0b6ec2}.iuran-summary-icon.green{background:var(--card-green-bg,#e6f4ea);color:#1e7e46}.iuran-summary-icon.violet{background:var(--card-violet-bg,#f3e8fd);color:#7b2fbe}.dark-mode .iuran-summary-icon.gold{color:#ffc266;background:#3d2e12}.dark-mode .iuran-summary-icon.blue{color:#7cc4ff;background:#123043}.dark-mode .iuran-summary-icon.green{color:#7ed6a0;background:#143525}.dark-mode .iuran-summary-icon.violet{color:#cf9bff;background:#2a1b3d}.iuran-publish,.iuran-history,.iuran-bills,.iuran-payment-history{padding:16px}.iuran-form{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));align-items:end;gap:12px;margin-top:12px;display:grid}.iuran-form label{color:var(--text-secondary);flex-direction:column;gap:6px;font-size:12px;display:flex}.iuran-form select,.iuran-form input{border:1px solid var(--border);background:var(--surface-secondary);color:var(--text-primary);border-radius:9px;width:100%;padding:9px 10px;font-size:14px}.iuran-publish-btn{justify-content:center;height:40px}.iuran-kategori{padding:16px}.iuran-kategori .iuran-form{grid-template-columns:1fr 2fr auto}.iuran-kategori-list{border:1px solid var(--border);border-radius:12px;margin-top:14px;overflow:hidden}.iuran-kategori-row{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;gap:12px;padding:11px 14px;display:flex}.iuran-kategori-row:last-child{border-bottom:0}.iuran-kategori-info b{font-size:14px;display:block}.iuran-kategori-info p{margin-top:2px;font-size:12px}.iuran-kategori-actions{gap:6px;display:flex}.iuran-kategori-actions .icon{color:var(--text-secondary)}.iuran-kategori-actions .icon:hover{color:var(--text-primary)}.iuran-kategori-actions .icon.danger:hover{color:#d93025}.iuran-search{background:var(--surface-secondary);border:1px solid var(--border);border-radius:9px;align-items:center;gap:8px;margin-bottom:12px;padding:8px 10px;display:flex}.iuran-search input{color:var(--text-primary);background:0 0;border:0;outline:0;flex:1;font-size:13px}.iuran-search .icon{flex:none}.iuran-table-wrap{overflow-x:auto}.iuran-table{border-collapse:collapse;width:100%;min-width:540px}.iuran-table th,.iuran-table td{text-align:left;border-bottom:1px solid var(--border-light);padding:10px 12px;font-size:13px}.iuran-table th{color:var(--text-secondary);font-size:12px;font-weight:600}.iuran-table td .status{white-space:nowrap}.iuran-bill-table .col-aksi{text-align:right;white-space:nowrap;width:56px}.iuran-bill-table td.col-aksi .house-menu-wrap{display:inline-block}.iuran-bill-table td.col-aksi .house-menu{left:auto;right:0}.iuran-bill-table .status-menunggu{white-space:nowrap}.iuran-bill-row{border-bottom:1px solid var(--border-light);align-items:center;gap:12px;padding:12px 0;display:flex}.iuran-bill-row:last-of-type{border-bottom:0}.iuran-bill-icon{background:var(--surface-secondary);width:40px;height:40px;color:var(--primary);border-radius:10px;flex:none;place-items:center;display:grid}.iuran-bill-info{flex:1;min-width:0}.iuran-bill-info b{display:block}.iuran-bill-info p{margin:2px 0 0;font-size:12px}.iuran-bill-amount{text-align:right}.iuran-bill-amount b{font-size:15px;display:block}.iuran-bill-amount .status{margin-top:4px}.iuran-bill-row.paid{opacity:.72}.iuran-bill-row .primary{flex:none;padding:8px 14px}.iuran-deposit-note{background:var(--card-green-bg,#e6f4ea);color:#1e7e46;border-radius:9px;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;font-size:12px;display:flex}.dark-mode .iuran-deposit-note{color:#7ed6a0;background:#143525}.iuran-modal{border:1px solid var(--border);background:var(--surface);width:min(460px,100%);max-height:calc(100vh - 40px);box-shadow:0 24px 70px var(--shadow-heavy);border-radius:14px;padding:20px;overflow-y:auto}.iuran-modal .data-form input,.iuran-modal .data-form textarea{box-sizing:border-box;width:100%}.iuran-modal .form-actions{flex-wrap:wrap;justify-content:flex-end}.iuran-modal .form-actions>button{flex:0 auto;width:auto;padding-inline:14px}.iuran-modal-bill{background:var(--surface-secondary);border:1px solid var(--border);border-radius:10px;justify-content:space-between;align-items:center;gap:10px;margin:14px 0;padding:12px 14px;display:flex}.iuran-modal-bill small{color:var(--text-secondary);font-size:12px}.iuran-modal-bill b{font-size:18px}.iuran-metode{grid-template-columns:1fr 1fr;gap:8px;display:grid}.iuran-metode button{border:1px solid var(--border);background:var(--surface-secondary);color:var(--text-primary);cursor:pointer;border-radius:9px;justify-content:center;align-items:center;gap:7px;padding:10px;font-size:13px;display:flex}.iuran-metode button.active{border-color:var(--primary);background:var(--primary);color:#fff}.iuran-metode button:not(.active):hover{border-color:var(--primary)}.iuran-proof .upload-box{margin-top:2px}.iuran-proof-name{color:var(--text-secondary);align-items:center;gap:5px;margin-top:6px;display:flex}.iuran-proof-preview{border:1px solid var(--border);background:var(--surface-secondary);min-height:220px;color:var(--text-secondary);border-radius:10px;place-items:center;display:grid;overflow:hidden}.iuran-proof-preview img,.iuran-proof-preview iframe{object-fit:contain;border:0;width:100%;height:min(55vh,430px);display:block}.iuran-overpay-note{color:#b26a00;align-items:center;gap:6px;display:flex}.dark-mode .iuran-overpay-note{color:#ffc266}.iuran-help{align-items:center;gap:6px;display:flex}.count-pill{background:var(--primary);color:#fff;border-radius:999px;padding:2px 10px;font-size:12px}.status-belum{background:var(--status-unpaid-bg);color:var(--status-unpaid-fg)}.status-menunggu{background:var(--status-needverif-bg);color:var(--status-needverif-fg)}.status-terlambat{background:var(--status-overdue-bg,#fdecea);color:var(--status-overdue-fg,#b3261e)}.dark-mode .status-terlambat{color:#ff8a80;background:#3d1d1c}