:root{--font-main:"Manrope", "Segoe UI", sans-serif;--font-heading:"Space Grotesk", "Segoe UI", sans-serif;--color-bg:#f3f6ff;--color-surface:#fff;--color-surface-soft:#f7f9ff;--color-text:#1f2440;--color-text-muted:#5f6887;--color-border:#dfe4f6;--color-primary:#2f5bff;--color-primary-dark:#2548cc;--color-income:#0f9b6f;--color-expense:#d13d57;--color-balance:#7a4cff;--color-danger:#c7364f;--shadow-soft:0 12px 30px #314fc414;--shadow-card:0 8px 22px #1b2d711f;--radius-lg:24px;--radius-md:16px;--radius-sm:12px;--space-1:8px;--space-2:12px;--space-3:16px;--space-4:20px;--space-5:28px;--space-6:36px}*{box-sizing:border-box}body{font-family:var(--font-main);color:var(--color-text);background:radial-gradient(circle at 10% 10%,#e7ecff 0%,#0000 40%),radial-gradient(circle at 80% 0,#dff8f4 0%,#0000 36%),linear-gradient(145deg,#f3f6ff 0%,#eef2ff 46%,#f8fbff 100%);margin:0}#root{min-height:100vh}button,input{font:inherit}.app{min-height:100vh;padding:var(--space-6) var(--space-3);position:relative;overflow:hidden}.app__decor{filter:blur(10px);opacity:.4;pointer-events:none;border-radius:50%;width:320px;height:320px;position:absolute}.app__decor--left{background:#bfd0ff;top:-120px;left:-110px}.app__decor--right{background:#bfefe1;bottom:-120px;right:-100px}.app__container{gap:var(--space-4);max-width:980px;margin:0 auto;display:grid;position:relative}.app__header{gap:var(--space-1);display:grid}.app__eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--color-primary);margin:0;font-size:.8rem;font-weight:700}.app__title{font-family:var(--font-heading);margin:0;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.1}.app__panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);padding:var(--space-4);background:#ffffffa3;border:1px solid #ffffff73}.summary{gap:var(--space-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.summary__card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);box-shadow:var(--shadow-soft);gap:var(--space-1);display:grid}.summary__label{color:var(--color-text-muted);margin:0;font-size:.9rem;font-weight:600}.summary__value{font-size:clamp(1.4rem,2.6vw,2rem);font-family:var(--font-heading);margin:0;font-weight:700}.summary__card--income{border-top:4px solid var(--color-income)}.summary__card--expense{border-top:4px solid var(--color-expense)}.summary__card--balance{border-top:4px solid var(--color-balance)}.entry-form{gap:var(--space-3);display:grid}.entry-form__field{gap:var(--space-1);display:grid}.entry-form__label{color:var(--color-text-muted);font-size:.9rem;font-weight:600}.entry-form__input{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);width:100%;color:var(--color-text);outline:none;padding:12px 14px;transition:border-color .2s,box-shadow .2s}.entry-form__input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #2f5bff2e}.entry-form__switch{border-radius:var(--radius-sm);background:var(--color-surface-soft);border:1px solid var(--color-border);grid-template-columns:repeat(2,minmax(0,1fr));padding:4px;display:grid}.entry-form__switch-btn{border-radius:calc(var(--radius-sm) - 4px);color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;padding:10px;font-weight:700;transition:background-color .2s,color .2s}.entry-form__switch-btn--active-expense{color:var(--color-expense);background:#d13d5726}.entry-form__switch-btn--active-income{color:var(--color-income);background:#0f9b6f24}.entry-form__error{color:var(--color-danger);margin:0;font-size:.88rem;font-weight:600}.entry-form__actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.entry-form__action{border-radius:var(--radius-sm);cursor:pointer;border:0;padding:11px 18px;font-weight:700}.entry-form__action--submit{background:var(--color-primary);color:#fff}.entry-form__action--submit:hover{background:var(--color-primary-dark)}.entry-form__action--cancel{color:#3f4d89;background:#eceffd}.filter{gap:var(--space-3);display:grid}.filter__tabs{gap:var(--space-2);flex-wrap:wrap;display:flex}.filter__tab{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);cursor:pointer;border-radius:999px;padding:9px 14px;font-weight:700}.filter__tab--active{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.filter__list{gap:var(--space-2);display:grid}.filter__empty{border:1px dashed var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-soft);color:var(--color-text-muted);text-align:center;padding:var(--space-3);margin:0}.entry-row{justify-content:space-between;align-items:center;gap:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);box-shadow:var(--shadow-soft);display:flex}.entry-row__main{gap:4px;display:grid}.entry-row__title{margin:0;font-weight:700}.entry-row__amount{font-family:var(--font-heading);margin:0;font-weight:700}.entry-row__type{text-transform:capitalize;margin:0;font-size:.84rem;font-weight:700}.entry-row__type--income{color:var(--color-income)}.entry-row__type--expense{color:var(--color-expense)}.entry-row__actions{gap:var(--space-1);display:flex}.entry-row__action{text-transform:capitalize;cursor:pointer;border:0;border-radius:10px;padding:8px 12px;font-size:.85rem;font-weight:700}.entry-row__action--delete{color:var(--color-expense);background:#ffe8ed}.entry-row__action--edit{color:var(--color-primary);background:#e8f1ff}.pagination{justify-content:space-between;align-items:center;gap:var(--space-2);margin-top:var(--space-1);display:flex}.pagination__btn{border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;border-radius:10px;padding:7px 12px;font-weight:700}.pagination__btn:disabled{opacity:.45;cursor:not-allowed}.pagination__label{color:var(--color-text-muted);font-size:.9rem}@media (width<=840px){.summary{grid-template-columns:1fr}.entry-row{flex-direction:column;align-items:flex-start}.entry-row__actions{width:100%}.entry-row__action{flex:1}}@media (width<=560px){.app{padding:var(--space-4) var(--space-2)}.app__panel{padding:var(--space-3)}.pagination{flex-wrap:wrap}}
