.feature-messages { display: grid; gap: .7rem; margin-bottom: 1rem; }
.feature-message { padding: .9rem 1rem; border-radius: 1rem; font-weight: 750; }
.feature-message--success { background: color-mix(in srgb, var(--color-success) 13%, transparent); color: var(--color-success); }
.feature-message--error { background: color-mix(in srgb, var(--color-error) 13%, transparent); color: var(--color-error); }
.feature-create-card, .recurring-card, .feature-empty {
  padding: 1.25rem; border: 1px solid color-mix(in srgb, var(--color-base-content) 10%, transparent);
  border-radius: 1.5rem; background: var(--color-base-100); box-shadow: 0 12px 30px rgb(15 23 42 / .07);
}
.feature-create-card { margin-bottom: 1.5rem; }
.feature-create-card label > span, .recurring-card label > span, .savings-goal-main-fields label > span {
  display: block; margin: 0 0 .4rem .15rem; font-size: .78rem; font-weight: 850;
}
.feature-create-card input, .feature-create-card select, .recurring-card input, .recurring-card select,
.savings-goal-main-fields input, .savings-goal-main-fields select, .feature-member-share input {
  width: 100%; min-height: 2.8rem; padding: .65rem .85rem; border: 1px solid color-mix(in srgb, var(--color-base-content) 20%, transparent);
  border-radius: .9rem; background: color-mix(in srgb, var(--color-base-200) 68%, var(--color-base-100)); outline: none;
}
.feature-create-card input:focus, .feature-create-card select:focus, .recurring-card input:focus, .recurring-card select:focus {
  border-color: var(--color-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 14%, transparent);
}
.feature-primary-button { min-height: 2.8rem; padding: .65rem 1.2rem; border-radius: .9rem; background: var(--color-primary); color: var(--color-primary-content); font-weight: 850; }
.feature-delete-button { min-height: 2.8rem; padding: .65rem 1rem; border-radius: .9rem; color: var(--color-error); font-weight: 800; }
.feature-empty { text-align: center; margin-top: 1rem; }
.feature-empty h2 { font-size: 1.2rem; font-weight: 900; }
.feature-empty p { margin-top: .35rem; opacity: .62; }
.feature-section-heading, .feature-total { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; }
.feature-section-heading h3 { font-weight: 900; }.feature-section-heading p { font-size: .85rem; opacity: .6; }
.feature-section-heading strong { color: var(--color-primary); }.feature-section-heading strong.is-invalid { color: var(--color-error); }
.feature-member-share { padding: 1rem; border-radius: 1.1rem; background: color-mix(in srgb, var(--color-base-200) 70%, transparent); }
.feature-member-share > span { font-weight: 850; }.feature-member-share > div { display: flex; align-items: center; gap: .5rem; margin-top: .55rem; }
.feature-member-share small { display: block; margin-top: .5rem; opacity: .6; }
.feature-total { padding: 1rem; border-radius: 1rem; background: color-mix(in srgb, var(--color-primary) 8%, transparent); font-weight: 800; }
.feature-submit { display: flex; justify-content: flex-end; margin-top: 1rem; }
.recurring-create-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: .8rem; }
.recurring-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.recurring-card-title { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }.recurring-card-title h2 { font-size: 1.1rem; font-weight: 900; }.recurring-card-title p { font-size: .8rem; opacity: .58; }.recurring-card-title strong { color: var(--color-error); font-size: 1.1rem; }
.recurring-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }.recurring-card-actions { display: flex; justify-content: space-between; margin-top: 1rem; }
.planning-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
.planning-card { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; min-height: 10rem; padding: 1.4rem; border: 1px solid color-mix(in srgb, var(--color-base-content) 10%, transparent); border-radius: 1.5rem; background: var(--color-base-100); box-shadow: 0 14px 36px rgb(15 23 42 / .08); transition: transform .16s ease, box-shadow .16s ease; }
.planning-card[href]:hover { transform: translateY(-3px); box-shadow: 0 20px 42px rgb(15 23 42 / .13); }
.planning-card-icon { display: grid; width: 3.2rem; height: 3.2rem; place-items: center; border-radius: 1rem; background: color-mix(in srgb, var(--color-primary) 13%, transparent); color: var(--color-primary); font-size: 1.25rem; font-weight: 900; }
.planning-card h2 { margin-top: .15rem; font-size: 1.35rem; font-weight: 900; }.planning-card p { margin-top: .35rem; opacity: .62; }.planning-kicker { color: var(--color-primary); font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }.planning-arrow { font-size: 1.7rem; color: var(--color-primary); }.planning-badge { padding: .35rem .65rem; border-radius: 999px; background: var(--color-base-200); font-size: .75rem; font-weight: 850; }.planning-card.is-coming { opacity: .72; }
@media (max-width: 900px) { .recurring-create-grid, .recurring-card-grid, .planning-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .recurring-edit-grid { grid-template-columns: 1fr; }.planning-card { grid-template-columns: auto 1fr; }.planning-card > :last-child { grid-column: 2; }.feature-submit .feature-primary-button { width: 100%; } }
