:root{--font-display: "Aeonik Pro", "Sora", "Inter", sans-serif;--font-body: "Inter", sans-serif;--bg: #ffffff;--bg-alt: #f4f4f4;--surface: #ffffff;--surface-strong: #f7f8fb;--text: #191c1f;--muted: #505a63;--border: #c9c9cd;--blue: #494fdf;--teal: #00a87e;--orange: #ec7e00;--radius: 20px;--radius-sm: 12px;--pill: 9999px}:root[data-theme=dark]{--bg: #191c1f;--bg-alt: #252b31;--surface: #1f2429;--surface-strong: #2a3037;--text: #f5f7fa;--muted: #c6ccd3;--border: #3a424b;--blue: #7379ff;--teal: #24c59d;--orange: #ff9f3d}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{font-family:var(--font-body);background:radial-gradient(circle at 8% -10%,color-mix(in srgb,var(--blue) 16%,transparent),transparent 36%),radial-gradient(circle at 86% 4%,color-mix(in srgb,var(--teal) 16%,transparent),transparent 28%),var(--bg);color:var(--text)}.app{max-width:1400px;margin:0 auto;padding:22px 16px 40px}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:20px}.landing-shell{max-width:1180px;margin:0 auto;padding:18px 14px 40px;display:grid;gap:14px}.landing-header{display:flex;justify-content:space-between;align-items:center;gap:10px}.landing-actions{display:flex;gap:8px;align-items:center}.landing-hero{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:20px;display:grid;gap:12px;grid-template-columns:1.4fr 1fr}.landing-copy h1{margin:0;font-family:var(--font-display);font-size:clamp(2rem,4.8vw,4rem);line-height:.94;letter-spacing:-.04em}.landing-copy p{margin:10px 0 0;color:var(--muted);font-size:1.05rem;line-height:1.48;max-width:52ch}.landing-cta-row{margin-top:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.landing-highlight{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--surface-strong) 86%,transparent);padding:14px}.landing-highlight h3{margin:0;font-family:var(--font-display)}.landing-highlight ul{margin:10px 0 0;padding-left:18px;display:grid;gap:8px;color:var(--muted)}.landing-grid{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}.landing-card{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);padding:14px}.landing-card h3{margin:0 0 8px;font-family:var(--font-display)}.landing-card p{margin:0;color:var(--muted);line-height:1.45}.landing-bottom{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:18px;display:grid;gap:10px}.landing-bottom h2{margin:0;font-family:var(--font-display);font-size:clamp(1.4rem,3.2vw,2.2rem)}.landing-bottom p{margin:0;color:var(--muted)}.auth-card{width:min(560px,100%);border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:28px;display:grid;gap:14px}.auth-card h1{margin:0;font-family:var(--font-display);font-size:clamp(1.9rem,4vw,2.8rem);line-height:.96;letter-spacing:-.03em}.app-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.brand-kicker{margin:0;text-transform:uppercase;letter-spacing:.24em;color:var(--muted);font-size:.72rem}.app-header h1{margin:6px 0 0;font-family:var(--font-display);font-size:clamp(2rem,4.6vw,4.3rem);font-weight:500;line-height:.94;letter-spacing:-.04em;max-width:14ch}.header-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.status-strip{margin-top:18px;margin-bottom:14px;border:1px solid var(--border);background:var(--surface);border-radius:var(--pill);padding:11px 14px;display:flex;justify-content:space-between;gap:12px;align-items:center}.status-left,.status-right{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.92rem;min-width:0;overflow-wrap:anywhere}.layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:14px}.sidebar{display:grid;gap:12px;align-content:start}.sidebar nav{display:grid;gap:8px}.nav-btn{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);font-family:var(--font-display);font-weight:500;padding:12px 14px;text-align:left;cursor:pointer;white-space:nowrap}.nav-btn.active{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 12%,var(--surface))}.side-card,.panel,.subpanel{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:18px}.side-card{display:grid;gap:10px}.side-card h3,.panel h2,.subpanel h3{margin:0;font-family:var(--font-display);font-weight:500;letter-spacing:-.02em}.content{min-width:0}.panel{display:grid;gap:14px}.expected-groups{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.expected-group{padding:14px}.view-toggle{display:inline-flex;gap:8px;border:1px solid var(--border);border-radius:var(--pill);padding:4px;background:var(--surface-strong)}.toggle-btn{border:0;border-radius:var(--pill);background:transparent;color:var(--muted);font-family:var(--font-display);font-weight:500;padding:8px 13px;cursor:pointer}.toggle-btn.active{background:var(--text);color:var(--bg)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in srgb,#000 34%,transparent);display:grid;place-items:center;z-index:1200;padding:20px}.modal-card{width:min(760px,100%);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:18px;display:grid;gap:12px}.modal-card-compact{width:min(680px,100%)}.modal-card-family{width:min(700px,100%)}.family-form{gap:12px}.family-invite-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.panel-title-row{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}.kpi-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr))}.accounts-grid{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}.kpi{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-strong);padding:13px;display:grid;gap:6px}.account-card{gap:8px;padding:12px}.account-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.account-name{font-size:1rem;font-weight:600;color:var(--text)}.account-balance{font-size:1.5rem;line-height:1}.account-meta{display:grid;gap:2px}.account-overdraft-field{gap:4px}.account-overdraft-field input{padding:9px 10px}.account-actions{gap:8px}.kpi-button{width:100%;text-align:left;cursor:pointer;font:inherit;color:inherit}.kpi p,.kpi small{margin:0;color:var(--muted)}.kpi strong{font-size:1.18rem}.dual-grid{display:grid;gap:10px;grid-template-columns:1fr 1fr}.line-row{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;margin-top:8px;background:var(--surface-strong)}.line-row small{display:block;color:var(--muted);margin-top:2px}.upcoming-check-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.upcoming-total-card{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-strong);padding:8px 10px;display:grid;gap:3px}.upcoming-row.is-bill{border-left:4px solid color-mix(in srgb,var(--orange) 78%,transparent)}.upcoming-row.is-income{border-left:4px solid color-mix(in srgb,var(--teal) 78%,transparent)}.upcoming-kind{display:inline-flex;align-items:center;border-radius:var(--pill);padding:1px 8px;font-size:.74rem;font-weight:600;border:1px solid transparent}.upcoming-kind.bill{background:color-mix(in srgb,var(--orange) 14%,transparent);border-color:color-mix(in srgb,var(--orange) 42%,transparent)}.upcoming-kind.income{background:color-mix(in srgb,var(--teal) 14%,transparent);border-color:color-mix(in srgb,var(--teal) 42%,transparent)}.upcoming-amount.bill{color:color-mix(in srgb,var(--orange) 84%,var(--text))}.upcoming-amount.income{color:color-mix(in srgb,var(--teal) 86%,var(--text))}.form-grid{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}label{display:grid;gap:6px;color:var(--muted);font-size:.88rem}.checkbox-label{display:flex;align-items:center;gap:10px;padding-top:26px}.checkbox-label input{width:18px;height:18px;margin:0}.checkbox-label span{color:var(--text);font-size:.95rem}.inline-field{display:inline-grid;gap:4px;font-size:.78rem}.wide{grid-column:1 / -1}input,select{border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 12px;background:var(--bg);color:var(--text);font-size:.98rem;font-family:var(--font-body)}input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:1px}.btn{border:2px solid transparent;border-radius:var(--pill);padding:13px 30px;font-family:var(--font-display);font-size:1rem;font-weight:500;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:opacity .14s ease}.btn-sm{padding:9px 14px;font-size:.9rem}.btn:hover{opacity:.86}.btn:disabled{opacity:.46;cursor:not-allowed}.btn-primary{background:var(--text);color:var(--bg)}.btn-light{background:var(--bg-alt);color:var(--text)}.btn-paid{background:color-mix(in srgb,var(--teal) 18%,var(--surface));border-color:color-mix(in srgb,var(--teal) 42%,transparent);color:var(--text)}.btn-outline{background:transparent;border-color:var(--text);color:var(--text)}.btn-ghost{background:color-mix(in srgb,var(--bg) 88%,transparent);border-color:var(--border);color:var(--text)}.status-chip{border-radius:var(--pill);font-size:.78rem;font-weight:600;padding:5px 10px;border:1px solid transparent}.status-chip.ok{background:color-mix(in srgb,var(--teal) 16%,transparent);border-color:color-mix(in srgb,var(--teal) 44%,transparent)}.status-chip.warn{background:color-mix(in srgb,var(--orange) 16%,transparent);border-color:color-mix(in srgb,var(--orange) 44%,transparent)}.status-chip.neutral{background:color-mix(in srgb,var(--blue) 14%,transparent);border-color:color-mix(in srgb,var(--blue) 40%,transparent)}.row,.filter-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.nowrap{flex-wrap:nowrap}.stack{display:grid;gap:8px}.households-list{display:grid;gap:6px}.sidebar-action{width:100%}.household-chip{border:1px solid var(--border);background:var(--surface-strong);border-radius:var(--radius-sm);color:var(--text);padding:10px 12px;cursor:pointer;display:flex;justify-content:space-between;gap:10px}.household-chip.active{border-color:var(--blue)}.household-chip small,.muted{color:var(--muted)}.table-wrap{border:1px solid var(--border);border-radius:var(--radius-sm);overflow:auto;background:var(--surface-strong)}table{width:100%;border-collapse:collapse;min-width:760px}.bills-table{min-width:0;table-layout:fixed}.bills-table th,.bills-table td{padding:8px 10px}.bills-table th:nth-child(1),.bills-table td:nth-child(1){width:11%;white-space:nowrap}.bills-table th:nth-child(2),.bills-table td:nth-child(2){width:22%}.bills-table th:nth-child(3),.bills-table td:nth-child(3){width:12%}.bills-table th:nth-child(4),.bills-table td:nth-child(4){width:12%;white-space:nowrap}.bills-table th:nth-child(5),.bills-table td:nth-child(5){width:14%}.bills-table th:nth-child(6),.bills-table td:nth-child(6){width:11%;white-space:nowrap}.bills-table th:nth-child(7),.bills-table td:nth-child(7){width:11%}.bills-table th:nth-child(8),.bills-table td:nth-child(8){width:7%;white-space:nowrap}th,td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;font-size:.92rem}th{font-family:var(--font-display);font-weight:500;background:color-mix(in srgb,var(--bg-alt) 88%,transparent)}.th-sort{border:0;background:transparent;color:var(--text);font:inherit;font-weight:500;padding:0;cursor:pointer}.filter-input{width:100%;min-width:96px;padding:7px 8px;font-size:.84rem}.amount-filter{display:grid;grid-template-columns:1fr 1fr;gap:6px}td small{display:block;color:var(--muted);margin-top:4px}.table-wrap td select,.table-wrap td input{width:100%;min-width:120px}.end-date-cell{display:grid;gap:6px;min-width:160px}.icon-action{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto}.icon-action.is-done{background:color-mix(in srgb,var(--teal) 18%,var(--surface));border-color:color-mix(in srgb,var(--teal) 42%,transparent)}.checklist{display:grid;gap:8px}.check-item{border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 12px;display:flex;align-items:center;gap:10px;background:var(--surface-strong)}@media (max-width: 1250px){.layout{grid-template-columns:300px minmax(0,1fr)}.kpi-grid,.accounts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 980px){.app-header{flex-direction:column}.app{padding:14px 10px 26px}.app-header h1{font-size:clamp(1.65rem,8vw,2.6rem);line-height:.98;max-width:none}.header-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.layout{grid-template-columns:1fr}.sidebar nav{display:flex;overflow-x:auto;gap:8px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.sidebar nav .nav-btn{flex:0 0 auto;min-width:140px;text-align:center;padding:10px 12px}.dual-grid,.form-grid,.expected-groups,.family-invite-row,.landing-hero{grid-template-columns:1fr}.landing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 620px){.header-actions,.kpi-grid,.accounts-grid{grid-template-columns:1fr}.status-strip{flex-direction:column;align-items:flex-start;border-radius:var(--radius-sm);padding:9px 10px}.panel,.subpanel,.side-card{padding:12px;border-radius:var(--radius-sm)}.btn,.landing-actions{width:100%}.landing-grid{grid-template-columns:1fr}}
