/* ============================================================
   Nossa Bússola — CSS do app, direto do design system (Claude Design, 17/09/2026).
   Tokens copiados de tokens/*.css; componentes traduzidos de components/core/*.jsx.
   Mobile-first: largura de projeto 390, fluido 360–430; em tela grande centraliza.
   ============================================================ */
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400;1,6..72,500&display=swap");

:root {
  --nb-blue-900:#0F3A57; --nb-blue-700:#154B70; --nb-blue-600:#1B5E8C; --nb-blue-400:#4F8DB8; --nb-blue-300:#6FA8D4; --nb-blue-100:#E3EEF6;
  --nb-coral-600:#C24F2C; --nb-coral-500:#D9603B; --nb-coral-100:#FBE9E2;
  --nb-sand-50:#FBFAF7; --nb-sand-100:#F6F3EE; --nb-sand-200:#EFEAE2; --nb-sand-300:#E2DCD2; --nb-sand-400:#CFC7BA;
  --nb-ink-900:#1E2126; --nb-ink-700:#3A3F47; --nb-ink-500:#5B6068; --nb-ink-300:#8A9099; --nb-white:#FFFFFF;

  --nb-primary:var(--nb-blue-600); --nb-primary-strong:var(--nb-blue-700); --nb-primary-soft:var(--nb-blue-100); --nb-on-primary:var(--nb-white);
  --nb-accent:var(--nb-coral-500); --nb-accent-strong:var(--nb-coral-600); --nb-accent-soft:var(--nb-coral-100); --nb-on-accent:var(--nb-white);
  --nb-bg:var(--nb-sand-100); --nb-surface:var(--nb-white); --nb-surface-2:var(--nb-sand-200); --nb-surface-raised:var(--nb-white);
  --nb-border:var(--nb-sand-300); --nb-border-strong:var(--nb-sand-400);
  --nb-text:var(--nb-ink-900); --nb-text-2:var(--nb-ink-500); --nb-text-3:var(--nb-ink-300); --nb-text-inverse:var(--nb-sand-50);
  --nb-overlay:rgba(30,33,38,0.48);
  --nb-success:#2F8F6B; --nb-success-soft:#E1F2EA; --nb-warning:#C98A1B; --nb-warning-soft:#FBF0D9; --nb-danger:#C6453A; --nb-danger-soft:#FAE3E0;
  --nb-info:var(--nb-blue-600); --nb-info-soft:var(--nb-blue-100);

  /* cor de cada módulo (do DS) + as três que o app tem a mais, no mesmo espírito */
  --nb-mod-saude:#2F8F6B; --nb-mod-saude-soft:#E1F2EA;
  --nb-mod-financas:#1B5E8C; --nb-mod-financas-soft:#E3EEF6;
  --nb-mod-agenda:#7A4FB3; --nb-mod-agenda-soft:#EEE7F7;
  --nb-mod-documentos:#B07A2A; --nb-mod-documentos-soft:#F8EDDA;
  --nb-mod-metas:#D9603B; --nb-mod-metas-soft:#FBE9E2;
  --nb-mod-listas:#2A8FA0; --nb-mod-listas-soft:#E0F1F4;
  --nb-mod-projetos:#5D6B7A; --nb-mod-projetos-soft:#E8ECF0;
  --nb-mod-casa:#5D6B7A; --nb-mod-casa-soft:#E8ECF0;
  --nb-mod-filhos:#B3487F; --nb-mod-filhos-soft:#F7E4EE;
  --nb-mod-cofre:#3A3F47; --nb-mod-cofre-soft:#E8E9EC;
  --nb-mod-familia:#1B5E8C; --nb-mod-familia-soft:#E3EEF6;

  --nb-font-ui:"Outfit",system-ui,-apple-system,sans-serif; --nb-font-display:"Newsreader",Georgia,serif;
  --nb-text-xs:12px; --nb-text-sm:13px; --nb-text-base:15px; --nb-text-md:17px; --nb-text-lg:20px; --nb-text-xl:24px; --nb-text-2xl:32px; --nb-text-3xl:40px;
  --nb-tracking-caps:0.08em; --nb-tracking-tight:-0.01em;
  --nb-space-1:4px; --nb-space-2:8px; --nb-space-3:12px; --nb-space-4:16px; --nb-space-5:20px; --nb-space-6:24px; --nb-space-7:32px; --nb-space-8:40px;
  --nb-radius-xs:6px; --nb-radius-sm:10px; --nb-radius-md:16px; --nb-radius-lg:24px; --nb-radius-full:999px;
  --nb-screen-pad:20px; --nb-tabbar-h:64px; --nb-touch:44px; --nb-control-h:48px; --nb-control-h-sm:36px;
  --nb-shadow-card:0 1px 2px rgba(30,33,38,0.05),0 4px 14px rgba(30,33,38,0.06);
  --nb-shadow-raised:0 2px 6px rgba(30,33,38,0.08),0 12px 32px rgba(30,33,38,0.12);
  --nb-shadow-sheet:0 -8px 40px rgba(30,33,38,0.18);
  --nb-ease:cubic-bezier(0.2,0.8,0.2,1); --nb-dur-fast:120ms; --nb-dur:200ms; --nb-dur-slow:320ms;
  --nb-blur-bar:saturate(1.4) blur(16px);
  color-scheme:light;
}
[data-theme="dark"] {
  --nb-primary:var(--nb-blue-300); --nb-primary-strong:var(--nb-blue-400); --nb-primary-soft:rgba(111,168,212,0.16); --nb-on-primary:var(--nb-blue-900);
  --nb-accent:#E8795A; --nb-accent-strong:var(--nb-coral-500); --nb-accent-soft:rgba(232,121,90,0.16); --nb-on-accent:#2A140C;
  --nb-bg:#12151A; --nb-surface:#1B1F26; --nb-surface-2:#242932; --nb-surface-raised:#242932; --nb-border:#303641; --nb-border-strong:#3E4552;
  --nb-text:#F2EFE9; --nb-text-2:#A9AEB7; --nb-text-3:#737983; --nb-text-inverse:var(--nb-ink-900); --nb-overlay:rgba(0,0,0,0.6);
  --nb-success:#4FB08C; --nb-success-soft:rgba(79,176,140,0.16); --nb-warning:#E0A53A; --nb-warning-soft:rgba(224,165,58,0.16); --nb-danger:#E2675C; --nb-danger-soft:rgba(226,103,92,0.16);
  --nb-info:var(--nb-blue-300); --nb-info-soft:rgba(111,168,212,0.16);
  --nb-mod-saude:#4FB08C; --nb-mod-saude-soft:rgba(79,176,140,0.16); --nb-mod-financas:#6FA8D4; --nb-mod-financas-soft:rgba(111,168,212,0.16);
  --nb-mod-agenda:#A88AD6; --nb-mod-agenda-soft:rgba(168,138,214,0.16); --nb-mod-documentos:#D2A25A; --nb-mod-documentos-soft:rgba(210,162,90,0.16);
  --nb-mod-metas:#E8795A; --nb-mod-metas-soft:rgba(232,121,90,0.16); --nb-mod-listas:#5BB6C6; --nb-mod-listas-soft:rgba(91,182,198,0.16);
  --nb-mod-projetos:#98A4B2; --nb-mod-projetos-soft:rgba(152,164,178,0.16); --nb-mod-casa:#98A4B2; --nb-mod-casa-soft:rgba(152,164,178,0.16);
  --nb-mod-filhos:#D98AB5; --nb-mod-filhos-soft:rgba(217,138,181,0.16); --nb-mod-cofre:#A9AEB7; --nb-mod-cofre-soft:rgba(169,174,183,0.16); --nb-mod-familia:#6FA8D4; --nb-mod-familia-soft:rgba(111,168,212,0.16);
  --nb-shadow-card:0 1px 2px rgba(0,0,0,0.3),0 4px 14px rgba(0,0,0,0.3); --nb-shadow-raised:0 2px 6px rgba(0,0,0,0.4),0 12px 32px rgba(0,0,0,0.5); --nb-shadow-sheet:0 -8px 40px rgba(0,0,0,0.6);
  color-scheme:dark;
}

/* ---- base ---- */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;overflow-x:clip;background:var(--nb-bg);color:var(--nb-text);font-family:var(--nb-font-ui);font-size:var(--nb-text-base);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100%}
body{overscroll-behavior-y:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
h1,h2,h3{margin:0;font-weight:600}
.display{font-family:var(--nb-font-display);font-weight:500;letter-spacing:var(--nb-tracking-tight);line-height:1.15}
.caps{font-size:var(--nb-text-xs);font-weight:600;letter-spacing:var(--nb-tracking-caps);text-transform:uppercase;color:var(--nb-text-2)}
.num{font-variant-numeric:tabular-nums}
.t2{color:var(--nb-text-2)} .t3{color:var(--nb-text-3)} .sm{font-size:var(--nb-text-sm)}
svg.lucide{width:20px;height:20px;stroke-width:1.75}
.spin{width:28px;height:28px;border:3px solid var(--nb-border);border-top-color:var(--nb-primary);border-radius:50%;animation:g .8s linear infinite;margin:40px auto}
@keyframes g{to{transform:rotate(360deg)}}
.carregando{min-height:100dvh;display:grid;place-items:center}

/* ---- shell: appbar + conteúdo + tabbar ---- */
.app{max-width:430px;margin:0 auto;min-height:100dvh;position:relative;background:var(--nb-bg)}
@media (min-width:431px){.app{box-shadow:0 0 0 1px var(--nb-border)}}
.tela{padding:0 var(--nb-screen-pad) calc(var(--nb-tabbar-h) + 40px + env(safe-area-inset-bottom,0px));min-height:100dvh}
.tela.sem-tab{padding-bottom:40px}
.appbar{display:flex;align-items:center;gap:12px;min-height:56px;padding:calc(8px + env(safe-area-inset-top,0px)) 0 8px;position:sticky;top:0;z-index:5;background:var(--nb-bg)} /* fixa no topo: conteúdo rola por baixo, não por cima do relógio */
.appbar .miolo{flex:1;min-width:0}
.appbar .sub{font-size:var(--nb-text-sm);color:var(--nb-text-2)}
.appbar .tit{font-size:var(--nb-text-md);font-weight:600}
.appbar.grande{padding-top:calc(12px + env(safe-area-inset-top,0px));padding-bottom:16px}
.appbar.grande .tit{font-family:var(--nb-font-display);font-size:var(--nb-text-2xl);font-weight:500;line-height:1.15;letter-spacing:var(--nb-tracking-tight)}
.tabbar{position:fixed;left:0;right:0;bottom:0;margin:0 auto;max-width:430px;height:calc(var(--nb-tabbar-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);display:flex;justify-content:space-around;align-items:stretch;background:color-mix(in srgb,var(--nb-surface) 86%,transparent);backdrop-filter:var(--nb-blur-bar);-webkit-backdrop-filter:var(--nb-blur-bar);border-top:1px solid var(--nb-border);z-index:10}
.tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--nb-text-3)}
.tabbar button.on{color:var(--nb-primary)}
.tabbar .pill{display:grid;place-items:center;width:48px;height:28px;border-radius:var(--nb-radius-full);transition:background var(--nb-dur)}
.tabbar button.on .pill{background:var(--nb-primary-soft)}
.tabbar .lucide{width:22px;height:22px}
.tabbar span.rot{font-size:11px;font-weight:500} .tabbar button.on span.rot{font-weight:600}

/* ---- componentes ---- */
.card{border-radius:var(--nb-radius-md);padding:16px;background:var(--nb-surface);box-shadow:var(--nb-shadow-card)}
.card.lista{padding:4px 16px}
.card.tinted{background:var(--nb-surface-2);box-shadow:none}
.card.outlined{box-shadow:none;border:1px solid var(--nb-border)}
.card.primary{background:var(--nb-primary);color:var(--nb-on-primary);box-shadow:none}
[data-theme="dark"] .card{box-shadow:none;border:1px solid var(--nb-border)} [data-theme="dark"] .card.primary{border:0}
.card.toque{cursor:pointer;transition:transform var(--nb-dur-fast) var(--nb-ease),filter var(--nb-dur-fast)} .card.toque:active{transform:scale(.98);filter:brightness(.96)}
.secao{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:24px 0 10px}
.secao h2{font-size:var(--nb-text-lg);font-weight:600;letter-spacing:var(--nb-tracking-tight)}
.secao button{color:var(--nb-primary);font-size:var(--nb-text-sm);font-weight:600}
.grade2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px} .grade2>*{min-width:0}
.campo{min-width:0} .campo .caixa{min-width:0;max-width:100%} .campo input,.campo select,.campo textarea{width:100%}
.campo .caixa{overflow:hidden} .campo input[type=date],.campo input[type=time],.campo input[type=datetime-local]{-webkit-appearance:none;appearance:none;min-width:0;width:100%;text-align:left;display:block} /* iOS: o campo de data tem largura própria e vazava */
.campo input::-webkit-date-and-time-value{text-align:left}
.tile{border-radius:var(--nb-radius-md);background:var(--nb-surface);box-shadow:var(--nb-shadow-card);padding:14px;display:flex;flex-direction:column;gap:12px;min-height:116px;text-align:left;color:var(--nb-text);width:100%;transition:transform var(--nb-dur-fast) var(--nb-ease),filter var(--nb-dur-fast)}
[data-theme="dark"] .tile{box-shadow:none;border:1px solid var(--nb-border)}
.tile:active{transform:scale(.97);filter:brightness(.94)}
.tile.breve{opacity:.55}
.tile b{font-size:var(--nb-text-base);font-weight:600;display:block}
.tile small{font-size:var(--nb-text-sm);color:var(--nb-text-2);display:block;margin-top:2px;text-wrap:pretty}
.icone-mod{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--soft,var(--nb-surface-2));color:var(--cor,var(--nb-text-2))}
.linha{display:flex;align-items:center;gap:14px;min-height:60px;padding:10px 0;border-bottom:1px solid var(--nb-border);width:100%;text-align:left;color:var(--nb-text)}
.linha:last-child{border-bottom:0}
.linha .txt{flex:1;min-width:0}
.linha .txt b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.linha .txt small{display:block;font-size:var(--nb-text-sm);color:var(--nb-text-2);margin-top:2px}
.linha .val{font-weight:600;font-variant-numeric:tabular-nums}
.linha .chev{color:var(--nb-text-3)} .linha .chev .lucide{width:18px;height:18px}
.badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--nb-radius-full);font-size:var(--nb-text-xs);font-weight:600;white-space:nowrap;background:var(--nb-surface-2);color:var(--nb-text-2)}
.badge.success{background:var(--nb-success-soft);color:var(--nb-success)} .badge.warning{background:var(--nb-warning-soft);color:#8A5A0A} .badge.danger{background:var(--nb-danger-soft);color:var(--nb-danger)} .badge.info{background:var(--nb-info-soft);color:var(--nb-info)} .badge.accent{background:var(--nb-accent-soft);color:var(--nb-accent-strong)}
.chip{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:var(--nb-radius-full);font-size:var(--nb-text-sm);font-weight:500;white-space:nowrap;border:1.5px solid var(--nb-border);background:var(--nb-surface);color:var(--nb-text);transition:all var(--nb-dur-fast)}
.chip.on{border-color:var(--nb-primary);background:var(--nb-primary);color:var(--nb-on-primary)}
.avatar{border-radius:var(--nb-radius-full);flex:none;display:inline-grid;place-items:center;color:#fff;font-family:var(--nb-font-display);font-weight:500;width:40px;height:40px;font-size:17px;overflow:hidden;position:relative}
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.avatar.g{width:72px;height:72px;font-size:30px} .avatar.p{width:32px;height:32px;font-size:13px}
.avatar.foto{background:var(--nb-surface-2);overflow:hidden} .avatar.foto img{width:100%;height:100%;object-fit:cover;display:block}
.recorte{position:relative;border-radius:var(--nb-radius-md);overflow:hidden;touch-action:none;background:#000;user-select:none;-webkit-user-select:none}
.recorte canvas{display:block}
.recorte-mascara{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center, transparent 49.5%, rgba(0,0,0,.55) 50%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
input[type=range]{accent-color:var(--nb-primary);height:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--nb-control-h);padding:0 20px;border-radius:var(--nb-radius-sm);border:1.5px solid transparent;background:var(--nb-primary);color:var(--nb-on-primary);font-weight:600;transition:transform var(--nb-dur-fast) var(--nb-ease),filter var(--nb-dur-fast)}
.btn:active{transform:scale(.97);filter:brightness(.94)} .btn:disabled{opacity:.45}
.btn.cheio{width:100%} .btn.pq{height:var(--nb-control-h-sm);padding:0 14px;font-size:var(--nb-text-sm)}
.btn.accent{background:var(--nb-accent);color:var(--nb-on-accent)} .btn.secundario{background:var(--nb-primary-soft);color:var(--nb-primary-strong)} .btn.outline{background:transparent;color:var(--nb-text);border-color:var(--nb-border-strong)} .btn.ghost{background:transparent;color:var(--nb-primary)} .btn.danger{background:var(--nb-danger-soft);color:var(--nb-danger)}
.btn .lucide{width:18px;height:18px}
.ibtn{width:44px;height:44px;border-radius:var(--nb-radius-full);display:inline-grid;place-items:center;background:var(--nb-surface-2);color:var(--nb-text);flex:none}
.ibtn.primary{background:var(--nb-primary);color:#fff;box-shadow:var(--nb-shadow-raised)} .ibtn.accent{background:var(--nb-accent);color:#fff;box-shadow:var(--nb-shadow-raised)} .ibtn.plano{background:transparent}
.fab{position:fixed;right:max(20px,calc(50% - 215px + 20px));bottom:calc(var(--nb-tabbar-h) + 16px + env(safe-area-inset-bottom,0px));width:56px;height:56px;z-index:9}
.fab .lucide{width:26px;height:26px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo>span{font-size:var(--nb-text-sm);font-weight:500;color:var(--nb-text-2)}
.campo .caixa{display:flex;align-items:center;gap:10px;height:var(--nb-control-h);padding:0 14px;border-radius:var(--nb-radius-sm);background:var(--nb-surface);border:1.5px solid var(--nb-border);transition:box-shadow var(--nb-dur)}
.campo .caixa:focus-within{border-color:var(--nb-primary);box-shadow:0 0 0 3px var(--nb-primary-soft)}
.campo .caixa.erro{border-color:var(--nb-danger)}
.campo input,.campo select{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:16px;height:100%} /* 16px: abaixo disso o Safari do iPhone dá zoom ao focar */
.campo .fixo{color:var(--nb-text-2);font-size:var(--nb-text-sm)}
.campo input.pin{letter-spacing:.45em;text-align:center;font-family:var(--nb-font-display);font-size:26px}
.campo .dica{font-size:var(--nb-text-xs);color:var(--nb-text-3)} .campo .dica.erro{color:var(--nb-danger)}
.switch{width:50px;height:30px;border-radius:var(--nb-radius-full);flex:none;position:relative;background:var(--nb-border-strong);transition:background var(--nb-dur)}
.switch.on{background:var(--nb-primary)}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left var(--nb-dur) var(--nb-ease)}
.switch.on::after{left:23px}
.vazio{text-align:center;padding:40px 24px;display:flex;flex-direction:column;align-items:center;gap:8px}
.vazio .ic{width:56px;height:56px;border-radius:18px;background:var(--nb-surface-2);color:var(--nb-text-2);display:grid;place-items:center;margin-bottom:6px} .vazio .ic .lucide{width:26px;height:26px}
.vazio h3{font-family:var(--nb-font-display);font-size:var(--nb-text-xl);font-weight:500}
.vazio p{margin:0;color:var(--nb-text-2);max-width:260px;text-wrap:pretty}
.sd-ex summary::-webkit-details-marker{display:none} .sd-ex[open] summary .chev{color:var(--nb-primary)}
.campo .caixa:has(textarea){height:auto;align-items:stretch;padding:0 14px} .campo textarea{font-family:inherit;color:inherit}
.linha .txt small.op,.pp-item .op{display:block;white-space:normal;margin-top:8px;line-height:1.45} .linha .txt small.op:first-of-type{margin-top:6px}
.op .n{display:inline;font-weight:700;color:var(--nb-mod-saude);margin-right:2px} .op.evitar{color:var(--nb-danger);margin-top:10px}
.pp-item .op{font-size:var(--nb-text-sm)}
.opcao{display:flex;flex-direction:column;gap:2px;text-align:left;padding:10px 12px;border-radius:12px;border:1.5px solid var(--nb-border);background:var(--nb-surface);color:var(--nb-text);font-size:var(--nb-text-sm);line-height:1.4}
.opcao b{color:var(--nb-mod-saude);font-size:var(--nb-text-xs);text-transform:uppercase;letter-spacing:.06em} .opcao.on{border-color:var(--nb-mod-saude);background:var(--nb-mod-saude-soft)}
.sd-chat{display:flex;flex-direction:column;gap:10px;padding-bottom:80px}
.bolha{max-width:88%;padding:10px 14px;border-radius:18px;font-size:var(--nb-text-base);line-height:1.45;word-wrap:break-word}
.bolha.eu{align-self:flex-end;background:var(--nb-primary);color:var(--nb-on-primary);border-bottom-right-radius:6px}
.bolha.ia{align-self:flex-start;background:var(--nb-surface);box-shadow:var(--nb-shadow-card);border-bottom-left-radius:6px}
[data-theme="dark"] .bolha.ia{box-shadow:none;border:1px solid var(--nb-border)}
.bolha.pensando{color:var(--nb-text-3);font-style:italic}
.plano-prop{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--nb-mod-saude-soft);font-size:var(--nb-text-sm)}
.pp-item{padding:6px 0;border-bottom:1px solid rgba(0,0,0,.06)} .pp-item:last-of-type{border-bottom:0} .pp-item b{display:block;color:var(--nb-mod-saude)}
.sd-chat-form .caixa{flex:1;display:flex;align-items:center;min-width:0;height:46px;padding:0 16px;border-radius:23px;background:var(--nb-surface);border:1.5px solid var(--nb-border);transition:box-shadow var(--nb-dur)} .sd-chat-form .caixa:focus-within{border-color:var(--nb-primary);box-shadow:0 0 0 3px var(--nb-primary-soft)}
.sd-chat-form input{flex:1;min-width:0;width:100%;border:0;outline:0;background:transparent;font-size:16px;color:var(--nb-text)} .sd-chat-form input::placeholder{color:var(--nb-text-3)}
.sd-chat-form .ibtn{width:46px;height:46px}
.sd-chat-form{position:fixed;left:0;right:0;bottom:calc(var(--nb-tabbar-h) + env(safe-area-inset-bottom,0px));margin:0 auto;max-width:430px;display:flex;gap:8px;align-items:center;padding:8px var(--nb-screen-pad);background:color-mix(in srgb,var(--nb-bg) 92%,transparent);backdrop-filter:var(--nb-blur-bar);-webkit-backdrop-filter:var(--nb-blur-bar);z-index:9}
.progresso{height:6px;border-radius:3px;background:var(--nb-surface-2);overflow:hidden} .progresso i{display:block;height:100%;border-radius:3px;background:var(--nb-primary);transition:width var(--nb-dur-slow) var(--nb-ease)}
.stat .valor{display:flex;align-items:baseline;gap:6px;margin-top:6px} .stat .valor b{font-family:var(--nb-font-display);font-size:32px;font-weight:500;line-height:1.1;letter-spacing:-.01em}
.stat .delta{margin-left:auto;font-size:var(--nb-text-sm);font-weight:600;color:var(--nb-success)} .stat .delta.ruim{color:var(--nb-danger)}

/* ---- sheet (bottom sheet) ---- */
.sheet-fundo{position:fixed;inset:0;background:var(--nb-overlay);display:flex;align-items:flex-end;justify-content:center;z-index:20;animation:fade var(--nb-dur) var(--nb-ease)}
.sheet{width:100%;max-width:430px;background:var(--nb-surface);border-radius:var(--nb-radius-lg) var(--nb-radius-lg) 0 0;box-shadow:var(--nb-shadow-sheet);padding:8px var(--nb-screen-pad) calc(20px + env(safe-area-inset-bottom,0px));max-height:92dvh;overflow:auto;animation:sobe var(--nb-dur-slow) var(--nb-ease)}
.sheet .alca{width:40px;height:4px;border-radius:2px;background:var(--nb-border-strong);margin:0 auto 14px}
.sheet h3{font-size:var(--nb-text-lg);font-weight:600;margin-bottom:14px}
.sheet .corpo{display:flex;flex-direction:column;gap:14px}
.sheet .rodape{margin-top:20px;display:flex;gap:10px}
@keyframes sobe{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- entrada (perfis) ---- */
.perfis{padding:calc(60px + env(safe-area-inset-top,0px)) var(--nb-screen-pad) 40px;min-height:100dvh;display:flex;flex-direction:column;align-items:center;text-align:center}
.perfis .logo{width:56px;height:56px}
.perfis h1{font-family:var(--nb-font-display);font-size:32px;font-weight:500;line-height:1.15;margin-top:24px}
.perfis p{color:var(--nb-text-2);margin:6px 0 0}
.perfis .grade{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;width:100%}
.perfil{display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 12px;border-radius:var(--nb-radius-md);background:var(--nb-surface);box-shadow:var(--nb-shadow-card);color:var(--nb-text);transition:transform var(--nb-dur-fast) var(--nb-ease)}
.perfil:active{transform:scale(.97)}
.perfil b{font-weight:600;font-size:var(--nb-text-md)} .perfil small{font-size:var(--nb-text-sm);color:var(--nb-text-2)}
[data-theme="dark"] .perfil{box-shadow:none;border:1px solid var(--nb-border)}
.toast{position:fixed;left:50%;bottom:calc(var(--nb-tabbar-h) + 20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--nb-ink-900);color:var(--nb-sand-50);padding:10px 16px;border-radius:var(--nb-radius-sm);font-size:var(--nb-text-sm);box-shadow:var(--nb-shadow-raised);z-index:50;max-width:calc(100% - 40px);text-align:center}
.toast.erro{background:var(--nb-danger)} .toast.ok{background:var(--nb-success)}
.mini-lista{display:flex;flex-direction:column} .norte{display:flex;align-items:center;gap:14px}
.norte .ic{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.16);display:grid;place-items:center;flex:none}
.norte .caps{color:inherit;opacity:.8} .norte b{display:block;font-size:var(--nb-text-md);font-weight:600;margin-top:2px} .norte small{display:block;font-size:var(--nb-text-sm);opacity:.85;margin-top:2px}
