:root{--ink:#120a28;--muted:#8c8999;--line:#eceaf0;--bg:#f8f8fa;--white:#fff;--indigo:#210052;--violet:#7617e8;--bright:#9a35ff;--lavender:#eee4ff;--shadow:0 16px 40px rgba(31,12,72,.08)}
.login-dialog{text-align:center}.login-dialog form{padding:36px}.login-mark{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 20px;border-radius:16px 16px 16px 5px;background:linear-gradient(135deg,var(--indigo),var(--violet));color:#fff;font:800 27px Manrope,sans-serif}.login-dialog h2{font-size:26px}.login-copy{max-width:330px;margin:10px auto 24px;color:var(--muted);line-height:1.5}.login-dialog label{text-align:left}.login-error{min-height:18px;margin:10px 0 0;color:#b33b57;font-size:12px}.login-dialog::backdrop{background:linear-gradient(145deg,rgba(18,10,40,.86),rgba(118,23,232,.68));backdrop-filter:blur(12px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"DM Sans",sans-serif}.app{width:min(100% - 36px,900px);margin:auto;padding:0 0 130px}.topbar{height:90px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.topbar h1{font:800 22px Manrope,sans-serif;margin:0}.brand{display:flex;align-items:center;gap:8px;color:var(--ink);font-weight:800;text-decoration:none}.brand span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px 9px 9px 3px;background:linear-gradient(135deg,var(--indigo),var(--violet));color:white}.more-button{justify-self:end;border:0;background:transparent;color:var(--muted);font-weight:800;letter-spacing:2px;cursor:pointer}.balance-section{padding:32px 4px 36px}.balance-section p{margin:0 0 7px;color:var(--muted);font-size:14px}.balance-section strong{display:block;font:800 clamp(40px,8vw,66px)/1 Manrope,sans-serif;letter-spacing:-.05em}.balance-section span{display:block;margin-top:11px;color:var(--muted);font-size:13px}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}h2{margin:0;font:800 22px Manrope,sans-serif;letter-spacing:-.03em}.section-title-row select{width:auto;height:42px;padding:0 38px 0 16px;border:1px solid var(--line);border-radius:14px;background:var(--white);color:var(--ink);font-weight:700;outline:none}.chart-card{display:grid;grid-template-columns:42px 1fr;position:relative;padding:28px 24px 56px 12px;border:1px solid rgba(18,10,40,.04);border-radius:28px;background:var(--white);box-shadow:var(--shadow);height:390px}.chart-y-axis{display:flex;flex-direction:column;justify-content:space-between;height:270px;color:var(--muted);font-size:12px}.chart-area{height:300px;display:flex;align-items:stretch;justify-content:space-around;gap:8px;background:repeating-linear-gradient(to bottom,var(--line) 0,var(--line) 1px,transparent 1px,transparent 67.5px)}.month-group{min-width:34px;flex:1;display:grid;grid-template-rows:270px 30px;align-items:end;text-align:center;color:var(--muted);font-size:12px}.bars{height:270px;display:flex;align-items:end;justify-content:center;gap:6px}.bar{width:min(15px,35%);min-height:2px;border-radius:8px 8px 3px 3px;transition:height .5s ease}.bar.income{background:var(--indigo)}.bar.expense{background:linear-gradient(var(--bright),var(--violet))}.chart-legend{position:absolute;left:54px;bottom:20px;display:flex;gap:24px;color:var(--muted);font-size:13px}.chart-legend span{display:flex;align-items:center;gap:7px}.chart-legend i{width:11px;height:11px;border-radius:4px}.income-dot{background:var(--indigo)}.expense-dot{background:var(--violet)}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}.money-card{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:210px;padding:24px;border-radius:26px;color:#fff}.income-card{background:linear-gradient(140deg,#19003e,#2f1462)}.expense-card{background:linear-gradient(140deg,var(--violet),var(--bright))}.direction{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--indigo);font-size:24px;font-weight:800}.expense-card .direction{color:var(--violet)}.watermark{position:absolute;right:-8px;bottom:-25px;color:rgba(9,0,45,.22);font-size:150px;font-weight:800;line-height:1}.money-card div{position:relative;z-index:1}.money-card p{margin:0 0 7px;color:rgba(255,255,255,.65);font-size:13px}.money-card strong{font:700 clamp(22px,4vw,31px) Manrope,sans-serif}.transactions-section{margin-top:54px}.kicker{margin:0 0 5px;color:var(--violet);font-size:10px;font-weight:800;letter-spacing:.16em}.filters{display:flex;padding:4px;border-radius:12px;background:var(--lavender)}.filter-button{border:0;border-radius:9px;padding:7px 12px;background:transparent;color:#6d5c85;font-weight:700;font-size:12px;cursor:pointer}.filter-button.active{background:#fff;color:var(--violet);box-shadow:0 3px 10px rgba(69,19,126,.09)}.transaction-list{background:var(--white);border-radius:24px;padding:0 22px;box-shadow:var(--shadow)}.transaction-item{display:grid;grid-template-columns:46px 1fr auto auto;align-items:center;gap:13px;padding:17px 0;border-bottom:1px solid var(--line)}.transaction-item:last-child{border:0}.category-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--lavender);color:var(--violet);font-size:19px}.transaction-main{display:flex;min-width:0;flex-direction:column}.transaction-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transaction-meta{margin-top:4px;color:var(--muted);font-size:11px}.transaction-amount{font-family:Manrope,sans-serif;white-space:nowrap}.income-text{color:var(--indigo)}.expense-text{color:var(--violet)}.transaction-actions{display:flex;gap:2px}.transaction-actions button{border:0;background:transparent;color:var(--muted);cursor:pointer}.edit-button{font-size:11px}.delete-button{font-size:18px}.empty-state{padding:55px 20px;text-align:center;color:var(--muted)}.empty-state strong{display:block;margin-bottom:5px;color:var(--ink)}.bottom-nav{position:fixed;z-index:10;left:50%;bottom:18px;transform:translateX(-50%);width:min(calc(100% - 24px),760px);height:84px;display:grid;grid-template-columns:1fr 1fr 90px 1fr 1fr;align-items:center;padding:8px 16px;border:1px solid rgba(18,10,40,.05);border-radius:28px;background:rgba(255,255,255,.94);box-shadow:0 18px 50px rgba(30,10,70,.16);backdrop-filter:blur(16px)}.nav-item{display:flex;flex-direction:column;align-items:center;gap:5px;border:0;background:none;color:var(--muted);text-decoration:none;font-size:10px;cursor:pointer}.nav-item span{font-size:22px;line-height:1}.nav-item.active{color:var(--violet)}.add-button{align-self:start;justify-self:center;display:grid;place-items:center;width:72px;height:72px;margin-top:-28px;border:8px solid var(--bg);border-radius:50%;background:linear-gradient(145deg,var(--bright),var(--violet));box-shadow:0 10px 26px rgba(118,23,232,.35);color:#fff;font-size:37px;font-weight:300;cursor:pointer}dialog{width:min(calc(100% - 32px),520px);padding:0;border:0;border-radius:28px;background:#fff;box-shadow:0 30px 90px rgba(20,5,50,.3)}dialog::backdrop{background:rgba(18,10,40,.48);backdrop-filter:blur(4px)}#transactionForm{padding:28px}.dialog-heading{display:flex;align-items:start;justify-content:space-between;margin-bottom:22px}.close-button{width:34px;height:34px;border:0;border-radius:50%;background:var(--bg);color:var(--muted);font-size:22px;cursor:pointer}.type-switch{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;margin-bottom:18px;border-radius:13px;background:var(--lavender)}.type-button{padding:10px;border:0;border-radius:9px;background:transparent;color:#756287;font-weight:800;cursor:pointer}.type-button.active{background:#fff;color:var(--violet);box-shadow:0 3px 10px rgba(69,19,126,.09)}label{display:block;margin:14px 0 7px;color:#5d5868;font-size:12px;font-weight:700}input,dialog select{width:100%;height:46px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:white;color:var(--ink);font:inherit;outline:none}input:focus,dialog select:focus{border-color:var(--violet);box-shadow:0 0 0 3px rgba(118,23,232,.1)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.money-input{position:relative}.money-input span{position:absolute;left:13px;top:12px;color:var(--muted)}.money-input input{padding-left:28px}.save-button{width:100%;margin-top:22px;padding:13px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--violet),var(--bright));color:#fff;font-weight:800;cursor:pointer}.cancel-edit{width:100%;margin-top:10px;border:0;background:none;color:var(--muted);cursor:pointer}.hidden{display:none}
@media(max-width:620px){.app{width:min(100% - 28px,900px)}.topbar{height:75px}.brand{font-size:0}.topbar h1{font-size:20px}.balance-section{padding:25px 2px 30px}.balance-section strong{font-size:45px}.chart-card{height:340px;padding:22px 13px 52px 5px;grid-template-columns:34px 1fr}.chart-area,.bars{height:230px}.month-group{grid-template-rows:230px 30px}.chart-y-axis{height:230px}.chart-area{background:repeating-linear-gradient(to bottom,var(--line) 0,var(--line) 1px,transparent 1px,transparent 57.5px)}.chart-legend{left:38px}.summary-grid{gap:10px}.money-card{min-height:175px;padding:18px;border-radius:20px}.watermark{font-size:110px}.money-card strong{font-size:18px}.transactions-section{margin-top:42px}.transactions-section>.section-title-row{align-items:start;flex-direction:column}.transaction-list{padding:0 15px}.transaction-item{grid-template-columns:42px 1fr auto}.transaction-actions{grid-column:2/-1;justify-self:end;margin-top:-8px}.bottom-nav{bottom:8px;height:76px;padding:7px 5px;grid-template-columns:1fr 1fr 76px 1fr 1fr}.nav-item{font-size:9px}.nav-item span{font-size:20px}.add-button{width:64px;height:64px}.field-row{grid-template-columns:1fr}}