:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(145deg,#eef3f7 0%,#f5edf5 100%);min-height:100vh;padding:12px;font-family:system-ui,-apple-system,sans-serif}.app{-webkit-backdrop-filter:blur(20px);background:#ffffffc7;border:1px solid #fff9;border-radius:20px;max-width:1200px;margin:0 auto;padding:20px;box-shadow:0 8px 32px #9696b41f}h1{color:#5b4a7a;letter-spacing:.5px;margin-bottom:4px;font-size:1.5rem;font-weight:700}h1:before{content:"✨ "}.toolbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff80;border:1px solid #fff6;border-radius:14px;flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0 14px;padding:12px 16px;display:flex}.toolbar input[type=month]{color:#4a3a5e;background:#fff;border:1px solid #d5cde6;border-radius:10px;flex:1;min-width:120px;padding:6px 12px;font-size:.85rem}.toolbar input[type=month]:focus{border-color:#b8a5d6;outline:none;box-shadow:0 0 0 3px #b8a5d626}.toolbar label{color:#5b4a7a;align-items:center;gap:6px;font-size:.85rem;font-weight:500;display:flex}.toolbar input[type=number]{color:#4a3a5e;background:#fff;border:1px solid #d5cde6;border-radius:10px;width:80px;padding:6px 10px}.toolbar input[type=number]:focus{border-color:#b8a5d6;outline:none;box-shadow:0 0 0 3px #b8a5d626}.toolbar button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#b8a5d6,#9b8abf);border:none;border-radius:10px;padding:6px 16px;font-size:.8rem;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #9b8abf33}.toolbar button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #9b8abf4d}.toolbar button:active{transform:scale(.97)}.stats{grid-template-columns:repeat(3,1fr);gap:10px;margin:10px 0 14px;display:grid}.stat-card{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff9;border:1px solid #ffffff80;border-radius:14px;padding:12px 14px;transition:all .25s;box-shadow:0 2px 12px #9696b40d}.stat-card:hover{transform:translateY(-3px);box-shadow:0 6px 20px #9696b41a}.stat-card .label{color:#8a7a9e;letter-spacing:.3px;margin-bottom:2px;font-size:.7rem;font-weight:500;display:block}.stat-card .value{color:#3d2e52;font-size:1.2rem;font-weight:700}.stat-card.income{background:#e8f8ebb3;border-color:#a8c4b866}.stat-card.income .value{color:#5b8a6f}.stat-card.expense{background:#fff0f0b3;border-color:#d4a5a566}.stat-card.expense .value{color:#c47a7a}.stat-card.balance{background:#f0f2ffb3;border-color:#8ba3c466}.stat-card.balance .value{color:#6a8bae}.alert{color:#b71c1c;background:linear-gradient(135deg,#fce4e4,#f8d7d7);border:1px solid #d4a5a54d;border-radius:12px;margin:8px 0 14px;padding:10px 16px;font-size:.85rem;font-weight:600;animation:2s infinite pulseAlert;box-shadow:0 2px 12px #d4a5a514}@keyframes pulseAlert{0%,to{opacity:1}50%{opacity:.75}}.dashboard{flex-direction:column;gap:16px;margin:14px 0;display:flex}.chart-area{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff4d;border:1px solid #ffffff4d;border-radius:16px;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:10px;padding:12px;display:flex}.pie-wrapper{text-align:center;flex:1;width:100%;min-width:200px;max-width:400px}.pie-title{margin-bottom:2px;font-size:.85rem;font-weight:600}.income-title{color:#5b8a6f}.expense-title{color:#c47a7a}.empty-chart{color:#b5a8c4;padding:30px 0;font-size:.85rem}.pie-container{justify-content:center;width:100%;padding:4px 0;display:flex;overflow-x:auto}.pie-container .recharts-wrapper{max-width:100%;height:auto!important}.pie-toggle{background:#ffffff4d;border:1px solid #b8a5d64d;border-radius:12px;justify-content:center;gap:0;margin-bottom:6px;display:flex;overflow:hidden}.pie-toggle button{cursor:pointer;color:#8a7a9e;background:0 0;border:none;flex:1;padding:6px 20px;font-size:.85rem;font-weight:600;transition:all .25s}.pie-toggle button.active{color:#fff;background:linear-gradient(135deg,#b8a5d6,#9b8abf);box-shadow:0 2px 12px #9b8abf40}.pie-toggle button:first-child.active{background:linear-gradient(135deg,#a8c4b8,#8baf9e)}.pie-toggle button:last-child.active{background:linear-gradient(135deg,#d4a5a5,#c47a7a)}.pie-toggle button:hover:not(.active){background:#b8a5d61a}.legend-list{flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:0;padding:8px 4px 0;list-style:none;display:flex}.legend-item{color:#4a3a5e;align-items:center;gap:4px;font-size:11px;display:flex}.legend-color{border-radius:3px;flex-shrink:0;width:10px;height:10px;display:inline-block}.legend-name{font-weight:500}.legend-percent{color:#8a7a9e;font-size:10px;font-weight:600}.form-area{width:100%}.transaction-form{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff80;border:1px solid #fff6;border-radius:16px;padding:16px}.transaction-form h3{color:#4a3a5e;margin-bottom:12px;font-size:1rem;font-weight:600}.form-row{flex-wrap:wrap;gap:8px;margin-bottom:10px;display:flex}.form-row input,.form-row select{color:#3d2e52;background:#fff;border:1px solid #ddd0e8;border-radius:10px;flex:1;min-width:80px;padding:8px 12px;font-size:.85rem;transition:all .2s}.form-row input:focus,.form-row select:focus{border-color:#b8a5d6;outline:none;box-shadow:0 0 0 3px #b8a5d61f}.form-row input::placeholder{color:#c5b8d0}.form-row button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#b8a5d6,#9b8abf);border:none;border-radius:10px;padding:8px 18px;font-size:.85rem;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #9b8abf26}.form-row button:hover{transform:translateY(-2px);box-shadow:0 4px 16px #9b8abf40}.form-row button[type=button]{box-shadow:none;background:#d5cde6}.form-row button[type=button]:hover{background:#c8bddb;transform:none}.list{margin-top:16px}.day-group{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff6;border:1px solid #ffffff4d;border-radius:12px;margin-bottom:10px;padding:10px 14px}.day-group h4{color:#6a5a7e;border-bottom:1px solid #0000000a;margin-bottom:8px;padding-bottom:6px;font-size:.8rem;font-weight:600}.transaction-item{background:#ffffff80;border-left:3px solid;border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:4px;padding:6px 10px;font-size:.8rem;transition:all .15s;display:flex}.transaction-item:hover{background:#ffffffd9}.transaction-item span{color:#3d2e52}.transaction-item span:last-of-type{font-weight:600}.transaction-item button{cursor:pointer;background:0 0;border:none;border-radius:6px;margin-left:4px;padding:2px 4px;font-size:14px;transition:background .15s}.transaction-item button:hover{background:#0000000d}.empty{text-align:center;color:#b5a8c4;padding:20px 0;font-size:.9rem}@media (width<=768px){body{padding:8px}.app{border-radius:16px;padding:12px}h1{font-size:1.2rem}.stats{grid-template-columns:1fr 1fr 1fr;gap:6px}.stat-card{border-radius:10px;padding:8px 6px}.stat-card .value{font-size:.95rem}.stat-card .label{font-size:.6rem}.toolbar{gap:6px;padding:10px 12px}.toolbar input[type=month]{min-width:100px;padding:4px 8px;font-size:.75rem}.toolbar label{font-size:.75rem}.toolbar input[type=number]{width:60px;padding:4px 6px;font-size:.75rem}.toolbar button{padding:4px 12px;font-size:.7rem}.chart-area{gap:6px;padding:8px}.pie-wrapper{min-width:140px;max-width:100%}.pie-title{font-size:.75rem}.empty-chart{padding:20px 0;font-size:.75rem}.pie-toggle button{padding:5px 12px;font-size:.75rem}.pie-container .recharts-wrapper{transform-origin:50%;transform:scale(.85)}.legend-item{gap:3px;font-size:10px}.legend-color{width:8px;height:8px}.legend-percent{font-size:9px}.legend-list{gap:4px 10px}.transaction-form{padding:12px}.transaction-form h3{margin-bottom:8px;font-size:.85rem}.form-row input,.form-row select{min-width:60px;padding:6px 8px;font-size:.75rem}.form-row button{padding:6px 12px;font-size:.75rem}.day-group{padding:8px 10px}.day-group h4{font-size:.7rem}.transaction-item{padding:4px 8px;font-size:.7rem}.transaction-item button{font-size:12px}}@media (width<=420px){.stats{grid-template-columns:1fr 1fr 1fr;gap:4px}.stat-card .value{font-size:.8rem}.stat-card .label{font-size:.55rem}.pie-wrapper{min-width:120px;max-width:100%}.pie-title{font-size:.65rem}.pie-toggle button{padding:4px 8px;font-size:.65rem}.pie-container .recharts-wrapper{transform-origin:50%;transform:scale(.7)}.legend-item{font-size:9px}.legend-color{width:7px;height:7px}.legend-percent{font-size:8px}.legend-list{gap:3px 8px}.toolbar input[type=month]{min-width:80px;font-size:.65rem}.toolbar label{font-size:.65rem}.toolbar input[type=number]{width:50px;font-size:.65rem}.toolbar button{padding:3px 8px;font-size:.6rem}.form-row input,.form-row select{min-width:50px;padding:4px 6px;font-size:.65rem}.form-row button{padding:4px 10px;font-size:.65rem}.transaction-item{flex-wrap:wrap;gap:2px;padding:3px 6px;font-size:.6rem}.transaction-item button{font-size:10px}.day-group h4{font-size:.6rem}}@media (width>=768px) and (width<=1024px){.pie-wrapper{max-width:360px}.pie-container .recharts-wrapper{transform-origin:50%;transform:scale(.9)}}
