@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { --bg:#f4fbfb; --surface:#ffffff; --surface-2:#eef8f7; --surface-3:#e5f3f3; --line:#d8e8e8; --text:#101719; --muted:#6f8386; --soft:#3d5053; --mint:#0aa7a0; --mint-2:#078b97; --blue:#4777c5; --orange:#d78829; --red:#d65757; --shadow:0 18px 55px rgba(24,78,85,.10); }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:var(--bg); color:var(--text); font-family:'DM Sans',sans-serif; }
body { background-image:radial-gradient(circle at 70% -10%, rgba(8,214,176,.08), transparent 25%),radial-gradient(circle at 100% 70%, rgba(117,167,255,.06), transparent 30%); }
button,input,select { font:inherit; } button { cursor:pointer; }
.app-shell { display:flex; min-height:100vh; }
.sidebar { width:254px; flex:0 0 254px; border-right:1px solid rgba(145,164,179,.12); background:rgba(8,20,35,.83); padding:26px 15px 18px; display:flex; flex-direction:column; }
.brand { display:flex; align-items:center; gap:10px; padding:0 14px 25px; }
.brand strong { font-family:'Space Grotesk'; font-size:23px; letter-spacing:-1px; display:block; line-height:18px; }.brand small { font-size:10px; color:var(--mint); letter-spacing:2px; text-transform:uppercase; }
.brand-mark { width:31px; height:31px; position:relative; }.brand-mark img { width:31px; height:31px; display:block; border-radius:9px; }
.profile-mini { display:flex; align-items:center; gap:9px; padding:12px 12px; background:rgba(19,38,58,.65); border:1px solid rgba(145,164,179,.09); border-radius:12px; margin-bottom:23px; }.profile-mini strong { font-size:12px; display:block; }.profile-mini span { font-size:10px; color:var(--muted); display:block; margin-top:3px; }.profile-mini .icon-btn { margin-left:auto; padding:0; color:var(--muted); }
.avatar { display:grid; place-items:center; background:#9bddd1; color:#12312f; font-weight:700; border:0; border-radius:50%; width:32px; height:32px; font-size:11px; }.avatar-small { width:34px; height:34px; }.icon-btn { color:var(--soft); background:none; border:0; font-size:20px; }
.main-nav { flex:1; }.nav-label { color:#5f778b; font-size:10px; text-transform:uppercase; letter-spacing:1.4px; margin:16px 13px 8px; }.nav-item { width:100%; display:flex; align-items:center; gap:12px; border:0; color:var(--muted); background:transparent; padding:11px 13px; border-radius:9px; text-align:left; font-size:13px; margin-bottom:3px; transition:.2s; }.nav-item:hover { background:rgba(117,167,255,.07); color:var(--text); }.nav-item.active { background:#153049; color:var(--text); box-shadow:inset 2px 0 var(--mint); }.nav-icon { display:inline-grid; place-items:center; font-size:19px; width:18px; color:#7590a5; }.active .nav-icon,.nav-ai .nav-icon { color:var(--mint); }.nav-count { margin-left:auto; width:20px; height:20px; display:grid; place-items:center; border-radius:6px; font-size:10px; background:#26435b; color:var(--soft); }.nav-ai { color:var(--mint-2); }.nav-ai i { font-style:normal; text-transform:uppercase; font-size:8px; letter-spacing:.8px; color:#062c27; background:var(--mint); padding:3px 5px; border-radius:4px; margin-left:auto; }.sidebar-bottom { margin-top:auto; }.notification-dot { width:6px; height:6px; border-radius:50%; background:var(--mint); margin-left:auto; }.security-note { display:flex; gap:9px; border-top:1px solid var(--line); margin:17px 6px 0; padding:17px 7px 0; color:var(--mint); }.security-note strong { display:block; color:var(--soft); font-size:10px; }.security-note small { display:block; color:#62798a; font-size:9px; margin-top:4px; line-height:1.3; }
.main-content { min-width:0; flex:1; }.topbar { height:80px; border-bottom:1px solid rgba(145,164,179,.1); padding:0 40px; display:flex; align-items:center; justify-content:space-between; }.breadcrumb { display:flex; gap:10px; font-size:12px; color:#698193; }.breadcrumb b { font-weight:400; color:#3d566a; }.breadcrumb strong { color:var(--text); font-weight:500; }.top-actions { display:flex; align-items:center; gap:20px; }.notification-trigger { position:relative; font-size:21px; }.notification-trigger i { position:absolute; width:6px; height:6px; border-radius:50%; background:var(--mint); right:0; top:1px; border:1px solid var(--bg); }.mobile-menu { display:none; }
.page-container { padding:38px 40px 50px; max-width:none; margin:0; }.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:25px; margin-bottom:29px; }.eyebrow { color:var(--mint); font-size:11px; text-transform:uppercase; letter-spacing:1.5px; font-weight:700; }.page-heading h1 { font-family:'Space Grotesk'; font-size:31px; letter-spacing:-1.5px; margin:7px 0 0; }.page-heading p { color:var(--muted); font-size:13px; margin:9px 0 0; }.date-select { display:flex; align-items:center; gap:8px; color:var(--soft); background:var(--surface); border:1px solid var(--line); border-radius:8px; font-size:12px; padding:10px 13px; }
.btn { border:0; border-radius:8px; padding:11px 15px; font-size:12px; font-weight:700; display:inline-flex; align-items:center; gap:8px; transition:.2s; }.btn-primary { color:#062b27; background:var(--mint); box-shadow:0 6px 20px rgba(8,214,176,.15); }.btn-primary:hover { background:var(--mint-2); transform:translateY(-1px); }.btn-ghost { color:var(--soft); border:1px solid var(--line); background:var(--surface); }.btn-ghost:hover { border-color:#3d617c; }.btn-danger { background:rgba(255,129,126,.11); color:var(--red); border:1px solid rgba(255,129,126,.18); }
.grid { display:grid; gap:16px; }.stats-grid { grid-template-columns:repeat(4,1fr); }.card { background:rgba(14,29,45,.85); border:1px solid rgba(145,164,179,.13); border-radius:14px; padding:20px; box-shadow:var(--shadow); }.stat-card { min-height:130px; position:relative; overflow:hidden; }.stat-card:after { content:''; position:absolute; width:80px; height:80px; background:var(--mint); opacity:.04; border-radius:50%; right:-23px; bottom:-28px; }.stat-top { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }.stat-symbol { color:var(--mint); font-size:20px; }.stat-value { font-family:'Space Grotesk'; font-size:25px; letter-spacing:-.8px; margin:13px 0 8px; }.stat-foot { color:var(--muted); font-size:10px; }.positive { color:var(--mint-2); }.negative { color:var(--red); }.blue { color:var(--blue); }.orange { color:var(--orange); }
.dashboard-grid { grid-template-columns:minmax(0,1.45fr) minmax(280px,.82fr); margin-top:16px; }.card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; margin-bottom:20px; }.card-head h2 { font-family:'Space Grotesk'; font-size:16px; margin:0; letter-spacing:-.4px; }.card-head p { margin:5px 0 0; font-size:11px; color:var(--muted); }.link-btn { border:0; background:none; color:var(--mint); font-size:11px; padding:0; }.cash-card { min-height:315px; }.chart-wrap { height:195px; position:relative; }.chart-wrap svg { width:100%; height:100%; overflow:visible; }.chart-labels { display:flex; justify-content:space-between; color:#61788a; font-size:10px; margin:7px 16px 0 33px; }.legend { display:flex; gap:18px; font-size:10px; color:var(--muted); }.legend span { display:flex; gap:5px; align-items:center; }.legend i { width:7px; height:7px; border-radius:50%; background:var(--mint); }.legend i.blue-dot { background:var(--blue); }
.goal-card { min-height:315px; }.goal-main { display:flex; align-items:center; gap:20px; padding:4px 0 18px; }.ring { width:112px; height:112px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--mint) 0 68%, #20384b 68%); position:relative; }.ring:after { content:''; width:86px; height:86px; background:var(--surface); border-radius:50%; position:absolute; }.ring-content { z-index:1; text-align:center; }.ring strong { display:block; font-family:'Space Grotesk'; font-size:21px; }.ring small { color:var(--muted); font-size:9px; }.goal-main h3 { margin:0 0 6px; font-size:15px; }.goal-main p { color:var(--muted); font-size:11px; margin:0; line-height:1.5; }.goal-progress { border-top:1px solid var(--line); padding-top:15px; }.progress-row { display:flex; justify-content:space-between; font-size:10px; color:var(--muted); margin-bottom:8px; }.progress-row strong { color:var(--soft); }.progress { height:6px; background:#20384b; border-radius:10px; overflow:hidden; }.progress > span { display:block; height:100%; border-radius:inherit; background:var(--mint); }.mini-goals { display:grid; gap:9px; margin-top:14px; }.mini-goal { display:flex; justify-content:space-between; align-items:center; font-size:10px; color:var(--soft); }.mini-goal-left { display:flex; gap:7px; align-items:center; }.mini-goal-dot { width:8px; height:8px; border-radius:50%; background:var(--blue); }.mini-goal-dot.orange-dot { background:var(--orange); }
.bottom-grid { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); margin-top:16px; }.transaction-list { display:grid; }.transaction { display:flex; gap:11px; align-items:center; border-bottom:1px solid rgba(145,164,179,.08); padding:12px 0; }.transaction:last-child { border-bottom:0; }.transaction-icon { width:34px; height:34px; display:grid; place-items:center; background:#173149; border-radius:9px; font-size:16px; }.transaction-info { flex:1; min-width:0; }.transaction-info strong { font-size:12px; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.transaction-info span { font-size:10px; color:var(--muted); display:block; margin-top:3px; }.transaction-amount { text-align:right; font-size:12px; }.transaction-amount small { display:block; color:var(--muted); font-size:9px; margin-top:3px; }.insight-card { background:linear-gradient(135deg,#123a42,#0e2a39 60%,#12243b); border-color:#1f7b77; position:relative; overflow:hidden; }.insight-card:before { content:'✦'; position:absolute; right:25px; top:17px; color:var(--mint); font-size:27px; opacity:.8; }.insight-card h2 { margin:0; font-family:'Space Grotesk'; font-size:16px; }.insight-card p { max-width:410px; font-size:12px; color:#b4d4d1; line-height:1.6; margin:18px 0 20px; }.insight-stat { display:flex; gap:30px; }.insight-stat strong { display:block; font-family:'Space Grotesk'; font-size:19px; }.insight-stat span { display:block; color:#85ada9; font-size:10px; margin-top:3px; }
.table-card { padding:0; overflow:hidden; }.table-card .card-head { padding:20px 20px 0; }.table-wrap { overflow:auto; }.table { width:100%; border-collapse:collapse; font-size:12px; }.table th { text-align:left; color:#688094; font-weight:500; font-size:10px; text-transform:uppercase; letter-spacing:.6px; padding:12px 20px; border-bottom:1px solid var(--line); }.table td { padding:14px 20px; border-bottom:1px solid rgba(145,164,179,.08); color:var(--soft); }.table tr:last-child td { border-bottom:0; }.table td:last-child,.table th:last-child { text-align:right; }.category-pill { display:inline-flex; align-items:center; gap:6px; }.category-pill i { width:7px; height:7px; border-radius:50%; background:var(--mint); }.empty-state { text-align:center; color:var(--muted); padding:35px; font-size:12px; }
.bar-chart { height:215px; display:flex; align-items:stretch; gap:14px; padding:13px 10px 0; border-bottom:1px solid var(--line); }.bar-col { flex:1; display:flex; flex-direction:column; justify-content:flex-end; gap:8px; align-items:center; }.bar-stack { height:170px; display:flex; align-items:flex-end; gap:4px; }.bar { width:17px; border-radius:4px 4px 0 0; background:var(--blue); opacity:.7; }.bar.current { background:var(--mint); opacity:1; }.bar-col span { color:var(--muted); font-size:10px; }.donut-section { display:flex; align-items:center; gap:27px; padding:15px 8px; }.donut { width:134px; height:134px; border-radius:50%; background:conic-gradient(var(--mint) 0 39%, var(--blue) 39% 65%, var(--orange) 65% 82%, #c78cff 82% 93%, #45647a 93%); position:relative; flex:0 0 auto; }.donut:after { content:''; position:absolute; inset:28px; background:var(--surface); border-radius:50%; }.donut-center { position:absolute; z-index:1; inset:0; display:grid; place-items:center; text-align:center; font-family:'Space Grotesk'; font-size:18px; }.donut-center small { display:block; font-family:'DM Sans'; color:var(--muted); font-size:9px; font-weight:400; }.category-list { display:grid; gap:12px; flex:1; }.category-row { display:flex; align-items:center; gap:8px; font-size:11px; }.category-row i { width:8px; height:8px; border-radius:50%; }.category-row strong { margin-left:auto; font-size:11px; color:var(--soft); }
.module-grid { grid-template-columns:repeat(3,1fr); }.wide { grid-column:span 2; }.module-card h3 { margin:0; font-family:'Space Grotesk'; font-size:15px; }.module-card p { color:var(--muted); font-size:11px; line-height:1.5; }.card-number { letter-spacing:3px; margin-top:29px; font-family:'Space Grotesk'; font-size:16px; }.credit-card { background:linear-gradient(135deg,#18374b,#102536); min-height:170px; }.credit-card .card-brand { display:flex; justify-content:space-between; color:var(--mint-2); font-size:15px; font-weight:700; }.credit-card .card-brand span { color:#aec0c8; font-size:11px; }.credit-info { display:flex; justify-content:space-between; align-items:flex-end; margin-top:20px; font-size:10px; color:var(--muted); }.credit-info strong { display:block; color:var(--soft); margin-top:4px; font-size:11px; }.card-limit { margin-top:20px; }.card-limit .progress > span { background:var(--orange); }.cards-row { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.goal-list { display:grid; gap:15px; }.goal-row { display:flex; gap:12px; align-items:center; }.goal-row .goal-symbol { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:#15354a; font-size:17px; }.goal-row-body { flex:1; }.goal-row-body strong { display:block; font-size:12px; }.goal-row-body span { display:block; font-size:10px; color:var(--muted); margin:4px 0 7px; }.goal-row-end { text-align:right; font-size:11px; color:var(--mint); }.investment-total { display:flex; justify-content:space-between; align-items:end; padding:8px 0 22px; }.investment-total h2 { margin:0; font-family:'Space Grotesk'; font-size:26px; }.investment-total p { margin:6px 0 0; font-size:11px; color:var(--mint); }.allocation { display:grid; gap:13px; }.allocation-row { display:grid; grid-template-columns:90px 1fr 45px; gap:10px; align-items:center; font-size:10px; color:var(--muted); }.allocation-row strong { text-align:right; color:var(--soft); }.allocation-row .progress > span { background:var(--blue); }.allocation-row:nth-child(2) .progress > span { background:var(--mint); }.allocation-row:nth-child(3) .progress > span { background:var(--orange); }
.assistant-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:16px; }.chat-card { min-height:575px; display:flex; flex-direction:column; background:linear-gradient(180deg,rgba(13,35,51,.96),rgba(14,29,45,.88)); }.chat-head { display:flex; gap:11px; align-items:center; padding-bottom:19px; border-bottom:1px solid var(--line); }.ai-avatar { width:37px; height:37px; display:grid; place-items:center; background:var(--mint); color:#07312c; border-radius:11px; font-size:20px; }.chat-head strong { display:block; font-family:'Space Grotesk'; font-size:14px; }.chat-head span { display:block; color:var(--mint); font-size:10px; margin-top:3px; }.chat-messages { flex:1; padding:22px 4px; display:flex; flex-direction:column; gap:17px; }.message { max-width:75%; display:flex; gap:9px; align-items:flex-start; }.message.user { align-self:flex-end; flex-direction:row-reverse; }.message .bubble { background:#173249; border:1px solid #234259; padding:12px 14px; border-radius:4px 12px 12px 12px; font-size:12px; line-height:1.5; color:var(--soft); }.message.user .bubble { background:#125d58; border-color:#1e8076; border-radius:12px 4px 12px 12px; color:#e0fbf5; }.message small { color:var(--muted); font-size:9px; white-space:nowrap; margin-top:3px; }.chat-input { display:flex; gap:8px; background:#0a1826; border:1px solid var(--line); padding:7px; border-radius:10px; }.chat-input input { flex:1; min-width:0; color:var(--text); background:transparent; border:0; outline:0; padding:7px; font-size:12px; }.chat-input button { width:33px; height:33px; border:0; border-radius:7px; background:var(--mint); color:#06362f; font-weight:700; }.quick-prompts { display:flex; gap:7px; margin-top:10px; flex-wrap:wrap; }.quick-prompts button { background:transparent; color:#8aadb3; border:1px solid #2b4b58; border-radius:20px; padding:6px 9px; font-size:10px; }.ai-side { display:grid; gap:16px; align-content:start; }.ai-side .card { background:rgba(17,38,56,.8); }.ai-side h3 { margin:0 0 11px; font-family:'Space Grotesk'; font-size:13px; }.ai-side p { color:var(--muted); font-size:11px; line-height:1.5; margin:0; }.tip-item { display:flex; gap:9px; padding:10px 0; border-bottom:1px solid var(--line); }.tip-item:last-child { border:0; padding-bottom:0; }.tip-item span { color:var(--mint); font-size:16px; }.tip-item strong { display:block; font-size:11px; }.tip-item small { color:var(--muted); font-size:10px; line-height:1.4; display:block; margin-top:3px; }.search-results { display:grid; gap:10px; margin-top:16px; }.product-result { padding:13px; border:1px solid #265064; border-radius:10px; background:#112b3c; }.product-result-top { display:flex; justify-content:space-between; gap:8px; }.product-result strong { font-size:12px; }.product-result small { display:block; color:var(--muted); font-size:10px; margin-top:5px; }.product-result .price { color:var(--mint); font-family:'Space Grotesk'; font-size:14px; white-space:nowrap; }.product-actions { display:flex; justify-content:space-between; align-items:center; margin-top:10px; }.product-actions button { padding:6px 9px; font-size:10px; }
.notification-list { display:grid; gap:10px; }.notification-item { display:flex; gap:13px; align-items:flex-start; padding:15px; border:1px solid var(--line); background:var(--surface); border-radius:11px; }.notification-item.unread { border-left:2px solid var(--mint); }.notification-item .n-icon { width:33px; height:33px; display:grid; place-items:center; border-radius:9px; background:#15384a; color:var(--mint); }.notification-item strong { display:block; font-size:12px; }.notification-item p { font-size:11px; line-height:1.5; color:var(--muted); margin:4px 0 0; }.notification-item time { display:block; font-size:9px; color:#5d7589; margin-top:6px; }
.modal-backdrop { position:fixed; inset:0; background:rgba(1,8,15,.72); backdrop-filter:blur(5px); z-index:10; display:grid; place-items:center; padding:20px; }.modal { width:min(100%,480px); background:#102335; border:1px solid #2b465b; border-radius:15px; padding:23px; box-shadow:0 30px 80px rgba(0,0,0,.5); }.modal-head { display:flex; justify-content:space-between; align-items:start; margin-bottom:20px; }.modal h2 { font-family:'Space Grotesk'; font-size:19px; margin:0; }.modal p { color:var(--muted); font-size:11px; margin:6px 0 0; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; }.field { display:grid; gap:6px; }.field.full { grid-column:1/-1; }.field label { color:#91aab8; font-size:10px; }.field input,.field select { width:100%; color:var(--text); background:#0a1a29; border:1px solid #294257; border-radius:7px; padding:10px; outline:0; font-size:12px; }.field input:focus,.field select:focus { border-color:var(--mint); }.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:21px; }
.toast-root { position:fixed; z-index:20; top:20px; right:20px; display:grid; gap:8px; }.toast { padding:12px 15px; border:1px solid #2f695f; background:#102e34; color:#bdece3; border-radius:9px; box-shadow:var(--shadow); font-size:12px; animation:slidein .25s ease; }.toast.error { border-color:#704947; background:#321e24; color:#ffc3bc; }@keyframes slidein { from { transform:translateX(20px); opacity:0; } to { transform:none; opacity:1; } }
.mobile-nav { display:none; }
@media (max-width:1050px) { .sidebar { width:220px; flex-basis:220px; }.topbar,.page-container { padding-left:40px; padding-right:40px; }.stats-grid { grid-template-columns:repeat(2,1fr); }.dashboard-grid,.bottom-grid,.assistant-layout { grid-template-columns:1fr; }.ai-side { grid-template-columns:repeat(2,1fr); }.module-grid { grid-template-columns:repeat(2,1fr); }.wide { grid-column:span 2; } }
@media (max-width:700px) { .sidebar { position:fixed; z-index:8; left:-260px; top:0; bottom:0; transition:.25s; box-shadow:var(--shadow); }.sidebar.open { left:0; }.topbar { height:65px; padding:0 18px; }.mobile-menu { display:inline-block; margin-right:12px; }.topbar { justify-content:flex-start; }.top-actions { margin-left:auto; gap:11px; }.breadcrumb span,.breadcrumb b { display:none; }.page-container { padding:26px 17px 90px; }.page-heading { align-items:flex-start; flex-direction:column; margin-bottom:21px; }.page-heading h1 { font-size:27px; }.page-heading .btn,.page-heading .date-select { align-self:stretch; justify-content:center; }.stats-grid { gap:10px; }.card { padding:16px; }.stat-card { min-height:116px; }.stat-value { font-size:19px; }.stat-top { font-size:10px; }.stat-symbol { font-size:16px; }.dashboard-grid,.bottom-grid { gap:10px; margin-top:10px; }.chart-wrap { height:170px; }.cards-row,.module-grid,.ai-side { grid-template-columns:1fr; }.wide { grid-column:span 1; }.table th,.table td { padding-left:13px; padding-right:13px; }.table th:nth-child(3),.table td:nth-child(3) { display:none; }.goal-main { gap:12px; }.goal-main h3 { font-size:13px; }.assistant-layout { gap:10px; }.chat-card { min-height:570px; }.message { max-width:90%; }.mobile-nav { display:flex; position:fixed; z-index:7; bottom:0; left:0; right:0; height:65px; background:#0b1b2a; border-top:1px solid var(--line); justify-content:space-around; padding:6px 6px 5px; }.mobile-nav .nav-item { width:auto; padding:5px 12px; margin:0; flex-direction:column; gap:3px; text-align:center; }.mobile-nav .nav-item.active { box-shadow:none; background:#153049; }.mobile-nav small { font-size:9px; }.security-note { display:none; }.form-grid { grid-template-columns:1fr; }.field.full { grid-column:auto; }.modal { padding:18px; }.toast-root { left:14px; right:14px; top:14px; }.toast { text-align:center; } }

/* Tema minimalista: gelo, branco, turquesa e preto */
body { background-image:radial-gradient(circle at 70% -10%, rgba(10,167,160,.08), transparent 25%),radial-gradient(circle at 100% 70%, rgba(71,119,197,.05), transparent 30%); }
.sidebar { background:rgba(255,255,255,.94); border-right-color:var(--line); }
.profile-mini { background:var(--surface-2); border-color:var(--line); }
.avatar { background:#c9f1eb; color:#0b5754; }
.nav-item:hover { background:#f0f9f8; color:var(--text); }
.nav-item.active { background:#e4f7f4; color:var(--text); }
.nav-icon { color:#6b8d91; }
.nav-count { background:#d9efed; color:#31585b; }
.nav-ai { color:var(--mint-2); }
.security-note strong { color:var(--soft); }
.topbar { border-bottom-color:var(--line); }
.breadcrumb { color:#789093; }.breadcrumb b { color:#a5b7b8; }.breadcrumb strong { color:var(--text); }
.date-select { color:var(--soft); background:var(--surface); border-color:var(--line); }
.btn-primary { color:#ffffff; box-shadow:0 6px 20px rgba(10,167,160,.18); }.btn-ghost { color:var(--soft); border-color:var(--line); background:var(--surface); }.btn-ghost:hover { border-color:#8acbc6; }
.card { background:rgba(255,255,255,.94); border-color:var(--line); }
.stat-card:after { opacity:.08; }
.positive { color:var(--mint-2); }.chart-labels { color:#789093; }.legend { color:var(--muted); }
.ring { background:conic-gradient(var(--mint) 0 68%, #dceceb 68%); }.ring:after { background:var(--surface); }
.progress { background:#dceceb; }.mini-goal { color:var(--soft); }
.transaction { border-bottom-color:#e7eeee; }.transaction-icon { background:#e7f7f5; color:var(--mint-2); }
.insight-card { background:linear-gradient(135deg,#dff8f5,#effcfb 60%,#e8f2fb); border-color:#a9ddd8; }.insight-card p { color:#42666a; }.insight-stat span { color:#5a7e82; }
.table th { color:#71878a; }.table td { border-bottom-color:#e7eeee; color:var(--soft); }
.bar-chart { border-bottom-color:var(--line); }.bar-col span { color:var(--muted); }
.donut { background:conic-gradient(var(--mint) 0 39%, var(--blue) 39% 65%, var(--orange) 65% 82%, #a878d0 82% 93%, #9fb9bb 93%); }.donut:after { background:var(--surface); }.category-row strong { color:var(--soft); }
.credit-card { background:linear-gradient(135deg,#c9f1eb,#e7f7fb); }.credit-card .card-brand { color:#087f7c; }.credit-card .card-brand span { color:#53777b; }.credit-info strong { color:#17373a; }.card-limit .progress > span { background:var(--orange); }
.goal-row .goal-symbol { background:#e7f7f5; }.goal-row-body span { color:var(--muted); }
.chat-card { background:linear-gradient(180deg,#f1fbfb,#ffffff); }.message .bubble { background:#e8f5f4; border-color:#cce6e3; color:var(--soft); }.message.user .bubble { background:#d2f4ed; border-color:#a9ddd5; color:#153d3a; }.chat-input { background:#ffffff; border-color:var(--line); }.chat-input input { color:var(--text); }.quick-prompts button { color:#4f797d; border-color:#bcdad9; }.ai-side .card { background:rgba(255,255,255,.94); }.product-result { border-color:#abd9d7; background:#f0fbfa; }
.notification-item { background:var(--surface); }.notification-item .n-icon { background:#e7f7f5; }.modal-backdrop { background:rgba(16,27,29,.42); }.modal { background:#ffffff; border-color:var(--line); }.field label { color:#60777a; }.field input,.field select { color:var(--text); background:#fbfefe; border-color:#cbdede; }
.mobile-nav { background:#ffffff; }.mobile-nav .nav-item.active { background:#e4f7f4; }

/* Movimento e carregamento percebido */
.chart-grid { color:var(--line); opacity:.9; }
.chart-line-primary,.chart-line-secondary { stroke-dasharray:1000; stroke-dashoffset:1000; animation:drawChart 1.35s cubic-bezier(.22,.8,.32,1) forwards; }
.chart-line-secondary { animation-delay:.16s; }
.chart-area { opacity:0; animation:fadeArea .9s ease-out .34s forwards; }
.chart-point { transform-box:fill-box; transform-origin:center; opacity:0; animation:pointPop .36s cubic-bezier(.22,.8,.32,1) 500ms forwards; }
.bar { transform:scaleY(0); transform-origin:bottom; animation:barGrow .7s cubic-bezier(.22,.8,.32,1) 0ms forwards; }
.donut { animation:donutIn .95s cubic-bezier(.22,.8,.32,1) forwards; }
.skeleton-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:25px; margin-bottom:29px; }.skeleton-heading > div { display:grid; gap:9px; }.skeleton { display:block; border-radius:7px; background:linear-gradient(105deg,#e7f1f1 25%,#f7fbfb 42%,#e7f1f1 60%); background-size:220% 100%; animation:shimmer 1.15s linear infinite; }.skeleton-eyebrow { width:130px; height:9px; }.skeleton-title { width:270px; height:34px; border-radius:9px; }.skeleton-copy { width:220px; height:12px; }.skeleton-button { width:152px; height:39px; }.skeleton-stats { margin-bottom:16px; }.skeleton-card { min-height:130px; }.skeleton-card > .skeleton { background:linear-gradient(105deg,#e7f1f1 25%,#f7fbfb 42%,#e7f1f1 60%); background-size:220% 100%; }.skeleton-small { width:105px; height:11px; }.skeleton-value { width:145px; height:28px; margin-top:17px; }.skeleton-foot { width:110px; height:9px; margin-top:12px; }.skeleton-dashboard { margin-top:16px; }.skeleton-chart,.skeleton-goal { min-height:315px; }
@keyframes drawChart { to { stroke-dashoffset:0; } }
@keyframes fadeArea { from { opacity:0; } to { opacity:1; } }
@keyframes pointPop { 0% { opacity:0; transform:scale(.35); } 70% { opacity:1; transform:scale(1.16); } 100% { opacity:1; transform:scale(1); } }
@keyframes barGrow { from { transform:scaleY(0); } to { transform:scaleY(1); } }
@keyframes donutIn { from { transform:scale(.72) rotate(-28deg); opacity:.2; } to { transform:scale(1) rotate(0); opacity:1; } }
@keyframes shimmer { to { background-position:-220% 0; } }
@media (max-width:700px) { .skeleton-heading { align-items:flex-start; flex-direction:column; }.skeleton-button { width:100%; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; }.chart-line-primary,.chart-line-secondary { stroke-dashoffset:0; }.chart-area,.chart-point { opacity:1; }.bar { transform:scaleY(1); } }

.icon-svg { width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto; }.nav-icon .icon-svg { width:18px; height:18px; }.notification-trigger .icon-svg { width:19px; height:19px; }.mobile-menu .icon-svg { width:20px; height:20px; }.profile-mini .icon-svg { width:17px; height:17px; }.security-note .icon-svg { width:17px; height:17px; }
.chart-grid path { stroke-dasharray:2 8; opacity:.72; }.chart-line-primary { filter:drop-shadow(0 3px 4px rgba(10,167,160,.16)); }.chart-point-group { cursor:pointer; outline:none; }.chart-point-group:hover .chart-point,.chart-point-group:focus .chart-point { r:6; fill:var(--surface); stroke:var(--mint); stroke-width:2.5; filter:drop-shadow(0 2px 4px rgba(10,167,160,.25)); }.chart-point-group:focus-visible .chart-point { stroke:var(--text); }

/* Componentes shadcn-inspired: estados claros, foco visível e densidade consistente */
.global-search { width:min(320px,30vw); height:38px; display:flex; align-items:center; gap:8px; margin-left:auto; margin-right:22px; padding:0 10px; background:rgba(255,255,255,.8); border:1px solid var(--line); border-radius:9px; color:var(--muted); transition:.2s; }.global-search:focus-within { border-color:var(--mint); box-shadow:0 0 0 3px rgba(10,167,160,.12); }.global-search input { width:100%; min-width:0; border:0; outline:0; color:var(--text); background:transparent; font-size:11px; }.global-search input::placeholder { color:#9aabad; }.search-icon { display:grid; place-items:center; }.search-icon .icon-svg { width:16px; height:16px; }.global-search kbd { border:1px solid var(--line); background:var(--surface-2); color:#819395; border-radius:5px; padding:2px 5px; font-size:9px; white-space:nowrap; }
button,input,select { -webkit-tap-highlight-color:transparent; } button:focus-visible,input:focus-visible,select:focus-visible,[tabindex="0"]:focus-visible { outline:2px solid var(--mint); outline-offset:2px; }.card { border-radius:12px; transition:border-color .2s,box-shadow .2s,transform .2s; }.card:hover { border-color:#c2dfdd; box-shadow:0 16px 38px rgba(24,78,85,.08); }.btn { min-height:38px; border-radius:8px; }.date-select:hover { border-color:#9ed0cc; background:#fbfefe; }.table tbody tr { transition:background .18s; }.table tbody tr:hover { background:#f8fcfc; }.transaction { transition:background .18s; border-radius:8px; }.transaction:hover { background:#f8fcfc; }.empty-state strong { color:var(--text); font-size:12px; }
@media (max-width:1050px) { .global-search { width:220px; margin-right:12px; } }
@media (max-width:700px) { .global-search { display:none; } }
.empty-panel { min-height:260px; display:grid; place-items:center; align-content:center; gap:9px; text-align:center; padding:35px; }.empty-panel h2 { margin:0; font-family:'Space Grotesk'; font-size:18px; }.empty-panel p { max-width:390px; margin:0 0 8px; color:var(--muted); font-size:12px; line-height:1.6; }.empty-illustration { width:48px; height:48px; display:grid; place-items:center; margin-bottom:3px; border-radius:14px; background:#e5f6f4; color:var(--mint); font-size:25px; }.goal-empty { display:flex; align-items:center; gap:13px; min-height:150px; }.goal-empty .goal-symbol { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:#e5f6f4; color:var(--mint); font-size:19px; }.goal-empty h3 { margin:0 0 5px; font-size:14px; }.goal-empty p { margin:0; color:var(--muted); font-size:11px; line-height:1.4; }.goal-empty .btn { margin-left:auto; white-space:nowrap; }.data-management { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); }.data-management h3 { margin:0; font-family:'Space Grotesk'; font-size:14px; }.data-management p { max-width:520px; color:var(--muted); font-size:11px; line-height:1.5; margin:6px 0 15px; }.data-actions { display:flex; flex-wrap:wrap; gap:8px; }.data-actions label { cursor:pointer; }.data-actions input[type="file"] { display:none; }
.demo-notice { display:flex; align-items:center; gap:11px; margin-bottom:18px; padding:11px 13px; background:#fff9ed; border:1px solid #f0ddb4; border-radius:10px; color:#715a2e; }.demo-notice-icon { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#f2d79f; color:#715a2e; font-size:12px; font-weight:700; }.demo-notice div { flex:1; min-width:0; }.demo-notice strong,.demo-notice small { display:block; }.demo-notice strong { font-size:11px; }.demo-notice small { margin-top:2px; font-size:10px; color:#927b4d; }.demo-notice .btn { min-height:30px; padding:7px 10px; color:#715a2e; border-color:#e4c98f; background:rgba(255,255,255,.5); }
@media (max-width:700px) { .goal-empty { align-items:flex-start; flex-wrap:wrap; }.goal-empty .btn { margin-left:55px; }.data-actions { display:grid; }.data-actions .btn { justify-content:center; } }
.transaction-actions { position:relative; width:50px; }.transaction-actions > .icon-btn { margin-left:auto; color:var(--muted); padding:5px 8px; border-radius:7px; }.transaction-actions > .icon-btn:hover { background:var(--surface-2); color:var(--text); }.transaction-menu { position:absolute; z-index:5; top:34px; right:8px; min-width:120px; padding:5px; border:1px solid var(--line); border-radius:9px; background:var(--surface); box-shadow:0 14px 30px rgba(24,78,85,.16); }.transaction-menu[hidden] { display:none; }.transaction-menu button { display:block; width:100%; border:0; border-radius:6px; padding:8px 10px; color:var(--soft); background:transparent; text-align:left; font-size:11px; }.transaction-menu button:hover { background:var(--surface-2); color:var(--text); }.transaction-menu .danger-option { color:var(--red); }.transaction-menu .danger-option:hover { background:#fff0ef; color:#b43d3d; }

/* Autenticação e identidade do PWA */
[hidden] { display:none !important; }
.auth-shell { min-height:100vh; display:grid; grid-template-columns:minmax(0,520px) minmax(300px,430px); justify-content:center; align-items:stretch; gap:16px; padding:clamp(18px,5vw,64px); }
.auth-card { align-self:center; background:rgba(255,255,255,.96); border:1px solid var(--line); border-radius:22px; padding:clamp(24px,4vw,42px); box-shadow:0 25px 80px rgba(24,78,85,.13); }
.auth-brand { display:flex; align-items:center; gap:11px; margin-bottom:38px; }.auth-brand img { width:42px; height:42px; border-radius:12px; box-shadow:0 8px 20px rgba(10,167,160,.18); }.auth-brand strong { display:block; font-family:'Space Grotesk'; font-size:25px; line-height:19px; letter-spacing:-1px; }.auth-brand span { display:block; color:var(--mint); font-size:10px; letter-spacing:2px; text-transform:uppercase; margin-top:5px; }
.auth-intro h1 { margin:9px 0 0; font-family:'Space Grotesk'; font-size:clamp(28px,4vw,38px); letter-spacing:-1.7px; }.auth-intro p { margin:10px 0 0; color:var(--muted); font-size:13px; line-height:1.55; }
.auth-tabs { display:flex; gap:4px; padding:4px; margin:29px 0 22px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }.auth-tab { flex:1; padding:9px 12px; border:0; border-radius:7px; background:transparent; color:var(--muted); font-size:12px; font-weight:700; }.auth-tab.active { color:var(--text); background:var(--surface); box-shadow:0 3px 10px rgba(24,78,85,.08); }
.auth-form { display:grid; gap:14px; }.auth-form .field input { padding:12px; background:#fbfefe; }.auth-submit { width:100%; justify-content:center; margin-top:3px; }.auth-feedback { min-height:16px; margin:0; color:var(--red); font-size:11px; line-height:1.4; }.auth-feedback:not(.visible) { visibility:hidden; }.auth-note { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:10px; line-height:1.4; margin:24px 0 0; }.auth-note span { color:var(--mint); font-size:17px; }
.auth-aside { position:relative; overflow:hidden; align-self:center; min-height:570px; display:flex; flex-direction:column; justify-content:flex-end; padding:38px; border-radius:22px; color:#fff; background:linear-gradient(145deg,#082f38,#0a7f7b 58%,#0aa7a0); box-shadow:0 25px 80px rgba(10,167,160,.2); }.auth-aside-glow { position:absolute; width:300px; height:300px; right:-100px; top:-90px; border-radius:50%; border:1px solid rgba(255,255,255,.24); box-shadow:0 0 0 35px rgba(255,255,255,.04),0 0 0 70px rgba(255,255,255,.035); }.auth-aside img { position:absolute; width:112px; height:112px; top:54px; left:38px; border-radius:30px; box-shadow:0 20px 40px rgba(3,35,39,.22); }.auth-aside .eyebrow { color:#aef8ea; }.auth-aside h2 { max-width:290px; margin:9px 0 12px; font-family:'Space Grotesk'; font-size:33px; line-height:1.05; letter-spacing:-1.6px; }.auth-aside p { max-width:290px; color:#d2f8f2; font-size:12px; line-height:1.6; margin:0; }.auth-benefits { display:grid; gap:10px; margin-top:27px; color:#e5fffa; font-size:11px; }
@media (max-width:820px) { .auth-shell { grid-template-columns:minmax(0,520px); padding:18px; }.auth-aside { display:none; } }
@media (max-width:420px) { .auth-card { padding:24px 18px; border-radius:17px; }.auth-brand { margin-bottom:30px; }.auth-intro h1 { font-size:29px; } }