:root{color-scheme:light dark;--font-base:clamp(13.5px,1.35vw,15px);--font-small:clamp(12px,1.15vw,13.5px);--font-large:clamp(22px,5vw,34px);--radius:14px;--radius-sm:10px;--bg:#f8fafc;--text:#0f172a;--muted:#64748b;--surface:#fff;--surface-soft:#f1f5f9;--border:#e2e8f0;--primary:#2563eb;--success:#16a34a;--danger:#dc2626;--btn-download-border:#000;--btn-primary:#fff;--btn-text:#000;--tab-active-text:#fff;--shadow:0 10px 24px rgba(15,23,42,.07);--shadow-soft:0 3px 10px rgba(15,23,42,.05)}@media (prefers-color-scheme:dark){:root{--bg:#020617;--text:#e5e7eb;--muted:#94a3b8;--surface:#0f172a;--surface-soft:#111827;--border:#1e293b;--primary:#60a5fa;--btn-download-border:#fff;--btn-primary:#000;--btn-text:#fff;--tab-active-text:#000;--shadow:0 14px 32px rgba(0,0,0,.32);--shadow-soft:0 6px 16px rgba(0,0,0,.22)}}*{box-sizing:border-box}body,html{margin:0;padding:0;overflow-x:hidden;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}.page-wrap{width:100%;max-width:1320px;margin:0 auto;padding:14px 18px 40px}h1{margin:0 0 24px;font-size:var(--font-large);line-height:1.15;letter-spacing:-.03em}h1,h2{font-weight:800;color:var(--text)}h2{margin:0 0 12px;font-size:19px}.tab{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));grid-gap:9px;gap:9px;margin-bottom:18px}.tab button{width:100%;min-height:44px;padding:0 10px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:var(--font-base);font-weight:700;cursor:pointer;box-shadow:var(--shadow-soft);transition:.18s ease}.tab button:hover{transform:translateY(-1px);border-color:var(--primary)}.tab button.active{background:var(--primary);color:var(--tab-active-text);border-color:var(--primary)}label{display:block;margin-bottom:6px;color:var(--muted);font-size:var(--font-small);font-weight:700}input,select{width:100%;min-height:44px;padding:0 12px;margin-bottom:12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:var(--font-base);outline:none}.pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));grid-gap:8px;gap:8px;margin-top:8px}.pay-item{padding:10px 12px;min-height:48px;display:flex;align-items:center;border-radius:12px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-soft)}.pay-item>div{width:100%;gap:8px}.pay-item span{font-size:var(--font-base);line-height:1.3;font-weight:500}.summary{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px;gap:8px;margin:10px 0 14px}.summary-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:66px;padding:9px 6px;border-radius:12px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-soft);text-align:center}.summary-label{color:var(--muted);font-weight:500}.summary-label,.summary-value{font-size:var(--font-base);line-height:1.2}.sum-inc,.summary-value{font-weight:800}.sum-inc{color:var(--success)}.sum-exp{color:var(--danger);font-weight:800}.sum-net{color:var(--primary);font-weight:800}.table-container{overflow:auto;margin-top:10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-soft)}table{width:100%;min-width:680px;border-collapse:collapse;white-space:nowrap}td,th{padding:11px 12px;text-align:left;border-bottom:1px solid var(--border);font-size:var(--font-base)}th{font-weight:800;color:var(--text)}.table-container tr:nth-child(2n),th{background:var(--surface-soft)}.cashflow-body{max-height:calc(10 * 45px);overflow-y:auto}.cashflow-body th{position:-webkit-sticky;position:sticky;top:0;z-index:2;background:var(--surface-soft)!important}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:100px;min-height:28px;padding:3px 8px;border-radius:999px;color:#fff;font-size:var(--font-small);font-weight:700}.badge.income{background:var(--success)}.badge.expense{background:var(--danger)}.insight-card,.insight-summary{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-soft)}.insight-summary{padding:12px 14px;margin-bottom:16px}.insight-card{padding:12px 14px;margin-bottom:10px;font-size:var(--font-base)}.insight-row,.insight-row-final{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;grid-gap:10px;gap:10px;padding:9px 0;border-bottom:1px dashed var(--border)}.insight-row:last-child{border-bottom:none}.insight-label{flex:1 1;min-width:0}.insight-row span,.insight-row-final span{font-size:var(--font-base);line-height:1.35}.insight-row strong,.insight-row-final strong{font-size:var(--font-base);font-weight:800;white-space:nowrap}.insight-action{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:170px}.insight-link{border:none;background:none;cursor:pointer;font-size:var(--font-base);font-weight:700;padding:0;white-space:nowrap}.highlight-blue strong,.insight-link{color:var(--primary)}.final-balance strong{color:var(--success);font-size:20px}.insight-divider{margin:12px 0;border:none;border-top:2px solid var(--border)}.insight-value-stack{display:flex;flex-direction:column;align-items:flex-end;gap:3px}.insight-delta{display:inline-flex;align-items:center;justify-content:center;padding:2px 7px;border-radius:999px;font-size:11px;font-weight:800;line-height:1.4;white-space:nowrap}.insight-delta.good{color:var(--success);background:rgba(22,163,74,.1)}.insight-delta.bad{color:var(--danger);background:rgba(220,38,38,.1)}.insight-delta.neutral{color:var(--muted);background:var(--surface-soft)}.insight-delta{animation:deltaPop .45s ease-out;transition:color .2s ease,background .2s ease,transform .2s ease}@keyframes deltaPop{0%{opacity:0;transform:translateY(4px) scale(.96)}70%{opacity:1;transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion:reduce){.insight-delta{animation:none;transition:none}}.pagination{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:14px}.pagination button{min-width:82px;min-height:40px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer}.pagination button,.pagination span{font-size:var(--font-base);font-weight:700}.modal-overlay{position:fixed;inset:0;z-index:9999;display:flex;justify-content:center;align-items:center;padding:14px;background:rgba(2,6,23,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:modalOverlayIn .18s ease-out}.modal-box{width:100%;max-width:820px;max-height:85vh;overflow-y:auto;overflow-x:auto;padding:18px;border-radius:18px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);-webkit-overflow-scrolling:touch;animation:modalContentIn .22s cubic-bezier(.16,1,.3,1);transform-origin:center}.modal-header{margin-bottom:12px}.modal-title{font-size:16px;font-weight:800}.modal-section{margin-bottom:18px;font-size:var(--font-base)}.detail-table{width:100%;min-width:520px;margin-top:10px;border-collapse:collapse;white-space:nowrap}.detail-table td,.detail-table th{padding:10px 12px;border:1px solid var(--border);text-align:left;font-size:var(--font-base)}.detail-table th{background:var(--surface-soft)}.insight-detail-modal-overlay{align-items:center;justify-content:center;overflow-y:auto;padding:18px 12px}.insight-detail-modal-box{max-height:calc(100dvh - 36px);overflow-y:auto;overflow-x:auto;position:relative;transform-origin:center}.insight-detail-modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.insight-detail-modal-title-group{min-width:0}.insight-detail-modal-subtitle{margin:6px 0 0;color:var(--muted);font-size:var(--font-base);font-weight:700;line-height:1.5}.insight-detail-modal-close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:999px;border:1px solid var(--border);background:var(--surface-soft);color:var(--text);cursor:pointer;font-size:24px;font-weight:900;line-height:1}.insight-detail-modal-section{margin-bottom:0}.insight-detail-table{margin:10px auto 0;table-layout:auto}@media (max-width:640px){.insight-detail-modal-overlay{align-items:center;justify-content:center;padding:12px 8px}.insight-detail-modal-box{width:min(100%,calc(100vw - 16px));max-height:calc(100dvh - 24px);border-radius:18px;padding:16px}.insight-detail-modal-header{align-items:stretch;flex-direction:row;gap:12px}}.action-loader{position:fixed;inset:0;z-index:9999;display:flex;justify-content:center;align-items:flex-start;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .2s ease}.action-loader.show{opacity:1;pointer-events:auto}.loader-card{width:100%;max-width:1320px;min-height:100dvh;padding:28px 12px 40px;border:none;border-radius:0;background:transparent;box-shadow:none}.loader-row{display:grid;grid-gap:14px;gap:14px}.loader-icon,.loader-icon span,.loader-row:after,.loader-row:before,.loader-text{position:relative;overflow:hidden;border-radius:12px;background:var(--surface-soft);border:1px solid var(--border)}.loader-icon span,.loader-row:after,.loader-row:before,.loader-text{content:"";background-image:linear-gradient(90deg,transparent,rgba(148,163,184,.22),transparent);background-size:220% 100%;animation:skeletonShimmer 1.25s ease-in-out infinite}.loader-row:before{width:min(520px,72vw);height:18px;margin-top:4px}.loader-row:after,.loader-row:before{justify-self:center;border-radius:999px}.loader-row:after{width:min(440px,82vw);height:14px;margin-bottom:8px}.loader-text{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:9px;gap:9px;width:100%;height:auto;padding:0;border:none;background:transparent}.loader-text:after,.loader-text:before{content:"";height:44px;border-radius:12px;background:var(--surface-soft);border:1px solid var(--border);background-image:linear-gradient(90deg,transparent,rgba(148,163,184,.22),transparent);background-size:220% 100%;animation:skeletonShimmer 1.25s ease-in-out infinite}.loader-text:after,.loader-text:before{grid-column:span 2}.loader-icon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:8px;gap:8px;width:100%;padding:0;border:none;background:transparent}.loader-icon span{width:100%;height:48px;border-radius:12px}.loader-icon span:nth-child(3){grid-column:span 2;height:44px}.loader-card:after{content:"";display:block;width:100%;height:220px;margin-top:8px;border-radius:var(--radius);border:1px solid var(--border);background:linear-gradient(var(--surface-soft),var(--surface-soft)) 14px 16px /160px 14px no-repeat,linear-gradient(var(--surface-soft),var(--surface-soft)) 14px 50px /calc(100% - 28px) 44px no-repeat,linear-gradient(var(--surface-soft),var(--surface-soft)) 14px 104px /calc(100% - 28px) 44px no-repeat,linear-gradient(var(--surface-soft),var(--surface-soft)) 14px 158px /calc(100% - 28px) 44px no-repeat,var(--surface);box-shadow:var(--shadow-soft);animation:skeletonFade 1.25s ease-in-out infinite}.loader-card:after,.loader-icon,.loader-text{max-width:100%}.loader-row>.loader-text{color:transparent;font-size:0}@keyframes skeletonShimmer{0%{background-position:120% 0}to{background-position:-120% 0}}@keyframes skeletonFade{0%,to{opacity:.72}50%{opacity:1}}.hidden{display:none}@media (max-width:700px){.page-wrap{padding:12px 10px 34px}h1{margin-bottom:18px;line-height:1.15}h2{font-size:17px;margin-bottom:10px}.tab{grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}.tab button{min-height:40px;border-radius:10px}input,select{min-height:42px;margin-bottom:10px}.pay-grid{grid-template-columns:repeat(2,1fr);gap:7px}.pay-item{padding:9px 10px;min-height:46px}.summary{grid-template-columns:repeat(3,1fr);gap:6px}.summary-item{min-height:62px;padding:7px 4px}.insight-summary{padding:11px 12px}.insight-row,.insight-row-final{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px 0}.insight-action{min-width:148px;gap:6px}.final-balance strong{font-size:18px}.pagination{margin-top:12px}.modal-box{padding:14px}.detail-table{min-width:460px;margin-right:14px}.loader-card{padding:24px 10px 34px}.loader-text{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.loader-text:after,.loader-text:before{grid-column:span 1;height:40px}}@media (max-width:380px){.tab{grid-template-columns:repeat(2,1fr)}.insight-action{min-width:138px}}@media (max-width:700px){.modal-overlay{padding:16px;align-items:center;justify-content:center}.modal-box{width:calc(100vw - 32px);max-width:calc(100vw - 32px);margin:0 auto;padding:16px;overflow-x:auto;overflow-y:auto}.modal-title{white-space:normal;line-height:1.3}.detail-table{width:100%;min-width:0;table-layout:fixed;margin-right:0}.detail-table td,.detail-table th{padding:10px;white-space:normal;word-break:break-word}.detail-table td:first-child,.detail-table th:first-child{width:0;display:none}.detail-table td:nth-child(2),.detail-table th:nth-child(2){width:65%}.detail-table td:nth-child(3),.detail-table th:nth-child(3){width:35%;white-space:nowrap}}.pay-slider{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;padding-bottom:8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.pay-slider::-webkit-scrollbar{display:none}.pay-slide-page{flex:0 0 100%;min-width:100%;scroll-snap-align:center;scroll-snap-stop:always}.pagination button:disabled{opacity:.45;cursor:not-allowed;background:var(--surface-soft);color:var(--muted);box-shadow:none}.pagination button:disabled:hover{transform:none;border-color:var(--border)}.pay-slider{scroll-behavior:smooth;scroll-snap-type:x mandatory;scroll-snap-stop:always;overscroll-behavior-x:contain;touch-action:pan-x;padding-inline:1px}.pay-dots{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:14px}.pay-dots span{width:8px;height:8px;border-radius:999px;background:var(--border);transition:all .25s ease}.pay-dots span.active{width:22px;background:var(--primary)}.insight-slider{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-snap-stop:always;scroll-behavior:smooth;padding-bottom:8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.insight-slider::-webkit-scrollbar{display:none}.insight-slide-page{flex:0 0 100%;min-width:100%;scroll-snap-align:start;scroll-snap-stop:always}.insight-dots{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:12px}.insight-dots span{width:8px;height:8px;border-radius:999px;background:var(--border);transition:all .25s ease}.insight-dots span.active{width:22px;background:var(--primary)}.hero-header{text-align:center;padding-block:16px;margin-bottom:8px}.hero-eyebrow{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.hero-desc{max-width:520px;margin:8px auto 0;font-size:var(--font-small);line-height:1.45;color:var(--muted)}.searchbox-wrap{position:relative;width:100%}.searchbox-wrap input{width:100%;padding-right:44px}.searchbox-clear{position:absolute;top:50%;right:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border:none;border-radius:999px;background:transparent;color:var(--muted);font-size:22px;line-height:1;cursor:pointer;padding:0;margin:0;transform:translateY(calc(-50% - 6px));transition:background .18s ease,color .18s ease,transform .18s ease}.searchbox-clear:hover{background:var(--surface-soft);color:var(--text)}.searchbox-clear:active{transform:translateY(calc(-50% - 6px)) scale(.92)}.pay-item{cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.pay-item:hover{transform:translateY(-1px);border-color:var(--primary)}.pay-item:active{transform:scale(.985)}.resident-modal{width:100%;max-width:320px;padding:20px 18px;border-radius:18px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);animation:modalContentIn .22s cubic-bezier(.16,1,.3,1);transform-origin:center}.resident-house{margin-bottom:22px;color:var(--text);font-size:26px;font-weight:800;line-height:1.1;letter-spacing:-.03em}.resident-section{padding-top:14px;border-top:1px solid var(--border)}.resident-section+.resident-section{margin-top:14px}.resident-label{margin-bottom:4px;color:var(--muted);font-size:var(--font-small);font-weight:700}.resident-value{color:var(--text);font-size:var(--font-base);font-weight:800}@keyframes modalOverlayIn{0%{opacity:0}to{opacity:1}}@keyframes modalContentIn{0%{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}