html{scroll-behavior:smooth}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button:focus-visible,a:focus-visible{outline-offset:3px;outline:2px solid #171717}.app{color:#171717;background:#f7f7f2;min-height:100vh}.navbar{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f7f7f2f2;border-bottom:1px solid #deded8;justify-content:space-between;align-items:center;height:72px;padding:0 6%;display:flex;position:sticky;top:0}.navbar-brand{align-items:center;gap:12px;font-size:22px;font-weight:800;display:flex}.brand-mark,.profile-avatar{color:#c8ff38;background:#171717;border-radius:10px;place-items:center;width:38px;height:38px;font-weight:800;display:grid}.navbar-links{gap:32px;display:flex}.navbar-links a{color:#171717;font-size:14px;font-weight:600;text-decoration:none}.navbar-links a:hover{color:#6f8f00}.navbar-profile{align-items:center;gap:10px;font-weight:600;display:flex}.profile-avatar{border-radius:50%;width:34px;height:34px}.error-banner{color:#9b2226;background:#fff0f0;border:1px solid #e5bcbc;border-radius:12px;width:88%;margin:20px auto;padding:14px 18px}.hero-section{background:radial-gradient(circle at 80% 45%,#c8ff382e,#0000 35%);border-bottom:1px solid #deded8;grid-template-columns:1.5fr .7fr;align-items:center;gap:80px;min-height:620px;padding:100px 6%;display:grid}.eyebrow{color:#777;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;font-size:12px;font-weight:800;display:block}.hero-content h1{letter-spacing:-5px;max-width:800px;margin:0;font-size:clamp(64px,8vw,120px);line-height:.9}.hero-content h1 span{color:#858585}.hero-content>p{color:#555;max-width:650px;margin-top:32px;font-size:18px;line-height:1.6}.current-group-badge{background:#fff;border:1px solid #deded8;border-radius:999px;align-items:center;gap:10px;width:fit-content;margin-top:28px;padding:12px 16px;font-size:14px;display:flex}.status-dot{background:#9bc900;border-radius:50%;width:9px;height:9px}.hero-balance-card{background:#dfff73;border-radius:28px;padding:40px;box-shadow:0 20px 60px #00000014}.card-label,.stat-label{color:#666;letter-spacing:1.5px;font-size:12px;font-weight:800}.hero-balance{letter-spacing:-3px;margin-top:20px;font-size:clamp(42px,5vw,70px);font-weight:800}.hero-balance.positive,.positive{color:#237a35}.hero-balance.negative,.negative{color:#b42318}.hero-balance-card p{color:#555;margin-bottom:0}.section{border-bottom:1px solid #deded8;padding:90px 6%}.section-heading{justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px;display:flex}.section-heading h2{letter-spacing:-3px;margin:0;font-size:clamp(38px,5vw,64px);line-height:1}.section-count,.loading-text{color:#777;font-size:14px}.groups-grid{flex-direction:column;gap:32px;width:100%;display:flex}.group-card{text-align:left;cursor:pointer;background:#fff;border:1px solid #deded8;border-radius:22px;min-height:260px;padding:28px;transition:transform .2s,border-color .2s,box-shadow .2s}.group-card:hover{border-color:#171717;transform:translateY(-4px);box-shadow:0 14px 35px #00000014}.group-card.selected{background:#eaffaa;border:2px solid #171717}.group-card-top{justify-content:space-between;align-items:center;display:flex}.group-icon{color:#c8ff38;background:#171717;border-radius:13px;place-items:center;width:46px;height:46px;font-weight:800;display:grid}.selected-badge{color:#c8ff38;letter-spacing:1px;background:#171717;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:800}.group-card h3{margin:35px 0 10px;font-size:22px;line-height:1.2}.group-card p{color:#777}.group-action{margin-top:28px;font-size:14px;font-weight:700;display:block}.add-group-card{background:0 0;border-style:dashed}.add-icon{border:1px solid #ccc;border-radius:50%;place-items:center;width:46px;height:46px;font-size:28px;display:grid}.selected-group-section{background:#f1f1eb}.stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;display:grid}.stat-card{background:#fff;border:1px solid #deded8;border-radius:18px;padding:26px}.stat-card strong{margin-top:12px;font-size:30px;display:block}.details-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.details-card{background:#fff;border:1px solid #deded8;border-radius:22px;padding:30px}.details-card-header{margin-bottom:24px}.details-card-header h3{margin:0;font-size:26px}.balance-list,.expense-list{flex-direction:column;display:flex}.balance-row,.expense-row{border-bottom:1px solid #eeeeea;justify-content:space-between;align-items:center;gap:20px;min-height:70px;padding:14px 0;display:flex}.balance-row:last-child,.expense-row:last-child{border-bottom:none}.balance-user{align-items:center;gap:12px;display:flex}.mini-avatar{color:#c8ff38;background:#171717;border-radius:50%;flex-shrink:0;place-items:center;width:38px;height:38px;font-weight:800;display:grid}.expense-row>div{flex-direction:column;gap:6px;display:flex}.expense-row span{color:#888;font-size:13px}.expense-amount{font-size:17px}.empty-message{color:#888}.settlement-list{flex-direction:column;gap:14px;display:flex}.settlement-card{background:#fff;border:1px solid #deded8;border-radius:18px;grid-template-columns:1fr auto 1fr auto;align-items:center;gap:30px;min-height:90px;padding:20px 28px;display:grid}.settlement-person{align-items:center;gap:12px;display:flex}.settlement-arrow{color:#999;align-items:center;gap:8px;display:flex}.settlement-arrow strong{color:#171717;font-size:25px}.settlement-amount{font-size:22px;font-weight:800}.empty-state{text-align:center;background:#fff;border:1px dashed #ccc;border-radius:20px;padding:60px}.empty-state h3{margin-top:0;font-size:26px}.dsa-section{color:#fff;background:#171717}.dsa-section .eyebrow{color:#aaa}.dsa-section h2{color:#fff}.dsa-flow{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:18px;display:grid}.dsa-item{background:#222;border:1px solid #3a3a3a;border-radius:18px;min-height:170px;padding:24px}.dsa-item span{color:#c8ff38;font-size:12px;font-weight:800}.dsa-item strong{margin-top:25px;font-size:22px;display:block}.dsa-item p{color:#aaa;font-size:13px}.flow-arrow{color:#c8ff38;font-size:22px}.app-loading{background:#f7f7f2;place-items:center;min-height:100vh;display:grid}.loading-card{text-align:center;padding:50px}.loading-logo{color:#c8ff38;background:#171717;border-radius:16px;place-items:center;width:60px;height:60px;margin:0 auto 20px;font-size:24px;font-weight:800;display:grid}.footer{color:#777;justify-content:space-between;gap:20px;padding:35px 6%;font-size:13px;display:flex}.footer strong{color:#171717}@media (width<=1000px){.hero-section{grid-template-columns:1fr}.groups-grid{width:100%}.stats-grid{grid-template-columns:repeat(2,1fr)}.dsa-flow{grid-template-columns:1fr}.flow-arrow{text-align:center;transform:rotate(90deg)}}@media (width<=700px){.navbar{padding:0 20px}.navbar-links{display:none}.hero-section,.section{padding:60px 20px}.hero-content h1{letter-spacing:-3px;font-size:60px}.details-grid,.stats-grid{grid-template-columns:1fr}.settlement-card{grid-template-columns:1fr;gap:12px}.settlement-arrow{justify-content:center}.footer{flex-direction:column;padding:30px 20px}}.group-details-actions{flex-shrink:0;align-items:center;gap:20px;display:flex}.add-expense-button{color:#d7ff3f;cursor:pointer;background:#171717;border:1px solid #171717;border-radius:999px;padding:14px 24px;font-family:inherit;font-size:15px;font-weight:700;transition:transform .2s,background .2s}.add-expense-button:hover{background:#2a2a2a;transform:translateY(-2px)}.add-expense-button:active{transform:translateY(0)}.expense-form-card{background:#fff;border:1px solid #deded8;border-radius:24px;margin:0 0 48px;padding:32px;box-shadow:0 12px 40px #0000000a}.expense-form-header{justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:30px;display:flex}.expense-form-header h3{margin:8px 0 0;font-size:32px;line-height:1.1}.expense-form-grid{grid-template-columns:1.5fr 1fr 1fr;gap:20px;display:grid}.form-field{flex-direction:column;gap:9px;display:flex}.form-field label,.split-section>label{letter-spacing:.08em;text-transform:uppercase;font-size:13px;font-weight:700}.form-field input,.form-field select{color:#171717;background:#fafaf7;border:1px solid #d8d8d2;border-radius:12px;outline:none;width:100%;height:52px;padding:0 16px;transition:border-color .2s,box-shadow .2s}.form-field input:focus,.form-field select:focus{border-color:#171717;box-shadow:0 0 0 3px #d2ff3759}.form-field input::placeholder{color:#999}.split-section{margin-top:28px}.split-options{flex-wrap:wrap;gap:12px;margin-top:14px;display:flex}.split-option{cursor:pointer;background:#fafaf7;border:1px solid #d8d8d2;border-radius:12px;align-items:center;gap:9px;min-width:120px;padding:12px 16px;transition:all .2s;display:flex}.split-option:hover{background:#f3f3ed;border-color:#171717}.split-option input{accent-color:#171717;cursor:pointer;width:17px;height:17px}.split-option span{font-weight:600}.expense-form-actions{justify-content:flex-end;gap:12px;margin-top:30px;display:flex}.expense-submit-button,.expense-cancel-button{cursor:pointer;border-radius:999px;min-height:48px;padding:0 22px;font-weight:700;transition:transform .2s,opacity .2s}.expense-submit-button{color:#d7ff45;background:#171717;border:1px solid #171717}.expense-cancel-button{color:#171717;background:#fff;border:1px solid #d8d8d2}.expense-submit-button:hover,.expense-cancel-button:hover{transform:translateY(-2px)}.expense-submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.form-error{color:#b42318;background:#fff0f0;border-radius:10px;margin:20px 0 0;padding:12px 16px;font-weight:600}.form-success{color:#176b32;background:#efffd0;border-radius:10px;margin:20px 0 0;padding:12px 16px;font-weight:600}@media (width<=900px){.expense-form-grid{grid-template-columns:1fr 1fr}.expense-form-grid .form-field:first-child{grid-column:1/-1}}@media (width<=600px){.expense-form-card{border-radius:18px;padding:22px}.expense-form-header{flex-direction:column}.expense-form-header h3{font-size:27px}.expense-form-grid{grid-template-columns:1fr}.expense-form-grid .form-field:first-child{grid-column:auto}.expense-form-actions{flex-direction:column-reverse}.expense-submit-button,.expense-cancel-button{width:100%}}.member-checkbox-list{gap:12px;margin-top:8px;display:grid}.member-checkbox{cursor:pointer;align-items:center;gap:12px;width:fit-content;font-size:16px;display:flex}.member-checkbox input{accent-color:#171717;width:18px;height:18px;margin:0}.member-checkbox span{font-weight:600}.group-tree-item{width:100%;min-width:0}.group-tree-item>.group-card{width:min(100%,450px);min-height:220px}.nested-groups{box-sizing:border-box;border-left:2px solid #d9d9d9;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;width:calc(100% - 42px);margin-top:22px;margin-left:42px;padding:4px 0 4px 24px;display:grid}.nested-groups .group-tree-item{min-width:0}.nested-groups .group-tree-item>.group-card{width:100%;min-height:220px;padding:24px}.group-tree-item .group-card h3{overflow-wrap:anywhere;word-break:normal}.group-tree-item .group-card p{margin-bottom:0}.group-tree-item .group-action{margin-top:24px}.groups-grid>.add-group-card{width:min(100%,450px);min-height:220px}@media (width<=900px){.nested-groups{grid-template-columns:1fr}}@media (width<=700px){.groups-grid{gap:24px}.group-tree-item>.group-card,.groups-grid>.add-group-card{width:100%}.nested-groups{grid-template-columns:1fr;width:calc(100% - 24px);margin-left:24px;padding-left:18px}}@media (width<=550px){.nested-groups{width:calc(100% - 12px);margin-left:12px;padding-left:12px}}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.delete-modal{text-align:center;background:#fff;border-radius:18px;width:100%;max-width:430px;padding:32px;animation:.2s ease-out deleteModalAppear;box-shadow:0 20px 60px #00000040}.delete-modal-icon{background:#fee2e2;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin:0 auto 18px;font-size:30px;display:flex}.delete-modal h2{color:#111827;margin:0 0 12px;font-size:24px}.delete-modal p{color:#4b5563;margin:8px 0;line-height:1.6}.delete-modal-warning{font-size:14px;font-weight:600;color:#dc2626!important}.delete-modal-actions{justify-content:center;gap:12px;margin-top:28px;display:flex}.cancel-delete-button,.confirm-delete-button{cursor:pointer;border:none;border-radius:9px;min-width:130px;padding:11px 18px;font-size:14px;font-weight:600;transition:transform .15s,opacity .15s,box-shadow .15s}.cancel-delete-button{color:#374151;background:#f3f4f6}.confirm-delete-button{color:#fff;background:#dc2626}.cancel-delete-button:hover,.confirm-delete-button:hover{transform:translateY(-1px)}.cancel-delete-button:hover{background:#e5e7eb}.confirm-delete-button:hover{background:#b91c1c;box-shadow:0 6px 18px #dc262640}.cancel-delete-button:active,.confirm-delete-button:active{transform:translateY(0)}@keyframes deleteModalAppear{0%{opacity:0;transform:scale(.95)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}@media (width<=500px){.delete-modal{padding:26px 20px}.delete-modal-actions{flex-direction:column-reverse}.cancel-delete-button,.confirm-delete-button{width:100%}}.edit-expense-modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000008c;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.edit-expense-modal{width:100%;max-width:560px;max-height:90vh;margin:0;animation:.2s ease-out editExpenseModalIn;position:relative;overflow-y:auto}@keyframes editExpenseModalIn{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=600px){.edit-expense-modal-overlay{align-items:flex-start;padding:40px 16px 16px}.edit-expense-modal{max-height:calc(100vh - 56px)}}.auth-page{background:radial-gradient(circle at 0 0,#6366f11f,#0000 35%),radial-gradient(circle at 100% 100%,#0ea5e91a,#0000 35%),#f7f8fc;justify-content:center;align-items:center;min-height:100vh;padding:32px 20px;display:flex}.auth-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;width:min(100%,460px);padding:40px;box-shadow:0 24px 70px #0f172a1a}.auth-brand{align-items:center;gap:12px;margin-bottom:34px;display:flex}.auth-logo{color:#fff;background:#111827;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;font-weight:800;display:flex}.auth-brand div:last-child{flex-direction:column;gap:2px;display:flex}.auth-brand strong{color:#111827;font-size:18px}.auth-brand span{color:#6b7280;font-size:12px}.auth-header{margin-bottom:26px}.auth-header h1{color:#111827;margin:8px 0 10px;font-size:clamp(28px,5vw,36px);line-height:1.15}.auth-header p{color:#6b7280;margin:0;line-height:1.6}.auth-form{flex-direction:column;gap:18px;display:flex}.auth-form .form-field{flex-direction:column;gap:8px;display:flex}.auth-form .form-field span{color:#374151;font-size:14px;font-weight:600}.auth-form .form-field input{box-sizing:border-box;color:#111827;background:#fff;border:1px solid #d1d5db;border-radius:10px;outline:none;width:100%;padding:13px 14px;font-size:15px;transition:border-color .2s,box-shadow .2s}.auth-form .form-field input:focus{border-color:#111827;box-shadow:0 0 0 3px #11182714}.auth-form .form-field input::placeholder{color:#9ca3af}.auth-submit-button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:10px;width:100%;margin-top:4px;padding:14px 18px;font-size:15px;font-weight:700;transition:transform .2s,opacity .2s}.auth-submit-button:hover:not(:disabled){transform:translateY(-1px)}.auth-submit-button:disabled{cursor:not-allowed;opacity:.65}.auth-switch{color:#6b7280;text-align:center;justify-content:center;align-items:center;gap:6px;margin-top:24px;font-size:14px;display:flex}.auth-switch button{color:#111827;font:inherit;cursor:pointer;background:0 0;border:none;padding:0;font-weight:700}.auth-switch button:hover{text-decoration:underline}@media (width<=520px){.auth-page{padding:20px 14px}.auth-card{border-radius:18px;padding:28px 22px}.auth-brand{margin-bottom:28px}.auth-header h1{font-size:28px}.auth-switch{flex-direction:column;gap:4px}}.logout-button{color:#111;cursor:pointer;background:0 0;border:1px solid #d9d9d9;border-radius:999px;padding:8px 14px;font-family:inherit;font-size:13px;font-weight:600;transition:all .2s}.logout-button:hover{color:#fff;background:#111;border-color:#111}
