@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");:root{--ink:#101828;--muted:#71809a;--line:#e4eaf2;--surface:#fff;--bg:#f7f9fc;--purple:#5145ed;--green:#008b69;--red:#d81245;--navy:#3949ab}*{box-sizing:border-box}body,html{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink);background:var(--bg);font-size:13px}button,input{font:inherit}button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:9px;font-weight:600;transition:filter .15s,background .15s}button:disabled{opacity:.55;cursor:not-allowed}.primary{background:var(--purple);color:white;padding:10px 15px;box-shadow:0 1px 2px #3227b31a}.primary:hover{filter:brightness(.95)}.secondary{background:#f1f4f9;color:#34425a;border:1px solid #e4eaf2;padding:9px 13px}.secondary:hover{background:#e9eef6}.full{width:100%;min-height:43px}.app-shell{max-width:1800px;margin:0 auto;padding:0 18px 22px}.topbar{min-height:66px;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);margin:0 -18px 23px;padding:10px 38px 10px 18px;background:#fff}.brand,.topbar{display:flex;align-items:center}.brand{gap:12px;min-width:0}.brand-mark{width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:var(--purple);color:white;display:grid;place-items:center}.brand h1{font-size:17px;line-height:1.3;margin:0;font-weight:750;letter-spacing:-.35px}.brand p{font-size:11px;color:var(--muted);margin:2px 0 0}.top-actions{display:flex;gap:9px;align-items:center}.icon-button{background:transparent;color:#91a0b7;padding:8px;border-radius:8px}.logout{display:none}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:14px;gap:14px;margin-bottom:24px}.stat-card{min-height:78px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px 16px;display:flex;align-items:center;gap:14px;min-width:0}.stat-icon{width:41px;height:41px;border-radius:10px;display:grid;place-items:center;flex:0 0 41px}.stat-icon.purple{background:#eef0ff;color:#5b53f4;border:1px solid #e1e5ff}.stat-icon.green{background:#ecfbf5;color:#00a776;border:1px solid #d2f7e8}.stat-icon.red{background:#fff0f3;color:#ff315b;border:1px solid #ffe1e7}.stat-icon.orange{background:#fff8e8;color:#e88b00;border:1px solid #ffefc7}.stat-copy{display:flex;flex-direction:column;gap:5px;min-width:0}.stat-copy>span{font-size:10px;letter-spacing:.35px;color:#63748e;font-weight:600}.stat-copy strong{font-size:17px;line-height:1.15;white-space:nowrap;font-weight:750}.stat-copy small{font-size:10px;color:var(--muted);font-weight:400}.green-text{color:var(--green)!important}.red-text{color:var(--red)!important}.searchbar{justify-content:space-between;gap:12px;background:white;border:1px solid var(--line);border-radius:12px;padding:11px 12px;margin-bottom:24px}.search-input,.searchbar{display:flex;align-items:center}.search-input{height:31px;border:1px solid #e3e9f2;border-radius:9px;gap:9px;padding:0 10px;color:#96a6bf;width:min(440px,100%);background:#f8fafd}.search-input input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink);font-size:12px}.search-input input::placeholder{color:#94a4bd}.filters{display:flex;align-items:center;background:#f1f4f8;border-radius:9px;padding:3px;gap:2px}.filters button{padding:8px 12px;background:transparent;color:#455570;font-size:11px;font-weight:500;white-space:nowrap}.filters button.active{background:white;color:var(--green);box-shadow:0 1px 3px #17233a0d}.content-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(310px,.98fr);grid-gap:24px;gap:24px;align-items:start}.panel{background:white;border:1px solid var(--line);border-radius:13px;overflow:hidden;min-width:0}.panel-head{padding:15px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:68px}.panel-head h2{font-size:13px;margin:0 0 7px;font-weight:750;letter-spacing:-.2px}.panel-head p{font-size:10px;color:var(--muted);margin:0}.text-button{background:transparent;color:var(--purple);font-size:11px;padding:6px 0;white-space:nowrap}.table-wrap{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:11px}td,th{padding:13px 10px;border-right:1px solid #edf1f6;border-bottom:1px solid #e6edf5;text-align:center;vertical-align:middle}td:last-child,th:last-child{border-right:0}thead th{background:var(--navy);color:#fff;font-weight:600;line-height:1.35;white-space:normal}tbody td{color:#32415b;line-height:1.4}tbody tr:nth-child(2n){background:#fbfcfe}tbody tr:hover{background:#f8fbff}.expenses-table{min-width:790px}.expenses-table th:first-child{width:48px}.expenses-table .description{text-align:left;font-weight:600;color:#152239;min-width:100px}.expenses-table .details{text-align:left;color:#77869d;min-width:120px;max-width:180px}.expenses-table tfoot td,.history-table tfoot td{background:#f1f5fa;font-weight:750;color:#17233a;border-bottom:0}.expenses-table tfoot td:first-child{text-align:left}.paid-toggle{background:#f0f3f8;border:1px solid #d8e0ec;color:#95a2b6;width:20px;height:20px;padding:0;border-radius:5px}.paid-toggle.checked{background:#009b75;color:white;border-color:#009b75}.paid-toggle span{width:7px;height:7px;border-radius:2px;background:#a7b4c7}.row-actions{display:flex;justify-content:center;gap:8px}.row-actions button{padding:2px;background:transparent;color:#9aa9be}.row-actions button:hover{color:var(--purple)}.empty{padding:28px!important;color:#8795a9!important;text-align:center!important}.side-column{display:flex;flex-direction:column;gap:24px;min-width:0}.history-panel .panel-head{min-height:68px}.history-panel .panel-head h2{font-size:13px}.live-dot{width:10px;height:10px;background:#10b981;border-radius:50%;flex:0 0 auto}.history-table{min-width:260px}.history-table thead th{background:#197d5b}.history-table td{padding:12px 13px}.history-table td:first-child{text-align:center}.history-table td:last-child,.history-table tfoot td:last-child{text-align:right;font-weight:600}.history-table tfoot td{background:#effbf6;color:#087955}.payment-note{display:block;color:#8795a9;font-size:10px;margin-top:3px}.sync-card{background:#f2f5fa;border:1px solid #e4eaf2;border-radius:13px;padding:16px}.sync-title{display:flex;align-items:center;gap:9px;color:#42516a;font-size:11px}.sync-title svg{color:#6157ff}.sync-card p{font-size:10px;color:#71809a;line-height:1.7;margin:11px 0 0}.sync-button{margin-top:12px;width:100%;font-size:11px}.footer{text-align:center;color:#a0aabd;font-size:10px;padding:22px 0 0}.notice{display:flex;align-items:center;gap:9px;background:#fff8e7;color:#78530c;border:1px solid #f7e6b4;padding:10px 12px;border-radius:9px;margin:-10px 0 17px}.notice span{flex:1 1}.notice button{background:transparent;color:inherit;padding:3px}.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#f6f7ff,#f7f9fc)}.login-card{width:min(100%,390px);padding:30px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 45px #27345a0b;display:flex;flex-direction:column;gap:16px}.login-card .brand-mark{margin-bottom:3px}.login-card h1{font-size:21px;margin:0}.muted{color:var(--muted);margin:0;font-size:12px}.tiny{font-size:10px;line-height:1.6}.login-card label,.modal label{display:flex;flex-direction:column;gap:7px;color:#394861;font-weight:600;font-size:12px}.login-card input,.modal input{width:100%;border:1px solid #dfe6f0;border-radius:9px;padding:11px 12px;outline:none;background:#fff;color:var(--ink);min-width:0}.login-card input:focus,.modal input:focus{border-color:#8c85ff;box-shadow:0 0 0 3px #5145ed12}.error-message{font-size:12px;color:var(--red);margin:0}.modal-backdrop{position:fixed;inset:0;z-index:20;background:#17203366;display:grid;place-items:center;padding:18px;overflow-y:auto}.modal{width:min(100%,510px);background:white;border-radius:16px;padding:22px;box-shadow:0 20px 70px #10182830;flex-direction:column}.modal,.modal-head{display:flex;gap:15px}.modal-head{align-items:flex-start;justify-content:space-between;margin-bottom:3px}.modal-head h2{font-size:18px;margin:0 0 6px}.modal-head p{font-size:11px;color:var(--muted);margin:0}.form-row{display:grid;grid-template-columns:1fr 1fr;grid-gap:12px;gap:12px}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:5px}.modal-actions button{min-height:38px}@media(min-width:1500px){.app-shell{padding-left:24px;padding-right:24px}.topbar{margin-left:-24px;margin-right:-24px;padding-left:24px}.content-grid{grid-template-columns:minmax(0,2fr) minmax(360px,.98fr)}}@media(max-width:1100px){.content-grid{grid-template-columns:1fr}.side-column{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.expenses-table{min-width:860px}.stat-card{padding:13px 12px;gap:10px}.stat-copy strong{font-size:15px}}@media(max-width:760px){.app-shell{padding:0 12px 18px}.topbar{margin:0 -12px 16px;padding:12px;align-items:flex-start}.brand{gap:9px}.brand-mark{width:36px;height:36px;flex-basis:36px}.brand h1{font-size:13px;line-height:1.4}.brand p{font-size:10px;line-height:1.4}.top-actions{gap:6px}.top-actions .secondary{font-size:0;padding:10px}.top-actions .secondary svg{width:17px;height:17px}.top-actions .primary{font-size:0;padding:10px}.top-actions .primary svg{width:18px;height:18px}.logout{display:inline-flex}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:15px}.stat-card{min-height:76px;padding:11px 10px;gap:9px}.stat-icon{width:34px;height:34px;flex-basis:34px}.stat-icon svg{width:19px}.stat-copy>span{font-size:9px}.stat-copy strong{font-size:14px}.stat-copy small{font-size:9px;display:block;margin-top:3px}.searchbar{flex-direction:column;align-items:stretch;padding:10px;gap:10px;margin-bottom:15px}.search-input{width:100%;height:36px}.filters{justify-content:space-between}.filters button{padding:9px 7px;flex:1 1;font-size:10px}.content-grid{gap:15px}.panel-head{padding:13px;min-height:62px}.panel-head h2{font-size:12px}.panel-head p,.text-button{font-size:10px}.side-column{display:flex;gap:15px}.expenses-table{min-width:850px}.history-table{min-width:0}.sync-card{padding:14px}.modal{padding:18px}.form-row{grid-template-columns:1fr}.footer{font-size:9px}}@media(max-width:390px){.brand h1{max-width:195px}.brand p{max-width:200px}.top-actions{gap:3px}.top-actions .primary,.top-actions .secondary{padding:8px}.stat-copy strong{font-size:12px}.stat-card{gap:7px;padding:9px}.filters button{font-size:9px}}.brand-copy{min-width:0}.brand-title-line,.title-edit-form{display:flex;align-items:center;gap:3px;min-width:0}.brand-title-line h1{min-width:0;overflow-wrap:anywhere}.title-edit-button{padding:4px;flex:0 0 auto}.title-edit-form input{width:min(340px,35vw);min-width:0;border:1px solid var(--line);border-radius:8px;padding:7px 9px;background:var(--surface);color:var(--ink);font:inherit}.title-edit-form .icon-button{width:30px;height:30px;padding:5px;flex:0 0 30px}@media(max-width:760px){.title-edit-form input{width:min(170px,36vw);font-size:12px;padding:7px}}.panel-head-actions{display:flex;align-items:center;gap:14px;flex:0 0 auto}.danger-text-button{color:#bd2340}.danger-button{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:9px;background:#bd2340;color:#fff}.danger-button:hover{background:#a91d37}.delete-all-heading{display:flex;align-items:center;gap:10px;color:#bd2340}.delete-all-heading h2{margin:0}.delete-all-modal>p{margin:0;color:var(--muted);line-height:1.55}.delete-all-modal>p:first-of-type{color:var(--ink);font-weight:600}@media(max-width:760px){.panel-head{flex-wrap:wrap}.panel-head-actions{width:100%;justify-content:flex-end;gap:10px}}.top-actions .logout{font-size:12px;padding:10px 12px;white-space:nowrap;display:inline-flex}.password-input-wrap{position:relative;display:flex;align-items:center}.password-input-wrap input{padding-right:42px}.password-visibility-toggle{position:absolute;right:5px;color:#71809a;padding:7px}.login-shell{position:relative}.theme-toggle{width:36px;height:36px;border:1px solid var(--line)}.login-theme-toggle{position:absolute;top:18px;right:18px}html[data-theme=dark]{color-scheme:dark;--ink:#edf2f8;--muted:#a3afc0;--line:#2e3a4b;--surface:#18212d;--bg:#101720;--purple:#8b83ff;--green:#58d5aa;--red:#ff778d;--navy:#26364d}html[data-theme=dark] .login-card,html[data-theme=dark] .modal,html[data-theme=dark] .panel,html[data-theme=dark] .searchbar,html[data-theme=dark] .stat-card,html[data-theme=dark] .topbar{color:var(--ink);background-color:var(--surface);border-color:var(--line)}html[data-theme=dark] .filters,html[data-theme=dark] .search-input,html[data-theme=dark] .secondary{color:var(--ink);background-color:#222d3b;border-color:var(--line)}html[data-theme=dark] .secondary:hover{background-color:#2b3849}html[data-theme=dark] .filters button{color:#c3cede}html[data-theme=dark] .filters button.active{color:var(--green);background-color:#344253;box-shadow:none}html[data-theme=dark] .icon-button,html[data-theme=dark] .row-actions button{color:#aab6c8}html[data-theme=dark] .theme-toggle{border:1px solid var(--line);width:36px;height:36px}html[data-theme=dark] table td,html[data-theme=dark] table th{border-color:#303d4e}html[data-theme=dark] .expenses-table .description,html[data-theme=dark] tbody td{color:#d5deea}html[data-theme=dark] .expenses-table .details,html[data-theme=dark] .search-input,html[data-theme=dark] .search-input input::placeholder{color:#a3afc0}html[data-theme=dark] tbody tr:nth-child(2n){background-color:#1c2633}html[data-theme=dark] tbody tr:hover{background-color:#243141}html[data-theme=dark] .expenses-table tfoot td,html[data-theme=dark] .history-table tfoot td{color:#dce5f0;background-color:#222e3c}html[data-theme=dark] .history-table thead th{background-color:#17634d}html[data-theme=dark] .history-table tfoot td{color:#8ce5c5;background-color:#19372f}html[data-theme=dark] .paid-toggle{color:#b4bfd0;background-color:#263344;border-color:#405066}html[data-theme=dark] .paid-toggle.checked{color:#10221c;background-color:#58d5aa;border-color:#58d5aa}html[data-theme=dark] .paid-toggle span{background-color:#a3afc0}html[data-theme=dark] .stat-icon.purple{color:#aaa4ff;background-color:#302d52;border-color:#49437c}html[data-theme=dark] .stat-icon.green{color:#69dfb8;background-color:#1d3b35;border-color:#2e5c4e}html[data-theme=dark] .stat-icon.red{color:#ff8da0;background-color:#482b38;border-color:#70404f}html[data-theme=dark] .stat-icon.orange{color:#ffc56b;background-color:#45382a;border-color:#695237}html[data-theme=dark] .sync-card{color:var(--ink);background-color:#1c2734;border-color:var(--line)}html[data-theme=dark] .notice{color:#f4d38d;background-color:#39311f;border-color:#65532c}html[data-theme=dark] .danger-text-button,html[data-theme=dark] .delete-all-heading{color:#ff9aab}html[data-theme=dark] .danger-button{color:#fff;background-color:#a72e47}html[data-theme=dark] .danger-button:hover{background-color:#8f263d}html[data-theme=dark] .login-shell{background:linear-gradient(135deg,#172130,#101720)}html[data-theme=dark] .login-card label,html[data-theme=dark] .modal label{color:#c4cfdd}html[data-theme=dark] .login-card input,html[data-theme=dark] .modal input,html[data-theme=dark] .title-edit-form input{color:var(--ink);background-color:#111923;border-color:#39485c}html[data-theme=dark] .login-card input::placeholder,html[data-theme=dark] .modal input::placeholder{color:#8897aa}html[data-theme=dark] .footer,html[data-theme=dark] .muted{color:var(--muted)}html[data-theme=dark] .error-message{color:#ff9aaa}