/* FENN modern shared surface — loaded after each page-specific stylesheet. */
:root { --bg: #f8f9f8; --bg-elev: #ffffff; --bg-soft: #eef4f1; --line: #e1e6e3; --text: #15202b; --muted: #66717a; --accent: #0f6b63; --accent-soft: #e4f2ed; --panel: #ffffff; --shadow: 0 5px 20px rgba(28, 48, 47, .055); --radius: 16px; --radius-sm: 11px; --font-display: "Playfair Display", Georgia, serif; --font-body: "DM Sans", "Manrope", system-ui, sans-serif; --sans: var(--font-body); }
html, body { background: #f8f9f8; color: var(--text); }
.shell { max-width: 1480px; padding-left: 1.5rem; padding-right: 1.5rem; }
.top { min-height: 82px; align-items: center; border-bottom: 0; padding-top: 0; padding-bottom: 0; }
.brand { color: #0c5b57; font-family: var(--font-display); font-size: 2.25rem; letter-spacing: .02em; }
.subtitle { font-family: var(--sans); font-size: .82rem; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
h1, h2, h3 { letter-spacing: -.025em; }
.hero, .answer { border-radius: 18px; }
.panel, .card, .tile, .overview-card, .metric, .table, .empty, .next-step, .setup-entry, .error, .filters, .view-toggle, .spending-summary, .cash-movement, .merchant-list, .tx-list { border-color: var(--line); box-shadow: var(--shadow); }
button, .button, .btn-primary, .activity-link, .setup-entry-link { border-radius: 9px; }
button, .button, .btn-primary { background: var(--btn-bg); }
input, select, textarea { border-color: var(--line); border-radius: 9px; background: #fff; }
@media (max-width: 720px) { .shell { padding-left: 1rem; padding-right: 1rem; }.top { min-height: 68px; }.brand { font-size: 1.9rem; } }