:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;--color-bg: #f5f7fa;--color-primary: #4a90e2;--color-expense: #e74c3c;--color-income: #2ecc71;--color-expense-light: #fdecea;--color-income-light: #e6f9f0;--color-text: #2c3e50;--color-text-light: #7f8c8d;--color-border: #dfe6e9;--color-white: #ffffff;--spacing-xs: .5rem;--spacing-sm: .75rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--border-radius: 8px;--shadow: 0 2px 8px rgba(0, 0, 0, .1)}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--color-bg);color:var(--color-text);line-height:1.6;padding:var(--spacing-xl)}.app{max-width:900px;margin:0 auto}.app__title{font-size:2.5rem;font-weight:700;color:var(--color-text);text-align:center;margin-bottom:var(--spacing-xl)}.balance{background:var(--color-white);padding:var(--spacing-xl);border-radius:var(--border-radius);box-shadow:var(--shadow);text-align:center;margin-bottom:var(--spacing-xl)}.balance__label{font-size:1rem;color:var(--color-text-light);margin-right:var(--spacing-xs)}.balance__amount{font-size:2rem;font-weight:700;color:var(--color-text)}.form-section{background:var(--color-white);padding:var(--spacing-xl);border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:var(--spacing-xl)}.transaction-form{display:grid;grid-template-columns:auto 1fr 1fr auto;gap:var(--spacing-md);align-items:end}.transaction-form__field{display:flex;flex-direction:column;gap:var(--spacing-xs)}.transaction-form__label{font-weight:600;font-size:.875rem;color:var(--color-text)}.transaction-form__input,.transaction-form__select{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius);font-size:1rem;font-family:inherit;transition:border-color .2s}.transaction-form__input:focus,.transaction-form__select:focus{outline:none;border-color:var(--color-primary)}.transaction-form__submit{padding:var(--spacing-md) var(--spacing-lg);background:var(--color-primary);color:var(--color-white);border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s;white-space:nowrap}.transaction-form__submit:hover{background:#357abd}.transaction-form__submit:active{transform:translateY(1px)}.transactions{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg)}.transactions__column{display:flex;flex-direction:column}.transaction-section{background:var(--color-white);border-radius:var(--border-radius);box-shadow:var(--shadow);padding:var(--spacing-lg);display:flex;flex-direction:column;height:100%}.transaction-section--expense{background-color:var(--color-expense-light)}.transaction-section--income{background-color:var(--color-income-light)}.transaction-section__title{font-size:1.25rem;font-weight:700;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border)}.transaction-section--expense .transaction-section__title,.transaction-section--income .transaction-section__title{color:var(--color-text);border-bottom-color:var(--color-text)}.transaction-section__content{display:flex;flex-direction:column;flex:1}.transaction-list{display:flex;flex-direction:column;gap:8px;flex:1;margin-bottom:var(--spacing-md);min-height:200px}.transaction{display:flex;width:100%;gap:16px}.transaction__description{margin-right:auto}.transaction-section__total{padding-top:var(--spacing-md);border-top:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center}.transaction-section__total-label{font-weight:600;color:var(--color-text-light)}.transaction-section__total-amount{font-size:1.25rem;font-weight:700}.transaction-section--expense .transaction-section__total-amount,.transaction-section--income .transaction-section__total-amount{color:var(--color-text)}@media(max-width:768px){body{padding:var(--spacing-md)}.transaction-form,.transactions{grid-template-columns:1fr}.balance__amount{font-size:1.5rem}}