.page-header{margin-bottom:var(--space-6);justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.page-header__left{align-items:center;gap:var(--space-4);display:flex}.page-header__title{font-size:var(--text-2xl);font-weight:var(--font-bold);letter-spacing:-.02em}.page-header__subtitle{font-size:var(--text-sm);color:var(--color-text-tertiary)}.page-header__actions{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}@media (max-width:768px){.page-header{align-items:stretch;gap:var(--space-4);flex-direction:column}.page-header__actions{gap:var(--space-3);grid-template-columns:1fr 2fr;display:grid}.page-header__actions .btn{width:100%;padding:var(--space-3) var(--space-2);justify-content:center}}.filters-bar{align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.filters-bar__group{align-items:center;gap:var(--space-2);display:flex}.filters-bar__label{font-size:var(--text-xs);color:var(--color-text-tertiary);font-weight:var(--font-medium);white-space:nowrap}@media (max-width:480px){.filters-bar{flex-direction:column;align-items:stretch}}.summary-row{gap:var(--space-4);margin-bottom:var(--space-6);grid-template-columns:repeat(3,1fr);display:grid}@media (max-width:768px){.summary-row{grid-template-columns:1fr}}.chart-layout{gap:var(--space-6);align-items:center;display:flex}.chart-layout__donut{flex-shrink:0;width:200px;height:200px;position:relative}.chart-layout__legend{flex-direction:column;flex:1;gap:0;min-width:0;display:flex}@media (max-width:640px){.chart-layout{flex-direction:column;align-items:stretch}.chart-layout__donut{width:180px;height:180px;margin:0 auto}.chart-layout__legend{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.chart-layout__legend .category-breakdown-item__name{white-space:normal;overflow:visible}}.transactions-list{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.transactions-group{border-bottom:1px solid var(--color-border)}.transactions-group:last-child{border-bottom:none}.transactions-group__date{padding:var(--space-3) var(--space-4);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-tertiary);background:var(--color-bg-tertiary);text-transform:uppercase;letter-spacing:.06em}.envelopes-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.envelope-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}.envelope-card:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.envelope-card--over-budget{border-color:#ef44444d}.envelope-card__header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.envelope-card__icon{border-radius:var(--radius-md);width:40px;height:40px;font-size:var(--text-lg);flex-shrink:0;justify-content:center;align-items:center;display:flex}.envelope-card__name{font-size:var(--text-base);font-weight:var(--font-semibold)}.envelope-card__amounts{margin-bottom:var(--space-3);justify-content:space-between;align-items:baseline;display:flex}.envelope-card__spent{font-size:var(--text-lg);font-weight:var(--font-bold)}.envelope-card__target{font-size:var(--text-sm);color:var(--color-text-tertiary)}.envelope-card__percentage{font-size:var(--text-xs);color:var(--color-text-tertiary);text-align:right;margin-top:var(--space-1)}.savings-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.savings-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);cursor:pointer;transition:all var(--transition-fast)}.savings-card:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.savings-card__header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.savings-card__icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.savings-card__info{flex:1}.savings-card__name{font-size:var(--text-base);font-weight:var(--font-semibold)}.savings-card__date{font-size:var(--text-xs);color:var(--color-text-tertiary)}.savings-card__amounts{margin-bottom:var(--space-3);justify-content:space-between;align-items:baseline;display:flex}.savings-card__current{font-size:var(--text-xl);font-weight:var(--font-bold)}.savings-card__target{font-size:var(--text-sm);color:var(--color-text-tertiary)}.savings-card__percentage{font-size:var(--text-sm);color:var(--color-text-secondary);text-align:right;margin-top:var(--space-1);font-weight:var(--font-semibold)}.iou-list{gap:var(--space-3);flex-direction:column;display:flex}.iou-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);transition:all var(--transition-fast)}.iou-card:hover{border-color:var(--color-border-hover)}.iou-card__header{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.iou-card__borrower{font-size:var(--text-base);font-weight:var(--font-semibold)}.iou-card__status{display:inline-flex}.iou-card__details{margin-bottom:var(--space-3);justify-content:space-between;align-items:baseline;display:flex}.iou-card__amount{font-size:var(--text-xl);font-weight:var(--font-bold)}.iou-card__remaining{font-size:var(--text-sm);color:var(--color-text-tertiary)}.iou-card__meta{gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-tertiary);display:flex}.iou-card__actions{gap:var(--space-2);margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border);display:flex}.rules-list{gap:var(--space-3);flex-direction:column;display:flex}.rule-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);align-items:center;gap:var(--space-4);transition:all var(--transition-fast);display:flex}.rule-card:hover{border-color:var(--color-border-hover)}.rule-card__icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.rule-card__info{flex:1;min-width:0}.rule-card__name{font-size:var(--text-base);font-weight:var(--font-semibold)}.rule-card__frequency{font-size:var(--text-xs);color:var(--color-text-tertiary)}.rule-card__amount{font-size:var(--text-lg);font-weight:var(--font-bold);white-space:nowrap}.rule-card__actions{align-items:center;gap:var(--space-2);display:flex}.settings-sections{gap:var(--space-6);flex-direction:column;display:flex}.settings-section{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.settings-section__header{padding:var(--space-5);border-bottom:1px solid var(--color-border)}.settings-section__title{font-size:var(--text-base);font-weight:var(--font-semibold)}.settings-section__body{padding:var(--space-5);gap:var(--space-5);flex-direction:column;display:flex}.settings-row{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.settings-row__label{font-size:var(--text-sm);font-weight:var(--font-medium)}.settings-row__description{font-size:var(--text-xs);color:var(--color-text-tertiary);margin-top:2px}.settings-row__control{flex-shrink:0}.toggle{border-radius:var(--radius-full);background:var(--color-bg-tertiary);border:1px solid var(--color-border);cursor:pointer;width:48px;height:26px;transition:all var(--transition-fast);position:relative}.toggle--active{background:var(--color-accent);border-color:var(--color-accent)}.toggle__thumb{width:20px;height:20px;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.toggle--active .toggle__thumb{transform:translate(22px)}@media (max-width:640px){.settings-row{align-items:flex-start;gap:var(--space-2);flex-direction:column}.settings-row__control{width:100%}.settings-row__control select,.settings-row__control input,.settings-row__control .btn{width:100%;max-width:100%}}
