/*
 * Ordi — Nova UI (canvas de design): tokens e componentes das pranchas
 * mobile, com escopo .nova. Valores copiados das pranchas (Main, Voz,
 * Conversa, Agenda…): raios, tipografia e espaçamentos. As cores vêm TODAS
 * do bloco de tokens abaixo (tema escuro e tema claro).
 */

@font-face { font-family: "Outfit"; src: url("/assets/ordi/Outfit-339084bb.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Lexend"; src: url("/assets/ordi/Lexend-6a085db1.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("/assets/ordi/JetBrainsMono-94ca71ec.ttf") format("truetype"); font-weight: 100 800; font-display: swap; }

/* ==========================================================================
 * TOKENS DE COR DA NOVA — tema escuro e tema claro (frente TEMA-BASE, 30/09/2026)
 *
 * Quem escolhe o tema: <html data-theme="auto|light|dark"> (servidor, a partir
 * de users.ui_theme; sem sessão, o script do <head> usa o localStorage
 * "ordi-theme"). "auto" ou ausente segue prefers-color-scheme.
 *
 * REGRA: nas folhas Nova (ordi_nova*.css) nenhuma cor fixa fora deste bloco.
 * Gate: test/architecture/nova_theme_tokens_gate_test.rb (a lista
 * LEGACY_COLOR_BUDGET diz quais folhas ainda devem conversão). Para converter
 * uma folha: troque cada hex/rgba pelo token de mesmo papel abaixo, tire a
 * folha da lista do gate e confira a tela nos dois temas.
 *
 * Fundo e superfícies
 *   --n-bg, --n-bg-deep     fundo da página (claro: levemente frio)
 *   --n-side                barra lateral da casca web
 *   --n-card                cartão (.card) — no escuro vidro, no claro branco
 *   --n-surface             superfície sólida: campo, avatar, chip de hora
 *   --n-sheet               folhas (dialog), menus, ⌘K
 *   --n-toast, --n-nav      aviso flutuante e cápsula das abas
 *   --n-sunken              trilho afundado: segmentado, busca
 *   --n-selected            segmento escolhido dentro de --n-sunken
 *   --n-raised, --n-raised-ring   item ativo da barra lateral, tooltip
 *   --n-event, --n-event-border   bloco de evento neutro (Agenda)
 *   --n-track               trilho de barra/anel de progresso
 *   --n-dot-off, --n-dot-pending  pontos de histórico
 *   --n-overlay             fundo atrás de folha/modal (::backdrop)
 *   --n-voz-core            centro do fundo radial da Voz
 *   Conversa e Voz: --n-hairline (linha do cabeçalho e do painel de voz),
 *   --n-bubble-me / --n-bubble-me-border (bolha de quem escreve),
 *   --n-done-text / --n-done-action (pílula "Feito · Desfazer"),
 *   --n-placeholder (dica do compositor), --n-orb-core (miolo do orbe
 *   pequeno), --n-voz-edge (borda do fundo radial do painel de voz)
 * Bordas
 *   --n-border (padrão), --n-border-soft (cartão), --n-border-strong (botão
 *   fantasma), --n-line / --n-divider (linhas entre itens), --n-focus (campo
 *   em foco), --n-control (aro de marcar), --n-border-dash (sugestão),
 *   --n-border-signal / -violet / -amber (cartões com degradê do acento)
 * Texto (todos AA sobre --n-bg, --n-card e --n-sunken nos dois temas)
 *   --n-strong > --n-text > --n-body > --n-soft > --n-muted > --n-label
 *   --n-faint: só texto grande ou decorativo (3:1)
 * Acentos (sólidos; como texto passam AA sobre fundo e cartão)
 *   --n-cyan, --n-cyan-deep, --n-violet, --n-violet-dim, --n-amber,
 *   --n-green, --n-green-deep, --n-rose, --n-red
 *   Texto tingido (rótulo/nota colorida): --n-cyan-soft, --n-violet-soft,
 *   --n-violet-softer, --n-amber-soft, --n-rose-soft, --n-rose-softer
 *   Texto sobre acento: --n-on-cyan, --n-on-green, --n-on-rose
 *   Inverso (botão primário, dia escolhido): --n-inverse / --n-on-inverse /
 *   --n-inverse-soft (escuro: quase branco; claro: quase preto)
 *   Marca (degradê do avatar, igual nos dois): --n-brand-a, --n-brand-b
 * Tintas (fundo/borda translúcidos do acento): rgb(var(--n-X-rgb) / .12)
 *   X = slate (neutro), cyan, cyan-hi, violet, purple, amber, green, rose,
 *   red, surface, bg, inverse. Nunca escreva o rgba do acento à mão.
 * Brilhos e halos
 *   rgb(var(--n-X-rgb) / calc(α * var(--n-glow-k))) — o claro reduz o brilho
 *   (--n-glow-k .45) e troca a luz pela sombra do cartão.
 *   --n-orb-halo, --n-orb-halo-shadow, --n-orb-halo-soft: halo atrás do orbe.
 *   --n-orb-mode (dark|light): lido pelo voice_orb_controller.js.
 * Sombras
 *   --n-shadow-card (escuro: nenhuma; claro: sombra suave no lugar do brilho),
 *   --n-shadow-float, --n-shadow-pop, --n-shadow-sheet, --n-shadow-modal,
 *   --n-shadow-tip, --n-shadow-toast
 * Gráficos (validados com o validador do skill dataviz nos dois temas)
 *   --n-chart-1..6 (ciano, âmbar, violeta, verde, azul, rosa — nessa ordem,
 *   nunca cíclico), --n-chart-grid, --n-chart-track. Em JS: leia com
 *   getComputedStyle(document.documentElement) e redesenhe no evento
 *   "ordi:theme-change" (disparado no document quando o tema muda).
 * Estados: --n-ok (verde), --n-warn (âmbar), --n-bad (rosa), --n-info (ciano).
 * --n-scheme: valor para color-scheme de campos nativos.
 *
 * O bloco claro aparece duas vezes (data-theme="light" e o automático no
 * prefers-color-scheme: light) — o gate confere que as duas cópias são iguais.
 * ========================================================================== */
:root,
:root[data-theme="dark"] {
  --n-scheme: dark;
  --n-bg: #17142B;
  --n-bg-deep: #110F21;
  --n-bg-rgb: 23 20 43;
  --n-side: #1A1731;
  --n-card: rgba(34, 30, 61, .78);
  --n-surface: #221E3D;
  --n-surface-rgb: 34 30 61;
  --n-sheet: #1E1A37;
  --n-toast: rgba(30, 26, 55, .94);
  --n-nav: rgba(26, 23, 49, .92);
  --n-sunken: #1D1A35;
  --n-selected: #2E2952;
  --n-raised: #2C2750;
  --n-raised-ring: #3D3770;
  --n-event: #201C3B;
  --n-event-border: #332D5C;
  --n-track: #2A2549;
  --n-dot-off: #28234A;
  --n-dot-pending: #4A4478;
  --n-overlay: rgba(10, 8, 20, .72);
  --n-voz-core: #262056;
  /* Conversa e Voz (frente TEMA-CONVERSA). */
  --n-hairline: #231F40;
  --n-bubble-me: #2E2952;
  --n-bubble-me-border: #3D3770;
  --n-done-text: #A7F3D0;
  --n-done-action: #6EE7B7;
  --n-placeholder: #8E89AA;
  --n-orb-core: #F5B83D;
  --n-voz-edge: #120F23;

  --n-border: #36305E;
  --n-border-soft: #2E2952;
  --n-border-strong: #3F3870;
  --n-line: #29244A;
  --n-divider: #262145;
  --n-focus: #6B5CE8;
  --n-control: #514A80;
  --n-border-dash: #5A5390;
  --n-border-signal: #3F3874;
  --n-border-violet: #3A3170;
  --n-border-amber: #4A3B1C;

  --n-strong: #F4F4F6;
  --n-text: #F1F0F6;
  --n-body: #E4E2EE;
  --n-soft: #CAC6DC;
  --n-muted: #A39EBD;
  --n-label: #9A95B5;
  --n-faint: #7D78A0;

  --n-cyan: #A99EF8;
  --n-cyan-deep: #7A6BF0;
  --n-violet: #C9C2F2;
  --n-violet-dim: #4A38C9;
  --n-amber: #FBBF24;
  --n-green: #34D399;
  --n-green-deep: #10B981;
  --n-rose: #FB7185;
  --n-red: #F43F5E;
  --n-cyan-soft: #C9C2F2;
  --n-violet-soft: #D9D4F7;
  --n-violet-softer: #ECE9FC;
  --n-amber-soft: #FCD34D;
  --n-rose-soft: #FDA4AF;
  --n-rose-softer: #FECDD3;
  --n-on-cyan: #17142B;
  --n-on-green: #062E22;
  --n-on-rose: #3B0712;
  --n-inverse: #6B5CE8;
  --n-on-inverse: #FFFFFF;
  --n-inverse-soft: #FFFFFF;
  --n-brand-a: #4A38C9;
  --n-brand-b: #7A6BF0;
  /* Telas A, B e D (frente TEMA-TELAS): etiqueta verde/violeta clara, início
     do degradê âmbar das barras, aro do quadradinho de marcar. --n-paper é o
     branco do QR Code, igual nos dois temas (a leitura exige fundo branco). */
  --n-green-softer: #A7F3D0;
  --n-violet-pale: #D9D4F7;
  --n-amber-deep: #F59E0B;
  --n-check-ring: #4A4478;
  --n-paper: #FFFFFF;

  --n-slate-rgb: 163 158 189;
  --n-cyan-rgb: 122 107 240;
  --n-cyan-hi-rgb: 169 158 248;
  --n-violet-rgb: 201 194 242;
  --n-purple-rgb: 74 56 201;
  --n-amber-rgb: 251 191 36;
  --n-green-rgb: 52 211 153;
  --n-rose-rgb: 251 113 133;
  --n-red-rgb: 244 63 94;
  --n-inverse-rgb: 107 92 232;

  --n-glow-k: 1;
  --n-orb-mode: dark;
  --n-orb-halo: radial-gradient(closest-side, rgba(122, 107, 240, .22), rgba(122, 107, 240, .14) 70%, rgba(122, 107, 240, .06));
  --n-orb-halo-shadow: 0 0 26px 4px rgba(122, 107, 240, .22);
  --n-orb-halo-soft: radial-gradient(closest-side, rgba(245, 184, 61, .08), rgba(74, 56, 201, .08) 55%, transparent);

  --n-shadow-card: none;
  --n-shadow-float: 0 18px 40px rgba(0, 0, 0, .45);
  --n-shadow-pop: 0 18px 40px rgba(0, 0, 0, .5);
  --n-shadow-sheet: 0 -18px 50px rgba(0, 0, 0, .55);
  --n-shadow-modal: 0 28px 70px rgba(0, 0, 0, .6);
  --n-shadow-tip: 0 10px 24px rgba(0, 0, 0, .45);
  --n-shadow-toast: 0 18px 44px rgba(0, 0, 0, .5);

  --n-chart-1: #0BA5C4;
  --n-chart-2: #D97706;
  --n-chart-3: #9B6CF7;
  --n-chart-4: #0FA878;
  --n-chart-5: #4A86F0;
  --n-chart-6: #EE3A62;
  --n-chart-grid: #29244A;
  --n-chart-track: #2A2549;

  /* Dinheiro, Metas e finanças internas (frente TEMA-DINHEIRO): borda do
     cartão verde, item escolhido numa lista (meta, passo), item de menu sob
     o ponteiro, texto verde bem claro sobre tinta verde. --n-flow-*: o Sankey
     "Para onde foi o seu dinheiro" — seis categóricas validadas (validador do
     dataviz) no cartão escuro #111828 e no branco; no claro só a entrada
     escurece (contraste ≥ 3:1 sobre o branco). */
  --n-border-green: #1F4A3C;
  --n-active: #262056;
  --n-active-border: #3F3874;
  --n-hover: #2E2952;
  --n-green-pale: #D1FAE5;
  --n-flow-1: #0891B2;
  --n-flow-2: #8B5CF6;
  --n-flow-3: #D97706;
  --n-flow-4: #2563EB;
  --n-flow-5: #DB2777;
  --n-flow-6: #65A30D;
  --n-flow-other: #7D78A0;
  --n-flow-in: #10B981;
  --n-flow-out: #E11D48;
  --n-flow-pivot: #475569;

  /* Agenda, Vida e onboarding (frente TEMA-AGENDA-VIDA): linhas da grade,
     bloco de evento largo, verde/âmbar claros como texto sobre tinta,
     cartão fundo (receita), aviso de exemplo, barras de constância. */
  --n-grid-line: #231F40;
  --n-block: #241F45;
  --n-block-border: #36305E;
  --n-block-hover: #4A4478;
  --n-border-free: #5A5390;
  --n-green-soft: #6EE7B7;
  --n-amber-softer: #FDE68A;
  --n-green-deep-rgb: 16 185 129;
  --n-deep-rgb: 29 26 53;
  --n-notif: rgba(46, 41, 82, .72);
  --n-widget-a: #221E3D;
  --n-widget-b: #15122A;
  --n-const-low: #2A2552;
  --n-const-mid: #3D3388;
  --n-const-high: #5B4BD6;

  /* Miniaturas do Perfil › Aparência: mostram cada tema, iguais nos dois. */
  --n-swatch-dark: #17142B;
  --n-swatch-dark-card: #2A2549;
  --n-swatch-light: #F4F4F6;
  --n-swatch-light-card: #FFFFFF;
  --n-swatch-line: rgba(163, 158, 189, .45);

  --n-ok: var(--n-green);
  --n-warn: var(--n-amber);
  --n-bad: var(--n-rose);
  --n-info: var(--n-cyan);

  /* Marca v2 (16/10/2026, docs/marca/v2): paleta crua e o Di. --n-sun é só
     acento (ponto do Di, conquistas) — nunca texto sobre fundo claro. */
  --n-brand: #4A38C9;
  --n-brand-light: #7A6BF0;
  --n-brand-ring: #C9C2F2;
  --n-brand-press: #3B2DB0;
  --n-ink: #17142B;
  --n-ink-2: #45415C;
  --n-mist: #F4F4F6;
  --n-sun: #F5B83D;
  --n-di-eye: #FFFFFF;
  --n-di-dot: #F5B83D;
  --n-di-mark: #17142B;
  --n-di-ring: #C9C2F2;
  --n-di-body: #7A6BF0;
}

/* Tema claro escolhido no Perfil. (cópia 1 de 2 — manter igual à do @media) */
:root[data-theme="light"] {
  --n-scheme: light;
  --n-bg: #F4F4F6;
  --n-bg-deep: #EAE9EF;
  --n-bg-rgb: 244 244 246;
  --n-side: #FBFBFC;
  --n-card: #FFFFFF;
  --n-surface: #FFFFFF;
  --n-surface-rgb: 255 255 255;
  --n-sheet: #FFFFFF;
  --n-toast: rgba(255, 255, 255, .97);
  --n-nav: rgba(255, 255, 255, .94);
  --n-sunken: #ECEBF0;
  --n-selected: #FFFFFF;
  --n-raised: #ECE9FB;
  --n-raised-ring: #C9C2F2;
  --n-event: #F8F8FA;
  --n-event-border: #E0DEE7;
  --n-track: #E6E5EC;
  --n-dot-off: #E9E8EE;
  --n-dot-pending: #B8B4C8;
  --n-overlay: rgba(23, 20, 43, .38);
  --n-voz-core: #E4E0FA;
  /* Conversa e Voz (frente TEMA-CONVERSA). */
  --n-hairline: #E6E5EC;
  --n-bubble-me: #ECE9FB;
  --n-bubble-me-border: #D6D0F5;
  --n-done-text: #065F46;
  --n-done-action: #05704F;
  --n-placeholder: #6E6A85;
  --n-orb-core: #B45309;
  --n-voz-edge: #F1F1F4;

  --n-border: #DCDAE3;
  --n-border-soft: #E6E5EC;
  --n-border-strong: #CFCCD9;
  --n-line: #E9E8EE;
  --n-divider: #E9E8EE;
  --n-focus: #7A6BF0;
  --n-control: #8A86A0;
  --n-border-dash: #B3AFC4;
  --n-border-signal: #C9C2F2;
  --n-border-violet: #D9D4F7;
  --n-border-amber: #EED9A4;

  --n-strong: #17142B;
  --n-text: #17142B;
  --n-body: #2E2A45;
  --n-soft: #45415C;
  --n-muted: #5C5873;
  --n-label: #5C5873;
  --n-faint: #827E98;

  --n-cyan: #4A38C9;
  --n-cyan-deep: #3B2DB0;
  --n-violet: #3B2DB0;
  --n-violet-dim: #2E2390;
  --n-amber: #A34B07;
  --n-green: #047857;
  --n-green-deep: #059669;
  --n-rose: #C8163F;
  --n-red: #E11D48;
  --n-cyan-soft: #3B2DB0;
  --n-violet-soft: #3B2DB0;
  --n-violet-softer: #2E2390;
  --n-amber-soft: #92400E;
  --n-rose-soft: #BE123C;
  --n-rose-softer: #9F1239;
  --n-on-cyan: #FFFFFF;
  --n-on-green: #FFFFFF;
  --n-on-rose: #FFFFFF;
  --n-inverse: #4A38C9;
  --n-on-inverse: #FFFFFF;
  --n-inverse-soft: #E4E0FA;
  --n-brand-a: #4A38C9;
  --n-brand-b: #7A6BF0;
  /* Telas A, B e D (frente TEMA-TELAS). */
  --n-green-softer: #065F46;
  --n-violet-pale: #2E2390;
  --n-amber-deep: #D97706;
  --n-check-ring: #8A86A0;

  --n-slate-rgb: 92 88 115;
  --n-cyan-rgb: 74 56 201;
  --n-cyan-hi-rgb: 59 45 176;
  --n-violet-rgb: 59 45 176;
  --n-purple-rgb: 74 56 201;
  --n-amber-rgb: 217 119 6;
  --n-green-rgb: 5 150 105;
  --n-rose-rgb: 225 29 72;
  --n-red-rgb: 225 29 72;
  --n-inverse-rgb: 74 56 201;

  --n-glow-k: .45;
  --n-orb-mode: light;
  --n-orb-halo: radial-gradient(closest-side, rgba(74, 56, 201, .14), rgba(74, 56, 201, .09) 70%, rgba(74, 56, 201, .04));
  --n-orb-halo-shadow: 0 0 20px 2px rgba(74, 56, 201, .14);
  --n-orb-halo-soft: radial-gradient(closest-side, rgba(245, 184, 61, .10), rgba(74, 56, 201, .06) 55%, transparent);

  --n-shadow-card: 0 1px 2px rgba(23, 20, 43, .04), 0 4px 18px -6px rgba(23, 20, 43, .08);
  --n-shadow-float: 0 10px 30px -6px rgba(23, 20, 43, .16), 0 2px 6px rgba(23, 20, 43, .06);
  --n-shadow-pop: 0 16px 36px -8px rgba(23, 20, 43, .18);
  --n-shadow-sheet: 0 -12px 40px rgba(23, 20, 43, .14);
  --n-shadow-modal: 0 24px 60px -12px rgba(23, 20, 43, .28);
  --n-shadow-tip: 0 8px 20px -4px rgba(23, 20, 43, .16);
  --n-shadow-toast: 0 14px 36px -8px rgba(23, 20, 43, .18);

  --n-chart-1: #0891B2;
  --n-chart-2: #D97706;
  --n-chart-3: #8B5CF6;
  --n-chart-4: #059669;
  --n-chart-5: #2563EB;
  --n-chart-6: #E11D48;
  --n-chart-grid: #E9E8EE;
  --n-chart-track: #E6E5EC;
  /* Dinheiro, Metas e finanças internas (frente TEMA-DINHEIRO). */
  --n-border-green: #A7DCC5;
  --n-active: #ECE9FB;
  --n-active-border: #C9C2F2;
  --n-hover: #F0EFF4;
  --n-green-pale: #064E3B;
  --n-flow-in: #059669;

  /* Agenda, Vida e onboarding (frente TEMA-AGENDA-VIDA). */
  --n-grid-line: #E6E5EC;
  --n-block: #F1F0F5;
  --n-block-border: #DCDAE3;
  --n-block-hover: #B3AFC4;
  --n-border-free: #A39EBD;
  --n-green-soft: #065F46;
  --n-amber-softer: #92400E;
  --n-green-deep-rgb: 5 150 105;
  --n-deep-rgb: 255 255 255;
  --n-notif: #FFFFFF;
  --n-widget-a: #FFFFFF;
  --n-widget-b: #F1F0F5;
  --n-const-low: #E4E0FA;
  --n-const-mid: #C9C2F2;
  --n-const-high: #7A6BF0;

  /* Marca v2: o Di no claro é o violeta da marca. */
  --n-di-body: #4A38C9;
}

/* Automático: sem escolha ou "auto" segue o aparelho. (cópia 2 de 2) */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]):not([data-theme="light"]) {
    --n-scheme: light;
    --n-bg: #F4F4F6;
    --n-bg-deep: #EAE9EF;
    --n-bg-rgb: 244 244 246;
    --n-side: #FBFBFC;
    --n-card: #FFFFFF;
    --n-surface: #FFFFFF;
    --n-surface-rgb: 255 255 255;
    --n-sheet: #FFFFFF;
    --n-toast: rgba(255, 255, 255, .97);
    --n-nav: rgba(255, 255, 255, .94);
    --n-sunken: #ECEBF0;
    --n-selected: #FFFFFF;
    --n-raised: #ECE9FB;
    --n-raised-ring: #C9C2F2;
    --n-event: #F8F8FA;
    --n-event-border: #E0DEE7;
    --n-track: #E6E5EC;
    --n-dot-off: #E9E8EE;
    --n-dot-pending: #B8B4C8;
    --n-overlay: rgba(23, 20, 43, .38);
    --n-voz-core: #E4E0FA;
    /* Conversa e Voz (frente TEMA-CONVERSA). */
    --n-hairline: #E6E5EC;
    --n-bubble-me: #ECE9FB;
    --n-bubble-me-border: #D6D0F5;
    --n-done-text: #065F46;
    --n-done-action: #05704F;
    --n-placeholder: #6E6A85;
    --n-orb-core: #B45309;
    --n-voz-edge: #F1F1F4;

    --n-border: #DCDAE3;
    --n-border-soft: #E6E5EC;
    --n-border-strong: #CFCCD9;
    --n-line: #E9E8EE;
    --n-divider: #E9E8EE;
    --n-focus: #7A6BF0;
    --n-control: #8A86A0;
    --n-border-dash: #B3AFC4;
    --n-border-signal: #C9C2F2;
    --n-border-violet: #D9D4F7;
    --n-border-amber: #EED9A4;

    --n-strong: #17142B;
    --n-text: #17142B;
    --n-body: #2E2A45;
    --n-soft: #45415C;
    --n-muted: #5C5873;
    --n-label: #5C5873;
    --n-faint: #827E98;

    --n-cyan: #4A38C9;
    --n-cyan-deep: #3B2DB0;
    --n-violet: #3B2DB0;
    --n-violet-dim: #2E2390;
    --n-amber: #A34B07;
    --n-green: #047857;
    --n-green-deep: #059669;
    --n-rose: #C8163F;
    --n-red: #E11D48;
    --n-cyan-soft: #3B2DB0;
    --n-violet-soft: #3B2DB0;
    --n-violet-softer: #2E2390;
    --n-amber-soft: #92400E;
    --n-rose-soft: #BE123C;
    --n-rose-softer: #9F1239;
    --n-on-cyan: #FFFFFF;
    --n-on-green: #FFFFFF;
    --n-on-rose: #FFFFFF;
    --n-inverse: #4A38C9;
    --n-on-inverse: #FFFFFF;
    --n-inverse-soft: #E4E0FA;
    --n-brand-a: #4A38C9;
    --n-brand-b: #7A6BF0;
    /* Telas A, B e D (frente TEMA-TELAS). */
    --n-green-softer: #065F46;
    --n-violet-pale: #2E2390;
    --n-amber-deep: #D97706;
    --n-check-ring: #8A86A0;

    --n-slate-rgb: 92 88 115;
    --n-cyan-rgb: 74 56 201;
    --n-cyan-hi-rgb: 59 45 176;
    --n-violet-rgb: 59 45 176;
    --n-purple-rgb: 74 56 201;
    --n-amber-rgb: 217 119 6;
    --n-green-rgb: 5 150 105;
    --n-rose-rgb: 225 29 72;
    --n-red-rgb: 225 29 72;
    --n-inverse-rgb: 74 56 201;

    --n-glow-k: .45;
    --n-orb-mode: light;
    --n-orb-halo: radial-gradient(closest-side, rgba(74, 56, 201, .14), rgba(74, 56, 201, .09) 70%, rgba(74, 56, 201, .04));
    --n-orb-halo-shadow: 0 0 20px 2px rgba(74, 56, 201, .14);
    --n-orb-halo-soft: radial-gradient(closest-side, rgba(245, 184, 61, .10), rgba(74, 56, 201, .06) 55%, transparent);

    --n-shadow-card: 0 1px 2px rgba(23, 20, 43, .04), 0 4px 18px -6px rgba(23, 20, 43, .08);
    --n-shadow-float: 0 10px 30px -6px rgba(23, 20, 43, .16), 0 2px 6px rgba(23, 20, 43, .06);
    --n-shadow-pop: 0 16px 36px -8px rgba(23, 20, 43, .18);
    --n-shadow-sheet: 0 -12px 40px rgba(23, 20, 43, .14);
    --n-shadow-modal: 0 24px 60px -12px rgba(23, 20, 43, .28);
    --n-shadow-tip: 0 8px 20px -4px rgba(23, 20, 43, .16);
    --n-shadow-toast: 0 14px 36px -8px rgba(23, 20, 43, .18);

    --n-chart-1: #0891B2;
    --n-chart-2: #D97706;
    --n-chart-3: #8B5CF6;
    --n-chart-4: #059669;
    --n-chart-5: #2563EB;
    --n-chart-6: #E11D48;
    --n-chart-grid: #E9E8EE;
    --n-chart-track: #E6E5EC;
    /* Dinheiro, Metas e finanças internas (frente TEMA-DINHEIRO). */
    --n-border-green: #A7DCC5;
    --n-active: #ECE9FB;
    --n-active-border: #C9C2F2;
    --n-hover: #F0EFF4;
    --n-green-pale: #064E3B;
    --n-flow-in: #059669;

    /* Agenda, Vida e onboarding (frente TEMA-AGENDA-VIDA). */
    --n-grid-line: #E6E5EC;
    --n-block: #F1F0F5;
    --n-block-border: #DCDAE3;
    --n-block-hover: #B3AFC4;
    --n-border-free: #A39EBD;
    --n-green-soft: #065F46;
    --n-amber-softer: #92400E;
    --n-green-deep-rgb: 5 150 105;
    --n-deep-rgb: 255 255 255;
    --n-notif: #FFFFFF;
    --n-widget-a: #FFFFFF;
    --n-widget-b: #F1F0F5;
    --n-const-low: #E4E0FA;
    --n-const-mid: #C9C2F2;
    --n-const-high: #7A6BF0;

    /* Marca v2: o Di no claro é o violeta da marca. */
    --n-di-body: #4A38C9;
  }
}
/* ========================== fim dos tokens de cor ========================== */

.nova {
  position: relative;
  min-height: 100vh;
  background: var(--n-bg);
  color: var(--n-text);
  color-scheme: var(--n-scheme);
  font-family: "Lexend", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.nova a { color: var(--n-cyan); text-decoration: none; }
.nova button { font-family: inherit; }
.nova .glow {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(420px 320px at 88% -60px, rgb(var(--n-cyan-rgb) / calc(.20 * var(--n-glow-k))), transparent 70%),
    radial-gradient(380px 300px at -40px 180px, rgb(var(--n-purple-rgb) / calc(.16 * var(--n-glow-k))), transparent 70%);
}
.nova .page { position: relative; padding: calc(var(--ordi-native-top-inset, 0px) + 20px) 20px 24px; display: flex; flex-direction: column; gap: 22px; max-width: 520px; margin: 0 auto; }
/* Barra de status do app (U-25): a página do app ocupa a tela inteira e o
   conteúdo rolava por baixo do relógio. Uma faixa fixa do tamanho da barra
   (--ordi-native-top-inset, que o app escreve no <html>) cobre a área. No
   navegador a variável não existe e a altura é 0. Vale para toda tela Nova
   (Hoje, Dinheiro, Metas, Hábitos…), já que todas montam .page. */
.nova .page::before { content: ""; position: fixed; z-index: 75; top: 0; left: 0; right: 0; height: var(--ordi-native-top-inset, 0px); background: var(--n-bg); pointer-events: none; }

.nova .lbl { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--n-label); }
.nova .disp { font-family: "Outfit", "Segoe UI", sans-serif; }
.nova .muted { color: var(--n-muted); }
.nova .card { background: var(--n-card); border: 1px solid var(--n-border-soft); box-shadow: var(--n-shadow-card); border-radius: 24px; padding: 18px; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.nova .chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border); font-size: 12.5px; color: var(--n-soft); white-space: nowrap; }
.nova .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 14px; font-weight: 700; font-size: 14px; border: none; cursor: pointer; text-decoration: none; }
.nova .btn-p { background: var(--n-inverse); color: var(--n-on-inverse); }
.nova .btn-p:hover, .nova .btn-p:active { background: var(--n-cyan); color: var(--n-on-cyan); }
.nova .btn-g { background: rgb(var(--n-slate-rgb) / .08); color: var(--n-body); border: 1px solid var(--n-border-strong); }
.nova .icn { width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border); color: var(--n-soft); cursor: pointer; padding: 0; flex-shrink: 0; }
.nova svg.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.nova .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* O Di (antes o orbe) solto sobre o fundo, sem poço escuro. */
.nova .orb-well { border-radius: 50%; background: transparent; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.nova .orb-well > .di { display: block; width: 100%; height: 100%; }
/* O Di respira, tem anéis e o ponto fora do corpo: nada de recortar no círculo. */
.orb-well.di-well, .nova .orb-well.di-well { overflow: visible; }
.orb-well.di-well > .di { display: block; width: 100%; height: 100%; }

/* ==========================================================================
 * Di — mascote da marca v2 (shared/_di). Cores só pelos tokens --n-di-*.
 * Estado = data-state no <svg>; a troca é transição curta e suave (sem
 * quicar). O movimento contínuo vem do voice_orb_controller.js pelas
 * variáveis --di-breath (respirar 100→102%), --di-blink (piscar),
 * --di-level (volume 0..1: anéis e boca), --di-orbit (ponto em volta do
 * corpo, pensando) e --di-pulse (ponto pulsando, ouvindo). Com "reduzir
 * movimento" o controller não anima e a troca de estado é instantânea.
 * ========================================================================== */
/* Di pequeno como máscara (corpo com os olhos vazados), para ::before e
   fundos: a cor vem de quem usa (background: var(--n-di-body)). */
:root { --n-di-mini-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath fill-rule='evenodd' d='M16 104a84 84 0 1 0 168 0a84 84 0 1 0-168 0ZM58 90a12 12 0 0 1 24 0v20a12 12 0 0 1-24 0ZM118 90a12 12 0 0 1 24 0v20a12 12 0 0 1-24 0Z'/%3E%3C/svg%3E"); }
.di { overflow: visible; flex-shrink: 0; --di-t: .32s cubic-bezier(.4, 0, .2, 1); }
.di * { transform-box: fill-box; transform-origin: center; }
.di .di-body { fill: var(--n-di-body); transition: transform var(--di-t), fill var(--di-t); }
.di .di-eyes { fill: var(--n-di-eye); opacity: 0; transition: transform var(--di-t), opacity var(--di-t); }
.di .di-eyes--arc { fill: none; stroke: var(--n-di-eye); stroke-width: 9; stroke-linecap: round; transform: scaleY(.4); }
.di .di-eyes--round, .di .di-eyes--closed { transform: scale(.6); }
.di .di-eyes--pill { opacity: 1; }
.di .di-blink { transform: scaleY(var(--di-blink, 1)); }
.di .di-mouth { fill: var(--n-di-eye); opacity: 0; transform: scaleY(.2); transition: opacity var(--di-t); }
.di .di-rings { fill: none; stroke: var(--n-di-ring); opacity: 0; transform-box: view-box; transform-origin: 96px 114px; transform: scale(calc(.92 + var(--di-level, 0) * .1)); transition: opacity var(--di-t); }
.di .di-ring { stroke-width: 4; }
.di .di-ring--far { stroke-width: 3; opacity: .5; transform: scale(calc(1 + var(--di-level, 0) * .06)); }
.di .di-trail { fill: none; stroke: var(--n-di-ring); stroke-width: 3; stroke-dasharray: 4 7; stroke-linecap: round; opacity: 0; transition: opacity var(--di-t); }
.di .di-figure { transform-box: view-box; transform-origin: 96px 114px; transform: scale(var(--di-breath, 1)); }
.di .di-orbit { transform-box: view-box; transform-origin: 96px 114px; transform: rotate(var(--di-orbit, 0deg)); }
.di .di-dot { transition: transform var(--di-t), opacity var(--di-t); }
.di .di-dot-pulse { transform: scale(var(--di-pulse, 1)); }
.di .di-dot-disc { fill: var(--n-di-dot); transition: transform var(--di-t); }
.di .di-check { fill: none; stroke: var(--n-di-mark); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transition: opacity var(--di-t); }
.di .di-alert { fill: var(--n-di-mark); opacity: 0; transition: opacity var(--di-t); }

/* Ouvindo: olhos mais altos (36), corpo um pouco menor, anéis no volume. */
.di[data-state="listening"] .di-eyes--pill { transform: translateY(-1px) scaleY(1.2); }
.di[data-state="listening"] .di-body { transform: scale(.947, .944); }
.di[data-state="listening"] .di-rings { opacity: 1; }
.di[data-state="listening"] .di-dot { transform: translateY(-6px); }
.di[data-state="listening"] .di-dot-disc { transform: scale(1.13); }
/* Pensando: olhar para cima e à direita; o ponto dá voltas (controller). */
.di[data-state="thinking"] .di-eyes--pill { transform: translate(9px, -9px) scaleY(.8); }
.di[data-state="thinking"] .di-trail { opacity: 1; }
.di[data-state="thinking"] .di-dot-disc { transform: scale(.8); }
/* Falando: o único estado com boca — uma pílula que abre com o áudio. */
.di[data-state="speaking"] .di-eyes--pill { transform: translateY(-3px) scaleY(.93); }
.di[data-state="speaking"] .di-mouth { opacity: 1; transform: scaleY(calc(.3 + var(--di-level, 0) * .7)); }
/* Feito: olhos ^^ e o ponto cresce com um visto. Sem confete. */
.di[data-state="done"] .di-eyes--pill { opacity: 0; transform: scaleY(.2); }
.di[data-state="done"] .di-eyes--arc { opacity: 1; transform: none; }
.di[data-state="done"] .di-dot-disc { transform: scale(1.4); }
.di[data-state="done"] .di-check { opacity: 1; }
/* Lembrete: olhos redondos e o ponto cresce com "!". */
.di[data-state="reminder"] .di-eyes--pill { opacity: 0; transform: scaleY(.3); }
.di[data-state="reminder"] .di-eyes--round { opacity: 1; transform: none; }
.di[data-state="reminder"] .di-dot-disc { transform: scale(1.47); }
.di[data-state="reminder"] .di-alert { opacity: 1; }
/* Não perturbe: olhos fechados (pílulas deitadas) e o ponto apagado. */
.di[data-state="sleeping"] .di-eyes--pill { opacity: 0; transform: scaleY(.25); }
.di[data-state="sleeping"] .di-eyes--closed { opacity: 1; transform: none; }
.di[data-state="sleeping"] .di-dot { opacity: .6; }

/* Negativo (sobre violeta): Di branco, olhos violeta. */
.di.di--negative .di-body { fill: var(--n-di-eye); }
.di.di--negative .di-eyes { fill: var(--n-brand); }
.di.di--negative .di-eyes--arc { stroke: var(--n-brand); }
.di.di--negative .di-mouth { fill: var(--n-brand); }
/* Abaixo de 32 px: só corpo e olhos (o ponto nem é desenhado) e olhos mais
   grossos, como o ícone pequeno do kit. */
.di.di--mini .di-eyes--pill { transform: scale(1.35, 1.2); }
.di.di--mini .di-rings, .di.di--mini .di-trail { display: none; }

@media (prefers-reduced-motion: reduce) {
  .di, .di * { transition: none !important; }
}

/* Logo: Di à esquerda + "ordi" minúsculo (Outfit 600, -0.03em). O vão é a
   metade da largura do corpo do Di em escala (76/200 do símbolo ≈ .38). */
.ordi-logo { display: inline-flex; align-items: center; gap: calc(var(--ordi-logo-size, 32px) * .18); color: var(--n-text); line-height: 1; }
.ordi-logo:has(.ordi-logo-word) { min-width: 80px; }
.ordi-logo .ordi-logo-word { font-family: "Outfit", system-ui, sans-serif; font-weight: 600; font-size: calc(var(--ordi-logo-size, 32px) * 1.1); letter-spacing: -0.03em; line-height: .8; }
.ordi-logo--negative { color: var(--n-di-eye); }

/* Marca neutra (sem rosto): áreas sem o Di. */
.ordi-mark { flex-shrink: 0; display: block; }
.ordi-mark .ordi-mark-disc { fill: var(--n-di-body); }
.ordi-mark .ordi-mark-dot { fill: var(--n-di-dot); }

/* ---------- Hoje ---------- */
.nova .top { display: flex; align-items: center; justify-content: space-between; }
.nova .who { display: flex; align-items: center; gap: 12px; }
.nova .avatar { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--n-brand-a), var(--n-brand-b)); padding: 2px; box-sizing: border-box; }
.nova .avatar span { width: 100%; height: 100%; border-radius: 50%; background: var(--n-surface); display: flex; align-items: center; justify-content: center; font-family: "Outfit", sans-serif; font-weight: 600; font-size: 16px; color: var(--n-text); }
.nova .who-meta { display: flex; flex-direction: column; gap: 2px; }
.nova .who-meta small { font-size: 13px; color: var(--n-muted); }
.nova .bell { position: relative; }
.nova .bell .dot { position: absolute; top: 10px; right: 11px; width: 8px; height: 8px; border-radius: 50%; background: var(--n-red); box-shadow: 0 0 0 2px var(--n-surface); }

.nova .hello h1 { margin: 0; font-family: "Outfit", sans-serif; font-size: 36px; line-height: 1.06; font-weight: 600; letter-spacing: -0.025em; color: var(--n-text); }
.nova .hello p { margin: 10px 0 0; font-size: 15.5px; line-height: 1.5; color: var(--n-muted); }
.nova .hello .hello-jump { display: inline-flex; align-items: center; min-height: 48px; font-weight: 700; color: var(--n-cyan-deep); text-decoration: underline; text-underline-offset: 3px; }
.nova #today-day, .nova #today-needs { scroll-margin-top: calc(var(--ordi-native-top-inset, 0px) + 72px); }

.nova .signal { padding: 20px; display: flex; flex-direction: column; gap: 16px; background: linear-gradient(160deg, rgb(var(--n-cyan-rgb) / .10), rgb(var(--n-surface-rgb) / .85) 45%); border-color: var(--n-border-signal); }
.nova .signal-head { display: flex; gap: 14px; align-items: center; }
.nova .signal-head .stack { display: flex; flex-direction: column; gap: 4px; }
.nova .signal-head small { font-size: 13px; color: var(--n-muted); }
.nova .signal p { margin: 0; font-family: "Outfit", sans-serif; font-size: 19px; line-height: 1.38; font-weight: 500; letter-spacing: -0.01em; text-wrap: pretty; color: var(--n-text); }
.nova .chips { display: flex; gap: 8px; flex-wrap: wrap; }
.nova .actions { display: flex; gap: 10px; }
.nova .actions form { display: contents; }
.nova .grow { flex-grow: 1; }

.nova .qa-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
/* Fonte grande (2º teste geral, 08/10/2026): a coluna mínima é medida em ch,
   a unidade que cresce com a fonte do aparelho (o text zoom do WebView não
   mexe em px nem em em fora do font-size). A 200% os cinco atalhos quebram
   em duas linhas em vez de sobrepor "Anotar", "Lembrar" e "Gasto". */
.nova .qa-grid--5 { font-size: 12.5px; grid-template-columns: repeat(auto-fit, minmax(6ch, 1fr)); gap: 8px; }
.nova .qa { display: flex; flex-direction: column; align-items: center; gap: 8px; background: none; border: none; color: var(--n-soft) !important; font-size: 12.5px; font-weight: 600; cursor: pointer; padding: 0; }
.nova .qa .t { width: 100%; height: 60px; border-radius: 18px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-surface-rgb) / .8); border: 1px solid var(--n-border-soft); box-shadow: var(--n-shadow-card); color: var(--n-body); }

.nova .section { display: flex; flex-direction: column; gap: 12px; }
.nova .section-head { display: flex; justify-content: space-between; align-items: center; }
.nova .section-head a { font-size: 13px; font-weight: 600; }
.nova .day { padding: 6px 18px; }
.nova .day-row { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--n-line); }
.nova .day-row:first-child { border-top: none; }
.nova .day-row.now { border-top: none; margin: 0 -12px; padding: 14px 12px; border-radius: 16px; background: rgb(var(--n-cyan-rgb) / .08); }
.nova .day-row.now + .day-row { border-top: none; }
.nova .day-row .time { font-family: "JetBrains Mono", monospace; font-size: 13px; color: var(--n-label); width: 46px; padding-top: 2px; flex-shrink: 0; }
.nova .day-row.now .time { color: var(--n-cyan); }
.nova .day-row.late .time { color: var(--n-rose-soft); }
.nova .day-row .body { flex-grow: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.nova .day-row .body strong { font-weight: 700; font-size: 15px; color: var(--n-text); }
.nova .day-row .body small { font-size: 13px; color: var(--n-muted); }
.nova a.day-row { color: inherit; text-decoration: none; }
.nova a.day-row:hover .body strong, .nova a.day-row:focus-visible .body strong { color: var(--n-cyan); }
.nova .focus-pill { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 16px; border: 1px solid rgb(var(--n-cyan-rgb) / .4); background: rgb(var(--n-cyan-rgb) / .08); color: var(--n-text); text-decoration: none; min-width: 0; }
.nova .focus-pill .body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex-grow: 1; }
.nova .focus-pill strong { font-size: 14.5px; font-weight: 700; overflow-wrap: anywhere; }
.nova .focus-pill small { font-size: 12.5px; color: var(--n-muted); overflow-wrap: anywhere; }
.nova .focus-pill svg.i { color: var(--n-cyan); flex-shrink: 0; }
.nova .focus-pill.over { border-color: rgb(var(--n-amber-rgb) / .45); background: rgb(var(--n-amber-rgb) / .08); }
.nova .focus-pill.over svg.i { color: var(--n-amber); }
.nova .day-row.done .body strong { color: var(--n-muted); text-decoration: line-through; }
.nova .badge { font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: .1em; color: var(--n-on-cyan); background: var(--n-cyan); padding: 2px 7px; border-radius: 6px; }
.nova .badge.late { background: var(--n-rose-soft); color: var(--n-on-rose); }
.nova .title-line { display: flex; align-items: center; gap: 8px; }

.nova .pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nova .spot { display: flex; flex-direction: column; gap: 10px; color: var(--n-text) !important; padding: 16px; }
.nova .spot small { font-size: 13px; color: var(--n-muted); }
.nova .spot .value { font-family: "Outfit", sans-serif; font-size: 18px; font-weight: 600; }
.nova .spot .note { font-size: 12.5px; font-weight: 700; color: var(--n-amber); }

.nova .n-rings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.nova .n-ring { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.nova .n-ring .n-dial { position: relative; width: 64px; height: 64px; }
.nova .n-ring .n-dial > svg { width: 64px; height: 64px; transform: rotate(-90deg); }
.nova .n-ring .n-dial span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: "JetBrains Mono", monospace; font-size: 13px; font-weight: 600; color: var(--n-text); }
.nova .n-ring small { font-size: 13px; color: var(--n-soft); text-align: center; }
.nova .n-ring-cap { display: block; margin-top: 2px; font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--n-muted); }
/* Marca discreta do registro que veio do Saúde (Hoje e Vida; só o dono vê). */
.nova .via-saude { display: inline-flex; align-items: center; gap: 4px; margin-top: 2px; font-size: 11.5px; font-weight: 600; color: var(--n-rose-soft); }
.nova .n-ring .via-saude { display: block; font-size: 10.5px; }

.nova .goal { display: flex; flex-direction: column; gap: 12px; color: var(--n-text) !important; }
.nova .goal-head { display: flex; justify-content: space-between; align-items: baseline; }
.nova .goal-head strong { font-weight: 700; font-size: 15px; }
.nova .goal-head span { font-family: "JetBrains Mono", monospace; font-size: 13px; color: var(--n-green); }
.nova .bar { height: 6px; border-radius: 99px; background: var(--n-track); overflow: hidden; }
.nova .bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--n-green-deep), var(--n-green)); }
.nova .goal small { font-size: 13px; color: var(--n-muted); }

.nova .try { display: flex; flex-direction: column; gap: 12px; }
.nova .try .chip { height: 36px; padding: 0 14px; font-size: 13px; font-weight: 600; }

/* ---------- Voz ---------- */
/* Fonte 150%/200% (E2E 08/10/2026, B2): a prancha tem a altura da tela e só a
   resposta rola. Antes, a resposta encolhia até o min-height e transbordava por
   cima do microfone, que deixava de receber o toque. Topo, cartão e controles
   não encolhem; o orbe cede espaço quando há resposta; os controles ficam
   presos ao fundo mesmo se a prancha precisar rolar. */
.pwa-immersive-nova { position: fixed; inset: 0; z-index: 60; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.nova .voz-text p:not(:empty) + .hint { display: none; }
.nova .voz-text p[data-role="assistant"] { font-size: 18px; line-height: 1.45; }
.nova .pwa-immersive__word { opacity: .45; transition: opacity .2s ease; }
.nova .pwa-immersive__word--spoken, .nova .pwa-immersive__word--active { opacity: 1; }
.nova .pwa-immersive__word--active { color: var(--n-cyan); }
.nova.voz { background: radial-gradient(520px 520px at 50% 300px, var(--n-voz-core) 0%, var(--n-bg) 70%); min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.nova.voz > * { flex-shrink: 0; }
.nova .voz-top { position: relative; padding: calc(var(--ordi-native-top-inset, 0px) + 20px) 20px 20px; display: flex; justify-content: space-between; align-items: center; }
.nova .pill { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 999px; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border); }
.nova .pill .led { width: 8px; height: 8px; border-radius: 50%; background: var(--n-label); }
.nova .pill[data-state="listening"] .led { background: var(--n-cyan); box-shadow: 0 0 10px rgb(var(--n-cyan-hi-rgb) / .8); }
.nova .pill[data-state="listening"] .lbl { color: var(--n-cyan); }
.nova .pill[data-state="thinking"] .led { background: var(--n-violet); box-shadow: 0 0 10px rgb(var(--n-violet-rgb) / .8); }
.nova .pill[data-state="thinking"] .lbl { color: var(--n-violet-soft); }
.nova .pill[data-state="speaking"] .led { background: var(--n-amber); box-shadow: 0 0 10px rgb(var(--n-amber-rgb) / .8); }
.nova .pill[data-state="speaking"] .lbl { color: var(--n-amber-soft); }
.nova .voz-orb { position: relative; display: flex; justify-content: center; margin-top: 4px; }
.nova .voz-orb .stage { width: min(330px, 84vw, 40dvh); height: min(330px, 84vw, 40dvh); cursor: pointer; background: none; border: none; padding: 0; transition: width .25s ease, height .25s ease; }
.nova.voz:has(.voz-text p:not(:empty):not(.hint)) .voz-orb .stage { width: min(330px, 84vw, 22dvh); height: min(330px, 84vw, 22dvh); }
.nova .voz-orb .di { width: 100%; height: 100%; display: block; }
.nova .voz-text { position: relative; padding: 4px 28px 0; display: flex; flex-direction: column; gap: 10px; text-align: center; flex: 1 1 0; min-height: 4.5em; overflow-y: auto; overscroll-behavior: contain; }
.nova .voz-text p { flex-shrink: 0; }
/* Esmaece a última linha para mostrar que a resposta continua rolando (a máscara só usa o alfa). */
.nova .voz-text:has(p[data-role="assistant"]) { padding-bottom: 28px; -webkit-mask-image: linear-gradient(to bottom, var(--n-bg) calc(100% - 28px), transparent); mask-image: linear-gradient(to bottom, var(--n-bg) calc(100% - 28px), transparent); }
.nova .voz-text p { margin: 0; font-family: "Outfit", sans-serif; font-size: 22px; line-height: 1.4; font-weight: 500; letter-spacing: -0.01em; color: var(--n-strong); text-wrap: balance; }
.nova .voz-text p.hint { font-family: "Lexend", sans-serif; font-size: 15px; font-weight: 500; color: var(--n-muted); }
.nova .voz-card { margin: 18px 16px 0; display: flex; flex-direction: column; gap: 12px; padding: 16px; max-height: 34dvh; overflow-y: auto; }
.nova .voz-card[hidden] { display: none; }
.nova .voz-card .reply { font-size: 15px; line-height: 1.5; color: var(--n-body); }
.nova .task { display: flex; gap: 12px; align-items: center; }
.nova .task .ic { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nova .task .stack { display: flex; flex-direction: column; gap: 2px; flex-grow: 1; min-width: 0; }
.nova .task strong { font-weight: 700; font-size: 14.5px; }
.nova .task small { font-size: 12.5px; color: var(--n-muted); }
.nova .voz-controls { margin-top: auto; padding: 16px 0 32px; display: flex; justify-content: center; align-items: center; gap: 28px; position: sticky; bottom: 0; z-index: 1; background: linear-gradient(to bottom, rgb(var(--n-bg-rgb) / 0), var(--n-bg) 30%); }
.nova .round { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border); color: var(--n-soft); cursor: pointer; padding: 0; }
.nova .round[aria-pressed="true"] { background: rgb(var(--n-cyan-hi-rgb) / .12); border-color: rgb(var(--n-cyan-hi-rgb) / .4); color: var(--n-cyan); }
.nova .confirm { width: 76px; height: 76px; border-radius: 50%; border: none; background: var(--n-inverse); color: var(--n-on-inverse); display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 0 0 8px rgb(var(--n-inverse-rgb) / .08), 0 12px 30px rgb(var(--n-cyan-rgb) / calc(.35 * var(--n-glow-k))); }
.nova .confirm svg.i { width: 28px; height: 28px; stroke-width: 2.2; }
.nova .confirm:disabled { opacity: .45; box-shadow: none; }

@media (prefers-reduced-motion: reduce) {
  .nova * { animation: none !important; transition: none !important; }
}

/* ---------- Agenda ---------- */
.nova .a-head { display: flex; justify-content: space-between; align-items: flex-end; }
.nova .a-head .stack { display: flex; flex-direction: column; gap: 6px; }
.nova .a-head h1 { margin: 0; font-family: "Outfit", sans-serif; font-size: 32px; font-weight: 600; letter-spacing: -0.025em; color: var(--n-text); }
.nova .a-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.nova .a-wd { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; height: 66px; border-radius: 18px; border: 1px solid transparent; color: var(--n-muted) !important; font-size: 13px; }
.nova .a-wd b { font-family: "Outfit", sans-serif; font-size: 17px; font-weight: 600; color: var(--n-body); }
.nova .a-wd.on { background: var(--n-inverse); color: var(--n-inverse-soft) !important; }
.nova .a-wd.on b { color: var(--n-on-inverse); }
.nova .a-wd.today:not(.on) { border-color: var(--n-border); }
.nova .a-slot { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-top: 1px solid var(--n-divider); align-items: start; }
.nova .a-slot:first-child { border-top: none; }
.nova .a-hr { font-family: "Outfit", sans-serif; font-weight: 300; font-size: 26px; letter-spacing: -.02em; color: var(--n-soft); line-height: 1; }
.nova .a-slot.muted .a-hr { color: var(--n-faint); }
.nova .a-ev { border-radius: 18px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; color: var(--n-text) !important; background: var(--n-event); border: 1px solid var(--n-event-border); }
.nova .a-ev strong { font-weight: 700; font-size: 15px; }
.nova .a-ev small { font-size: 12.5px; color: var(--n-muted); }
.nova .a-ev.cyan { background: rgb(var(--n-cyan-rgb) / .12); border-color: rgb(var(--n-cyan-rgb) / .35); }
.nova .a-ev.cyan small { color: var(--n-cyan-soft); }
.nova .a-ev.amber { background: rgb(var(--n-amber-rgb) / .10); border-color: rgb(var(--n-amber-rgb) / .28); }
.nova .a-ev.amber small { color: var(--n-amber-soft); }
.nova .a-ev.violet { background: rgb(var(--n-violet-rgb) / .10); border-color: rgb(var(--n-violet-rgb) / .3); }
.nova .a-ev.violet small { color: var(--n-violet-soft); }
.nova .a-slot.muted .a-ev:not(.suggest) { opacity: .55; }
.nova .a-ev.suggest { background: none; border: 1px dashed var(--n-border-dash); gap: 10px; }
.nova .a-ev.suggest .line { display: flex; align-items: center; gap: 10px; }
.nova .a-ev.suggest span { font-size: 14px; line-height: 1.4; color: var(--n-body); }
.nova .a-ev.suggest .actions .btn { height: 38px; padding: 0 14px; font-size: 13px; }
.nova .a-empty { padding: 18px; color: var(--n-muted); font-size: 14.5px; }
.nova .a-rems { padding: 6px 18px 4px; }
.nova .a-rems .section-head { padding: 12px 0 10px; }
.nova .a-rems .section-head span.count { font-size: 13px; color: var(--n-muted); }
.nova .a-rem { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--n-divider); }
.nova .a-rem .ic { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nova .a-rem .ic.green { background: rgb(var(--n-green-rgb) / .12); color: var(--n-green); }
.nova .a-rem .ic.cyan { background: rgb(var(--n-cyan-rgb) / .12); color: var(--n-cyan); }
.nova .a-rem .ic.neutral { background: rgb(var(--n-slate-rgb) / .1); color: var(--n-soft); }
.nova .a-rem .stack { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.nova .a-rem strong { font-weight: 700; font-size: 14.5px; }
.nova .a-rem small { font-size: 12.5px; color: var(--n-muted); }
.nova .glow.agenda { background: radial-gradient(420px 300px at 90% -60px, rgb(var(--n-cyan-rgb) / calc(.16 * var(--n-glow-k))), transparent 70%); }

/* ---------- Vida (Hábitos · Saúde) ---------- */
.nova .glow.vida { background: radial-gradient(440px 320px at 100% -40px, rgb(var(--n-purple-rgb) / calc(.20 * var(--n-glow-k))), transparent 70%); }
.nova .seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 16px; background: var(--n-sunken); border: 1px solid var(--n-border-soft); }
.nova .seg a { height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; color: var(--n-muted); }
.nova .seg a.on { background: var(--n-selected); color: var(--n-strong); }
.nova .v-const { display: flex; flex-direction: column; gap: 18px; }
.nova .v-const-head { display: flex; justify-content: space-between; align-items: flex-end; }
.nova .v-const-head .stack { display: flex; flex-direction: column; gap: 6px; }
.nova .v-big { font-family: "Outfit", sans-serif; font-size: 44px; font-weight: 300; letter-spacing: -0.03em; line-height: 1; color: var(--n-text); }
.nova .v-big small { font-size: 22px; color: var(--n-muted); }
.nova .v-delta { font-size: 13px; color: var(--n-green); font-weight: 700; }
.nova .v-delta.down { color: var(--n-amber); }
.nova .v-bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; align-items: end; height: 110px; }
.nova .v-wk { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.nova .v-wk i { display: block; width: 100%; border-radius: 10px; }
.nova .v-wk span { font-size: 11.5px; color: var(--n-label); font-weight: 600; }
.nova .v-wk.today i { background: linear-gradient(180deg, var(--n-violet), var(--n-violet-dim)); box-shadow: 0 0 18px rgb(var(--n-violet-rgb) / .45); }
.nova .v-wk.today span { color: var(--n-strong); }
.nova .v-suggest { display: flex; flex-direction: column; gap: 14px; border-color: var(--n-border-violet); background: linear-gradient(165deg, rgb(var(--n-purple-rgb) / .12), rgb(var(--n-surface-rgb) / .88) 55%); }
.nova .v-suggest p { margin: 0; font-size: 15.5px; line-height: 1.5; color: var(--n-text); }
.nova .v-hb { display: flex; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 20px; background: var(--n-card); border: 1px solid var(--n-border-soft); box-shadow: var(--n-shadow-card); }
.nova .v-hb form { display: contents; }
.nova .v-ck { width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; background: transparent; border: 2px solid var(--n-control); color: var(--n-soft); }
.nova .v-ck.plus { border-color: var(--n-cyan-deep); color: var(--n-cyan); }
.nova .v-ck.done { background: var(--n-green); border-color: var(--n-green); color: var(--n-on-green); cursor: default; }
.nova .v-hb .stack { display: flex; flex-direction: column; gap: 6px; flex-grow: 1; min-width: 0; }
.nova .v-hb strong { font-weight: 700; font-size: 15px; color: var(--n-text); }
.nova .v-count { display: flex; justify-content: space-between; }
.nova .v-count span { font-family: "JetBrains Mono", monospace; font-size: 13px; color: var(--n-cyan); }
.nova .v-segs { display: grid; gap: 4px; }
.nova .v-segs i { height: 5px; border-radius: 3px; background: var(--n-track); }
.nova .v-segs i.on { background: var(--n-cyan-deep); }
.nova .v-meta { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--n-muted); }
.nova .v-next { display: flex; flex-direction: column; gap: 16px; padding: 22px; border-color: var(--n-border-amber); background: linear-gradient(165deg, rgb(var(--n-amber-rgb) / .12), rgb(var(--n-surface-rgb) / .9) 55%); }
.nova .v-next .v-time { font-family: "Outfit", sans-serif; font-size: 60px; font-weight: 300; letter-spacing: -0.04em; line-height: .9; color: var(--n-text); }
.nova .v-next .stack { display: flex; flex-direction: column; gap: 4px; }
.nova .v-next strong { font-weight: 700; font-size: 17px; }
.nova .v-next small { font-size: 13.5px; color: var(--n-soft); }
.nova .v-doses { padding: 6px 18px 4px; }
.nova .v-dose { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--n-divider); }
.nova .v-dose .tm { font-family: "JetBrains Mono", monospace; font-size: 13px; color: var(--n-label); width: 46px; flex-shrink: 0; }
.nova .v-dose .stack { display: flex; flex-direction: column; gap: 2px; flex-grow: 1; min-width: 0; }
.nova .v-dose strong { font-weight: 700; font-size: 14.5px; }
.nova .v-dose small { font-size: 12.5px; color: var(--n-muted); }
.nova .v-dose-end { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.nova .v-dose-end form { margin: 0; }
.nova .v-undo { min-height: 48px; padding: 0 14px; font-size: 13px; }
.nova .v-state { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--n-control); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.nova .v-state.due { border-color: var(--n-amber); }
.nova .v-state.done { border: none; background: var(--n-green); color: var(--n-on-green); }
.nova .v-stock { display: flex; gap: 14px; align-items: center; padding: 16px; }
.nova .v-stock .ic { width: 44px; height: 44px; border-radius: 14px; background: rgb(var(--n-amber-rgb) / .12); color: var(--n-amber); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nova .v-stock .stack { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.nova .v-stock strong { font-weight: 700; font-size: 14.5px; }
.nova .v-stock small { font-size: 12.5px; color: var(--n-muted); }
.nova .v-stock .btn { height: 40px; padding: 0 14px; font-size: 13px; }
.nova .v-check { display: flex; flex-direction: column; gap: 16px; }
.nova .v-check .stack { display: flex; flex-direction: column; gap: 8px; }
.nova .v-scale-label { font-size: 14px; font-weight: 600; color: var(--n-text); }
.nova .v-scale { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.nova .v-scale-form { display: contents; }
.nova .v-scale button { height: 44px; width: 100%; border-radius: 12px; background: rgb(var(--n-slate-rgb) / .06); border: 1px solid var(--n-border); color: var(--n-soft); font-family: "JetBrains Mono", monospace; font-weight: 600; font-size: 14px; cursor: pointer; }
.nova .v-scale button.on { background: var(--n-inverse); border-color: var(--n-inverse); color: var(--n-on-inverse); }

/* ---------- Vida · Hábitos: linha tocável, folha, deslize, formulário ---------- */
.nova .v-hb .v-log { display: contents; }
.nova .v-ck.done { cursor: pointer; }
.nova .v-ck.avoid { border-color: rgb(var(--n-violet-rgb) / .55); color: var(--n-violet); }
.nova .v-ck.avoid.slipped { border-color: rgb(var(--n-amber-rgb) / .6); color: var(--n-amber); }
.nova .v-open { display: flex; flex-direction: column; gap: 6px; flex-grow: 1; min-width: 0; padding: 0; margin: 0; background: none; border: none; text-align: left; color: inherit; font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.nova .v-open:focus-visible, .nova .v-ck:focus-visible, .nova .v-slip:focus-visible { outline: 2px solid var(--n-cyan); outline-offset: 3px; border-radius: 12px; }
.nova .v-open strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Dentro de <button> a WebView do Android não estica os filhos da coluna
   flex: sem isto o contador colava no nome e a barra de progresso sumia. */
.nova .v-open { align-items: stretch; }
.nova .v-open > * { width: 100%; box-sizing: border-box; }
.nova .v-meta em { font-style: normal; font-weight: 600; }
.nova .v-meta.inline { display: block; line-height: 1.4; }
.nova .v-meta em.ok { color: var(--n-violet-soft); }
.nova .v-meta em.warn { color: var(--n-amber-soft); }
.nova .v-slip { flex-shrink: 0; height: 36px; padding: 0 12px; border-radius: 12px; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border-strong); color: var(--n-body); font-size: 12.5px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.nova .v-hb.paused { opacity: .85; }
.nova a.v-hb.v-link { color: var(--n-text); text-decoration: none; }
.nova a.v-hb.v-link .v-ck { cursor: pointer; }
.nova a.v-hb.v-link:hover strong { color: var(--n-cyan); }
.nova .v-hb.paused .v-ck { border-style: dashed; color: var(--n-muted); cursor: default; }
.nova .v-mini { height: 36px; padding: 0 12px; font-size: 13px; border-radius: 12px; }
.nova .v-hb form.button_to { display: contents; }
.nova .v-challenge h2 { margin: 0; font-family: "Outfit", sans-serif; font-size: 20px; line-height: 1.3; font-weight: 600; letter-spacing: -0.01em; color: var(--n-text); text-wrap: balance; }
.nova .v-challenge p { color: var(--n-soft); font-size: 14.5px; }
.nova .btn-danger { background: rgb(var(--n-rose-rgb) / .14); color: var(--n-rose-softer); border: 1px solid rgb(var(--n-rose-rgb) / .45); }

.nova dialog.v-sheet { position: fixed; inset: auto 0 0 0; margin: 0 auto; width: 100%; max-width: 520px; max-height: 88vh; padding: 0; border: 1px solid var(--n-border); border-bottom: none; border-radius: 26px 26px 0 0; background: var(--n-sheet); color: var(--n-text); box-shadow: var(--n-shadow-sheet); overflow-y: auto; overscroll-behavior: contain; box-sizing: border-box; }
.nova dialog.v-sheet::backdrop { background: var(--n-overlay); }
.nova dialog.v-sheet[open] { animation: v-sheet-up .22s ease-out; }
@keyframes v-sheet-up { from { transform: translateY(24px); opacity: .4; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .nova dialog.v-sheet[open] { animation: none; } }
.nova .v-sheet-body { display: flex; flex-direction: column; gap: 18px; padding: 10px 20px calc(var(--ordi-native-bottom-inset, env(safe-area-inset-bottom, 0px)) + 22px); }
.nova .v-grab { align-self: center; width: 40px; height: 4px; border-radius: 9px; background: var(--n-border-strong); }
.nova .v-sheet-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.nova .v-sheet-head .stack { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.nova .v-sheet-head h2 { margin: 0; font-family: "Outfit", sans-serif; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; color: var(--n-text); overflow-wrap: anywhere; }
.nova .v-sheet-head small { font-size: 13.5px; color: var(--n-muted); }
.nova .v-sheet-note { margin: 0; font-size: 14px; line-height: 1.5; color: var(--n-soft); }
.nova .v-hist { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 22px; background: rgb(var(--n-surface-rgb) / .8); border: 1px solid var(--n-border-soft); }
.nova .v-dots { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 5px; }
.nova .v-dots li, .nova .v-legend i { display: block; aspect-ratio: 1; border-radius: 50%; background: var(--n-track); border: 1.5px solid transparent; box-sizing: border-box; }
.nova .v-dots .done, .nova .v-legend .done { background: var(--n-violet); }
.nova .v-dots .slipped, .nova .v-legend .slipped { background: var(--n-amber); }
.nova .v-dots .protected, .nova .v-legend .protected { background: transparent; border-color: var(--n-violet); }
.nova .v-dots .pending, .nova .v-legend .pending { background: var(--n-dot-pending); }
.nova .v-dots .open { background: transparent; border: 1.5px dashed var(--n-faint); }
.nova .v-dots .off { background: var(--n-dot-off); }
.nova .v-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--n-muted); }
.nova .v-legend span { display: inline-flex; align-items: center; gap: 6px; }
.nova .v-legend i { width: 9px; height: 9px; }
.nova .v-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding-top: 4px; border-top: 1px solid var(--n-line); }
.nova .v-stats div { display: flex; flex-direction: column; gap: 4px; padding-top: 10px; }
.nova .v-stats .lbl { font-size: 10px; }
.nova .v-stats strong { font-family: "Outfit", sans-serif; font-size: 16px; font-weight: 600; color: var(--n-text); }
.nova .v-acts { display: flex; flex-direction: column; }
.nova .v-acts form.button_to { display: block; }
.nova .v-acts form[hidden] { display: none; }
.nova .v-act { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 54px; padding: 8px 0; background: none; border: none; border-top: 1px solid var(--n-line); color: var(--n-text) !important; font: inherit; font-size: 15px; font-weight: 700; text-align: left; cursor: pointer; box-sizing: border-box; }
.nova .v-acts > :first-child .v-act, .nova .v-acts > .v-act:first-child { border-top: none; }
.nova .v-act.static { cursor: default; }
.nova .v-act .ic { width: 36px; height: 36px; flex-shrink: 0; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-slate-rgb) / .1); color: var(--n-soft); }
.nova .v-act .t { flex-grow: 1; }
.nova .v-act .chip { font-family: "JetBrains Mono", monospace; font-weight: 600; color: var(--n-cyan); }
.nova .v-act.danger { color: var(--n-rose-soft) !important; }
.nova .v-act.danger .ic { background: rgb(var(--n-rose-rgb) / .1); color: var(--n-rose); }
.nova .v-pause { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 12px 50px; }
.nova .v-pause form.button_to { display: contents; }
.nova .v-pause .chip { height: 38px; padding: 0 14px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: inherit; }
.nova .v-confirm { display: flex; flex-direction: column; gap: 12px; padding: 14px; margin-top: 6px; border-radius: 18px; background: rgb(var(--n-rose-rgb) / .06); border: 1px solid rgb(var(--n-rose-rgb) / .3); }
.nova .v-confirm[hidden] { display: none; }
.nova .v-confirm p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--n-soft); }
.nova .v-field { display: flex; flex-direction: column; gap: 8px; }
.nova .v-field textarea, .nova .hf-input { width: 100%; box-sizing: border-box; border-radius: 16px; background: var(--n-surface); border: 1px solid var(--n-border); color: var(--n-text); font-family: inherit; font-size: 15px; padding: 12px 14px; outline: none; color-scheme: var(--n-scheme); resize: vertical; }
.nova .v-field textarea:focus, .nova .hf-input:focus { border-color: var(--n-focus); }

/* Formulário Nova de hábito (novo/editar). */
.nova .hf { display: flex; flex-direction: column; gap: 22px; }
.nova .hf-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nova .hf-top h1 { margin: 0; font-family: "Outfit", sans-serif; font-size: 26px; font-weight: 600; letter-spacing: -0.02em; color: var(--n-text); }
.nova .hf-q { display: flex; flex-direction: column; gap: 10px; border: none; margin: 0; padding: 0; min-width: 0; }
.nova .hf-q > legend, .nova .hf-q > .lbl { padding: 0; margin-bottom: 10px; }
.nova .hf-q legend + * { margin-top: 0; }
.nova .hf-hint { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--n-label); }
.nova .hf-err { margin: 0; font-size: 13px; font-weight: 600; color: var(--n-rose-soft); }
.nova .hf-name { height: 58px; font-family: "Outfit", sans-serif; font-size: 19px; font-weight: 500; border-radius: 18px; padding: 0 18px; border-color: var(--n-focus); }
.nova .hf-name[aria-invalid="true"] { border-color: var(--n-rose); }
.nova .hf-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 16px; background: var(--n-sunken); border: 1px solid var(--n-border-soft); }
.nova .hf-seg label { position: relative; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; color: var(--n-muted); cursor: pointer; }
.nova .hf-seg input, .nova .hf-chip input { position: absolute; opacity: 0; pointer-events: none; }
.nova .hf-seg label:has(input:checked) { background: var(--n-selected); color: var(--n-strong); }
.nova .hf-seg label:has(input:focus-visible), .nova .hf-chip:has(input:focus-visible) { outline: 2px solid var(--n-cyan); outline-offset: 2px; }
.nova .hf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nova .hf-chip { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 40px; padding: 0 14px; box-sizing: border-box; border-radius: 999px; font-size: 13.5px; font-weight: 700; cursor: pointer; background: rgb(var(--n-slate-rgb) / .08); border: 1px solid var(--n-border); color: var(--n-soft); font-family: inherit; }
.nova .hf-chip:has(input:checked), .nova .hf-chip[aria-pressed="true"] { background: rgb(var(--n-violet-rgb) / .14); border-color: rgb(var(--n-violet-rgb) / .55); color: var(--n-violet-softer); }
.nova .hf-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.nova .hf-days .hf-chip { min-width: 0; padding: 0; border-radius: 14px; height: 44px; font-size: 13px; }
.nova .hf-count { display: flex; align-items: center; gap: 14px; }
.nova .hf-count .icn { width: 48px; height: 48px; border-radius: 16px; }
.nova .hf-count output { min-width: 56px; text-align: center; font-family: "Outfit", sans-serif; font-size: 32px; font-weight: 300; color: var(--n-text); }
.nova .hf-count small { font-size: 13.5px; color: var(--n-muted); }
.nova .hf-times { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nova .hf-time { position: relative; display: inline-flex; align-items: center; gap: 4px; height: 44px; padding: 0 6px 0 14px; border-radius: 14px; background: var(--n-surface); border: 1px solid var(--n-border); }
.nova .hf-time .tv { position: relative; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 16px; font-weight: 600; color: var(--n-strong); }
.nova .hf-time .tv input { position: absolute; inset: -10px; width: calc(100% + 20px); height: calc(100% + 20px); opacity: 0; cursor: pointer; border: none; padding: 0; }
.nova .hf-time:focus-within { border-color: var(--n-cyan); }
.nova .hf-time .rm { width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: none; border: none; color: var(--n-muted); cursor: pointer; padding: 0; }
.nova .hf-time .rm svg.i { width: 16px; height: 16px; }
.nova .hf-add { height: 44px; }
.nova .hf-foot { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; }
.nova .hf-foot .btn { height: 52px; border-radius: 16px; font-size: 15px; width: 100%; }
/* Saúde no formulário do hábito (Apple Saúde/Health Connect, 16/10/2026). */
.nova .hf-health { display: flex; flex-direction: column; gap: 12px; scroll-margin-top: 24px; }
.nova .hf-health-head { display: flex; align-items: center; gap: 12px; }
.nova .hf-health-head .ic { width: 36px; height: 36px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgb(var(--n-rose-rgb) / .12); color: var(--n-rose-soft); }
.nova .hf-health-head .stack { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nova .hf-health-head h2 { margin: 0; font-family: "Outfit", sans-serif; font-size: 17px; font-weight: 600; color: var(--n-text); }
.nova .hf-health-form { display: flex; flex-direction: column; gap: 10px; }
.nova .hf-health-form select.hf-input { height: 48px; }
.nova .hf-health-threshold { display: flex; align-items: center; gap: 10px; color: var(--n-soft); font-weight: 600; }
.nova .hf-health-threshold .hf-input { width: 120px; height: 48px; }
.nova .hf-health-totals { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; color: var(--n-soft); }
.nova .hf-health-totals span { color: var(--n-label); font-size: 12.5px; }
.nova .hf-health-acts { display: contents; }
.nova .hf-status { display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.nova .hf-status .stack { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.nova .hf-status strong { font-size: 14.5px; }
.nova .hf-status small { font-size: 12.5px; color: var(--n-muted); }
.nova .hf-status .actions { flex-wrap: wrap; }
.nova .hf [hidden] { display: none !important; }

/* ---------- Hoje · primeiro dia (prancha "Onboarding · Primeiro dia") ---------- */
.nova .n-mail { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 18px; background: rgb(var(--n-amber-rgb) / .07); border: 1px solid rgb(var(--n-amber-rgb) / .28); }
.nova .n-mail .ic { width: 36px; height: 36px; flex-shrink: 0; border-radius: 11px; background: rgb(var(--n-amber-rgb) / .14); color: var(--n-amber); display: flex; align-items: center; justify-content: center; }
.nova .n-mail .stack { display: flex; flex-direction: column; gap: 2px; flex-grow: 1; min-width: 0; }
.nova .n-mail strong { font-size: 14px; }
.nova .n-mail small { font-size: 12.5px; color: var(--n-soft); overflow-wrap: anywhere; }
.nova .n-mail .resend { background: none; border: none; padding: 0; font-size: 13px; font-weight: 700; color: var(--n-amber-soft); cursor: pointer; }
.nova .n-setup { gap: 4px; }
.nova .n-setup-head { display: flex; align-items: center; gap: 14px; padding-bottom: 10px; }
.nova .n-setup-head .stack { display: flex; flex-direction: column; gap: 3px; }
.nova .n-setup-head small { font-size: 14px; color: var(--n-soft); }
.nova .n-setup-ring { position: relative; width: 52px; height: 52px; flex-shrink: 0; }
.nova .n-setup-ring svg { width: 52px; height: 52px; transform: rotate(-90deg); }
.nova .n-setup-ring span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: "JetBrains Mono", monospace; font-size: 12px; font-weight: 600; }
.nova .n-setup-step { display: flex; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid var(--n-line); }
.nova .n-setup-step .t { font-size: 14.5px; font-weight: 700; flex-grow: 1; }
.nova .n-setup-step.done .t { font-weight: 500; color: var(--n-muted); }
.nova .n-setup-step a { font-size: 13px; font-weight: 700; }
.nova .n-setup-step .ok { width: 24px; height: 24px; flex-shrink: 0; border-radius: 50%; background: rgb(var(--n-green-rgb) / .16); color: var(--n-green); display: flex; align-items: center; justify-content: center; }
.nova .n-setup-step .ok svg.i { stroke-width: 2.6; }
.nova .n-setup-step .todo { width: 24px; height: 24px; flex-shrink: 0; border-radius: 50%; border: 2px solid var(--n-border-strong); box-sizing: border-box; }

/* ---------- Agenda · dia inteiro, lembretes que tocaram, "+" (A-14/A-15) ---------- */
.nova .a-page { padding-bottom: calc(var(--ordi-native-bottom-inset, env(safe-area-inset-bottom, 0px)) + 24px); }
.nova .a-add { position: relative; }
.nova .a-add > summary { list-style: none; }
.nova .a-add > summary::-webkit-details-marker { display: none; }
.nova .a-add[open] > summary { background: var(--n-inverse); color: var(--n-on-inverse); border-color: var(--n-inverse); }
.nova .a-add-menu { position: absolute; right: 0; top: 52px; z-index: 20; width: 260px; display: flex; flex-direction: column; padding: 6px; border-radius: 20px; background: var(--n-sheet); border: 1px solid var(--n-border); box-shadow: var(--n-shadow-pop); }
.nova .a-add-menu a { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; color: var(--n-text); }
.nova .a-add-menu a:hover, .nova .a-add-menu a:focus-visible { background: rgb(var(--n-slate-rgb) / .08); }
.nova .a-add-menu .ic { width: 36px; height: 36px; flex-shrink: 0; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-cyan-rgb) / .12); color: var(--n-cyan); }
.nova .a-add-menu .stack { display: flex; flex-direction: column; gap: 2px; }
.nova .a-add-menu strong { font-size: 14.5px; }
.nova .a-add-menu small { font-size: 12.5px; color: var(--n-muted); }
.nova .a-wd { gap: 4px; }
.nova .a-wd .dot { width: 5px; height: 5px; border-radius: 50%; background: transparent; }
.nova .a-wd .dot.on { background: var(--n-cyan); }
.nova .a-wd.on .dot.on { background: var(--n-inverse-soft); }
.nova .a-allday { display: flex; flex-direction: column; gap: 8px; }
.nova .a-ev.a-ad { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; background: rgb(var(--n-violet-rgb) / .10); border-color: rgb(var(--n-violet-rgb) / .30); }
.nova .a-ev.a-ad small { color: var(--n-violet-soft); }
.nova .a-ev-wrap { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.nova .a-ev-wrap form { display: contents; }
.nova .a-slot.rang .a-ev { opacity: 1; background: rgb(var(--n-slate-rgb) / .06); border-color: var(--n-border-soft); color: var(--n-muted) !important; }
.nova .a-slot.rang .a-ev strong { color: var(--n-muted); }
.nova .a-ev.done strong { text-decoration: line-through; text-decoration-color: rgb(var(--n-slate-rgb) / .5); }
.nova .a-ev.done small { display: inline-flex; align-items: center; gap: 4px; color: var(--n-green); }
.nova .a-done-btn { align-self: flex-start; height: 36px; padding: 0 14px; font-size: 13px; }
.nova .a-rems .section-head a.count { font-size: 13px; color: var(--n-cyan); }
.nova a.a-rem { color: var(--n-text); }

/* ---------- Agenda · formulário de compromisso ---------- */
.nova .ef { padding-bottom: 0; }
.nova .ef-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nova .ef-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.nova .ef-field.grow { grid-column: 1 / -1; }
.nova .ef-field > span { font-size: 12.5px; font-weight: 600; color: var(--n-muted); }
.nova .ef-field .hf-input { height: 48px; }
.nova .ef-allday { align-self: flex-start; }
.nova .ef-allday-hint { display: none; }
.nova .ef:has(#event_all_day:checked) .ef-times, .nova .ef:has(#event_all_day:checked) .ef-lead .hf-chips { display: none; }
.nova .ef:has(#event_all_day:checked) .ef-allday-hint { display: block; }
.nova .ef-note { margin: 0; display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 700; color: var(--n-soft); }
.nova .ef-opt { text-transform: none; letter-spacing: 0; }
.nova .ef-errors { border-color: rgb(var(--n-rose-rgb) / .45); color: var(--n-rose-softer); font-size: 14px; }
.nova .ef-errors ul { margin: 6px 0 0; padding-left: 18px; }
/* Salvar fica sempre à vista, acima da barra de abas do app. */
.nova .ef-foot { position: sticky; bottom: calc(var(--ordi-native-bottom-inset, env(safe-area-inset-bottom, 0px)) + 8px); z-index: 5; padding: 12px 0 4px; background: linear-gradient(to bottom, rgb(var(--n-bg-rgb) / 0), var(--n-bg) 28%); }
.nova .ef-danger { padding-top: 8px; padding-bottom: calc(var(--ordi-native-bottom-inset, env(safe-area-inset-bottom, 0px)) + 24px); }
.nova .ef-danger details { flex-direction: column; align-items: stretch; gap: 10px; }
.nova .ef-danger summary { cursor: pointer; font-weight: 700; color: var(--n-rose-soft); }
.nova .ef-danger-acts { display: flex; flex-direction: column; gap: 10px; }
.nova .ef-danger-acts form { display: contents; }
.nova .ef-danger-acts .btn { width: 100%; height: 48px; }

/* ---------- Agenda · Lembretes (/reminders no app) ---------- */
.nova .r-page { padding-bottom: calc(var(--ordi-native-bottom-inset, env(safe-area-inset-bottom, 0px)) + 24px); }
.nova .r-hero { display: flex; flex-direction: column; gap: 10px; }
.nova .r-hero h2 { margin: 0; font-family: "Outfit", sans-serif; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; color: var(--n-text); }
.nova .r-hero p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--n-soft); }
.nova .r-hero p b { color: var(--n-text); }
.nova .r-hero .actions { flex-wrap: wrap; padding-top: 4px; }
.nova .r-vitals { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; }
.nova .r-vitals span { color: var(--n-muted) !important; }
.nova .r-vitals span.late b { color: var(--n-rose-soft); }
.nova .r-vitals span.warn b { color: var(--n-amber-soft); }
.nova .r-sheet { display: flex; flex-direction: column; gap: 14px; border-color: var(--n-focus); }
.nova .r-sheet h2 { margin: 0; font-family: "Outfit", sans-serif; font-size: 20px; font-weight: 600; color: var(--n-text); }
.nova .r-list { padding: 6px 18px 4px; }
.nova .r-list .section-head { padding: 12px 0 6px; }
.nova .r-row { display: flex; gap: 12px; align-items: center; padding: 14px 0; border-top: 1px solid var(--n-divider); }
.nova .r-list .section-head + .r-row { border-top: none; }
.nova .r-row .stack { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.nova .r-row strong { font-weight: 700; font-size: 15px; color: var(--n-text); overflow-wrap: anywhere; }
.nova .r-row small { font-size: 12.5px; line-height: 1.45; color: var(--n-muted); }
.nova .r-row .ic { width: 38px; height: 38px; flex-shrink: 0; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-green-rgb) / .12); color: var(--n-green); }
.nova .r-row form { display: contents; }
.nova .r-when { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 600; color: var(--n-cyan); }
.nova .r-row.late .r-when { color: var(--n-rose-soft); }
.nova .r-row .tag { display: inline-block; margin-right: 6px; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: rgb(var(--n-slate-rgb) / .1); color: var(--n-soft); }
.nova .r-row .tag.late { background: rgb(var(--n-rose-rgb) / .14); color: var(--n-rose-softer); }
.nova .r-row .tag.warn { background: rgb(var(--n-amber-rgb) / .12); color: var(--n-amber-soft); }
.nova .r-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 8px; }
.nova .r-mini { height: 36px; padding: 0 14px; font-size: 13px; flex-shrink: 0; }
.nova .r-link { background: none; border: none; padding: 0 4px; height: 36px; font-size: 13px; font-weight: 700; color: var(--n-muted) !important; cursor: pointer; font-family: inherit; }
.nova .r-receipt .ic { background: rgb(var(--n-slate-rgb) / .1); color: var(--n-muted); }
.nova .r-receipt.done .ic { background: rgb(var(--n-green-rgb) / .12); color: var(--n-green); }
.nova .r-foot { margin: 0; text-align: center; font-size: 13px; color: var(--n-label); }
.nova .a-banner { display: flex; gap: 12px; align-items: center; padding: 14px 16px; background: rgb(var(--n-amber-rgb) / .07); border-color: rgb(var(--n-amber-rgb) / .32); color: var(--n-text) !important; }
.nova .a-banner .ic { width: 36px; height: 36px; flex-shrink: 0; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: rgb(var(--n-amber-rgb) / .14); color: var(--n-amber); }
.nova .a-banner .stack { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nova .a-banner strong { font-size: 14.5px; }
.nova .a-banner small { font-size: 12.5px; line-height: 1.45; color: var(--n-soft); }
.nova .ef .hf-top h1 { font-size: 22px; text-align: center; }
/* overflow-x: hidden do .nova vira contêiner de rolagem e desliga o sticky do Salvar; clip não. */
#event-nova-form.nova { overflow-x: clip; }

/* ==========================================================================
 * Casca web da Nova (pranchas WebSidebar e WebHoje) — layouts/application +
 * app/views/nova_web/*. A raiz é `.nova.nova-web`: herda tokens e .btn/.icn/
 * .lbl/.card da .nova. Só existe no navegador (no app a casca é nativa).
 *
 * Para as frentes de módulo (versão larga, `content_for :nova_web_wide`):
 *   .nw-page    área da página larga (padding da prancha: 20px 40px 32px)
 *   .nw-grid    duas colunas: conteúdo + coluna lateral de 360px
 *   .nw-grid--320  idem com coluna lateral de 320px (Agenda)
 *   .nw-stack   coluna com gap de 22px
 *   .nw-aside   coluna lateral (gruda no topo ao rolar)
 *   .card, .lbl, .disp, .chip, .btn, .icn — os mesmos da .nova
 * Abaixo de 1024px as grades viram uma coluna só.
 * ========================================================================== */
body.nova-web-body { background: var(--n-bg); }
.nova.nova-web {
  --nw-side: 248px;
  --nw-tabs-h: 104px;
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: clip;
  background:
    radial-gradient(700px 420px at 85% -120px, rgb(var(--n-cyan-rgb) / calc(.12 * var(--n-glow-k))), transparent 70%),
    radial-gradient(560px 380px at calc(var(--nw-side) + 10%) 20px, rgb(var(--n-purple-rgb) / calc(.10 * var(--n-glow-k))), transparent 70%),
    var(--n-bg);
  background-attachment: fixed;
}

/* ---------- Barra lateral (≥1024px) ---------- */
.nova-web .nw-side {
  display: none;
  position: sticky; top: 0; align-self: flex-start;
  width: var(--nw-side); height: 100vh; height: 100dvh; flex-shrink: 0;
  box-sizing: border-box; padding: 24px 16px; overflow-y: auto;
  background: var(--n-side); border-right: 1px solid var(--n-divider);
  flex-direction: column; gap: 28px;
}
.nova-web .nw-brand { display: flex; align-items: center; gap: 12px; padding: 0 8px; color: var(--n-strong); }
.nova-web .nw-brand span:last-child { font-family: "Outfit", sans-serif; font-size: 22px; font-weight: 600; letter-spacing: -0.03em; }
.nova-web .nw-nav { display: flex; flex-direction: column; gap: 4px; }
.nova-web .nw-more { padding: 0 12px 8px; }
.nova-web .nw-item { display: flex; align-items: center; gap: 12px; height: 44px; padding: 0 12px; border-radius: 14px; font-size: 14.5px; font-weight: 600; color: var(--n-muted); }
.nova-web .nw-item:hover { color: var(--n-strong); background: rgb(var(--n-slate-rgb) / .06); }
.nova-web .nw-item.on { background: var(--n-raised); color: var(--n-strong); box-shadow: inset 0 0 0 1px var(--n-raised-ring); }
.nova-web .nw-foot { margin-top: auto; display: flex; flex-direction: column; gap: 12px; }
.nova-web .nw-channels { padding: 14px; border-radius: 18px; background: rgb(var(--n-surface-rgb) / .8); border: 1px solid var(--n-border-soft); display: flex; flex-direction: column; gap: 10px; }
.nova-web .nw-channel { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--n-soft); }
.nova-web .nw-channel .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--n-green); }
.nova-web .nw-profile { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 14px; color: var(--n-text); }
.nova-web .nw-profile:hover { background: rgb(var(--n-slate-rgb) / .06); }
.nova-web .nw-avatar { width: 36px; height: 36px; border-radius: 50%; padding: 2px; box-sizing: border-box; background: linear-gradient(135deg, var(--n-brand-a), var(--n-brand-b)); flex-shrink: 0; }
.nova-web .nw-avatar span { width: 100%; height: 100%; border-radius: 50%; background: var(--n-surface); display: flex; align-items: center; justify-content: center; font-family: "Outfit", sans-serif; font-weight: 600; font-size: 14px; }
.nova-web .nw-profile-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nova-web .nw-profile-meta strong { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nova-web .nw-profile-meta small { font-size: 12px; color: var(--n-label); }

/* ---------- Barra lateral recolhida (72px, só ícones) ----------
 * html.nw-side-collapsed (script do <head> + nova_web_side_controller.js).
 * --nw-side muda junto, então folhas, toasts e barras fixas que se alinham
 * à barra acompanham sozinhos. Cada ícone mostra o nome num tooltip (.nw-tip)
 * no hover e no foco do teclado. Abaixo de 1024px nada muda (abas). */
.nova-web .nw-collapse { width: 100%; border: none; background: none; font-family: inherit; text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; }
.nova-web .nw-collapse:focus-visible, .nova-web .nw-item:focus-visible, .nova-web .nw-profile:focus-visible { outline: 2px solid var(--n-cyan); outline-offset: 2px; }
.nova-web .nw-collapse .i { transition: transform .18s ease; }
.nova-web .nw-tip--profile { display: none; }
@media (prefers-reduced-motion: reduce) {
  .nova-web .nw-collapse .i, .nova-web .nw-tip { transition: none; }
}
@media (min-width: 1024px) {
  html.nw-side-collapsed .nova.nova-web { --nw-side: 72px; }
  /* overflow visível: o tooltip sai para a direita, por cima da área principal. */
  html.nw-side-collapsed .nova-web .nw-side { padding: 24px 13px; gap: 20px; align-items: center; overflow: visible; z-index: 40; }
  html.nw-side-collapsed .nova-web .nw-side-text,
  html.nw-side-collapsed .nova-web .nw-channels,
  html.nw-side-collapsed .nova-web .nw-profile-meta { display: none; }
  html.nw-side-collapsed .nova-web .nw-brand { padding: 0; }
  html.nw-side-collapsed .nova-web .nw-nav { align-items: center; }
  html.nw-side-collapsed .nova-web .nw-nav + .nw-nav { padding-top: 16px; border-top: 1px solid var(--n-divider); }
  html.nw-side-collapsed .nova-web .nw-foot { align-items: center; }
  html.nw-side-collapsed .nova-web .nw-item { position: relative; width: 44px; padding: 0; justify-content: center; }
  html.nw-side-collapsed .nova-web .nw-collapse .i { transform: scaleX(-1); }
  html.nw-side-collapsed .nova-web .nw-profile { position: relative; padding: 4px; }
  html.nw-side-collapsed .nova-web .nw-tip {
    position: absolute; left: calc(100% + 14px); top: 50%; transform: translate(-4px, -50%);
    display: block; padding: 7px 11px; border-radius: 10px; white-space: nowrap;
    background: var(--n-raised); border: 1px solid var(--n-raised-ring); box-shadow: var(--n-shadow-tip);
    color: var(--n-strong); font-size: 13px; font-weight: 600; line-height: 1.2;
    opacity: 0; visibility: hidden; pointer-events: none; z-index: 60;
    transition: opacity .12s ease, transform .12s ease, visibility .12s;
  }
  html.nw-side-collapsed .nova-web :is(.nw-item, .nw-profile):is(:hover, :focus-visible) > .nw-tip { opacity: 1; visibility: visible; transform: translate(0, -50%); }
}

/* ---------- Área principal ---------- */
.nova-web .nw-main { position: relative; flex-grow: 1; min-width: 0; display: flex; flex-direction: column; }
.nova-web .nw-col { width: 100%; max-width: 760px; margin: 0 auto; box-sizing: border-box; }
/* A tela Nova de celular dentro da casca: o fundo é o da casca. */
.nova-web .nw-main .nova { min-height: 0; background: transparent; overflow-x: visible; }
.nova-web .nw-page { padding: 20px 40px 32px; display: flex; flex-direction: column; gap: 24px; box-sizing: border-box; }
.nova-web .nw-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.nova-web .nw-grid--320 { grid-template-columns: minmax(0, 1fr) 320px; }
.nova-web .nw-stack { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.nova-web .nw-aside { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 20px; min-width: 0; }
.nova-web .card { padding: 20px; }

/* ---------- Cabeçalho (WebHoje) ---------- */
.nova-web .nw-top { display: none; align-items: center; gap: 12px; padding: 20px 40px 0; }
.nova-web .nw-page > .nw-top { padding: 0; }
.nova-web .nw-search { margin: 0; }
.nova-web .nw-search-field { display: flex; align-items: center; gap: 10px; height: 44px; width: 440px; max-width: 100%; padding: 0 14px; border-radius: 14px; background: var(--n-sunken); border: 1px solid var(--n-border-soft); color: var(--n-label); box-sizing: border-box; cursor: text; }
.nova-web .nw-search-field:focus-within { border-color: var(--n-raised-ring); box-shadow: 0 0 0 3px rgb(var(--n-cyan-rgb) / .12); }
.nova-web .nw-search-field input { flex-grow: 1; min-width: 0; background: transparent; border: none; outline: none; box-shadow: none; padding: 0; color: var(--n-text); font: inherit; font-size: 14px; -webkit-appearance: none; appearance: none; }
.nova-web .nw-search-field input::placeholder { color: var(--n-label); }
.nova-web .nw-search-field input::-webkit-search-cancel-button { display: none; }
.nova-web .nw-kbd { font-family: "JetBrains Mono", monospace; font-size: 11px; padding: 3px 7px; border-radius: 6px; border: 1px solid var(--n-border-strong); color: var(--n-muted); }
.nova-web .nw-grow { flex-grow: 1; }
.nova-web .nw-bell { position: relative; }
.nova-web .nw-bell-dot { position: absolute; top: 10px; right: 11px; width: 8px; height: 8px; border-radius: 50%; background: var(--n-red); }
.nova-web .nw-talk { padding: 0 16px 0 6px; gap: 10px; white-space: nowrap; }

/* ---------- Barra de abas (<1024px) — cápsula do OrdiTabBar ---------- */
.nova-web .nw-tabs { position: fixed; left: 16px; right: 16px; bottom: calc(env(safe-area-inset-bottom, 0px) + 20px); z-index: 50; display: flex; justify-content: center; pointer-events: none; }
.nova-web .nw-tabs-capsule { pointer-events: auto; position: relative; display: flex; align-items: center; width: 100%; max-width: 520px; height: 68px; border-radius: 26px; background: var(--n-nav); border: 1px solid var(--n-border); box-shadow: var(--n-shadow-float); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.nova-web .nw-tab { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; height: 54px; color: var(--n-label); }
.nova-web .nw-tab small { font-size: 10.5px; font-weight: 600; }
.nova-web .nw-tab.on { color: var(--n-strong); }
.nova-web .nw-tab-orb { flex: 1 1 0; display: flex; justify-content: center; align-self: flex-start; margin-top: -30px; }
/* Sem anel nem disco escuro (como o OrdiTabBar do Android): o brilho ciano
   segue contínuo até o centro e o holograma flutua sobre ele. */
.nova-web .nw-tab-orb .orb-well { box-shadow: var(--n-orb-halo-shadow); background: var(--n-orb-halo); }
.nova-web.nova-web--tabs .nw-main { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--nw-tabs-h)); }
.nova-web.nova-web--tabs .nova .ef-foot { bottom: calc(env(safe-area-inset-bottom, 0px) + var(--nw-tabs-h)); }

@media (min-width: 1024px) {
  .nova-web .nw-side { display: flex; }
  .nova-web .nw-top { display: flex; }
  .nova-web .nw-tabs { display: none; }
  .nova-web.nova-web--tabs .nw-main { padding-bottom: 0; }
  .nova-web.nova-web--tabs .nova .ef-foot { bottom: 8px; }
  /* O topo de celular de cada tela repete o que a casca já mostra; some só
     o que for marcado .nw-mobile-only pela frente de módulo. */
  .nova-web .nw-mobile-only { display: none !important; }
  /* Folhas (dialog) centradas na área principal, não na janela toda. */
  .nova-web .nova dialog.v-sheet { left: var(--nw-side); }
  /* Conversa: no celular é tela cheia fixa (como no app); na casca larga
     ocupa a coluna abaixo do cabeçalho. */
  .nova-web .nw-main .nova.c-screen { position: relative; inset: auto; z-index: auto; height: calc(100dvh - 64px); }
}
@media (max-width: 1023.98px) {
  .nova-web .nw-grid, .nova-web .nw-grid--320 { grid-template-columns: minmax(0, 1fr); }
  .nova-web .nw-page { padding: 20px 16px 24px; }
  .nova-web .nw-aside { position: static; }
}
@media (min-width: 1024px) {
  /* Na coluna central o brilho vem da casca; o .glow da tela de celular
     desenharia uma caixa com borda no meio da página. */
  .nova-web .nw-col .nova > .glow { display: none; }
}

/* ---------- ⌘K sem cabeçalho (nova_web/_ask) ---------- */
.nova-web .nw-ask { width: min(560px, calc(100vw - 32px)); margin: 14vh auto auto; padding: 0; border: 1px solid var(--n-border); border-radius: 22px; background: var(--n-sheet); color: var(--n-text); box-shadow: var(--n-shadow-modal); box-sizing: border-box; }
.nova-web .nw-ask::backdrop { background: var(--n-overlay); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.nova-web .nw-ask[open] { animation: nw-ask-in .16s ease-out; }
.nova-web .nw-ask-form { margin: 0; padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.nova-web .nw-ask-form .lbl { margin: 0; }
.nova-web .nw-ask-field { width: 100%; height: 52px; }
.nova-web .nw-ask-field input { font-size: 16px; }
.nova-web .nw-ask-hint { margin: 0; font-size: 13px; color: var(--n-muted); }
@keyframes nw-ask-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (min-width: 1024px) {
  /* Centrada na área principal, não na janela toda. */
  .nova-web .nw-ask { margin-left: calc(var(--nw-side) + (100vw - var(--nw-side) - min(560px, calc(100vw - 32px))) / 2); }
}
@media (max-width: 1023.98px) { .nova-web .nw-ask .nw-kbd { display: none; } }
@media (prefers-reduced-motion: reduce) { .nova-web .nw-ask[open] { animation: none; } }

/* ==========================================================================
 * Avisos (flash) das telas Nova — shared/_nova_toast, web e app.
 * Fica fora da raiz .nova no app nativo, então carrega as próprias cores.
 * ========================================================================== */
.nova-toasts { position: fixed; z-index: 95; top: calc(max(var(--ordi-native-top-inset, 0px), env(safe-area-inset-top, 0px)) + 12px); left: 16px; right: 16px; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.nova-toasts:empty { display: none; }
.nova-toast { pointer-events: auto; display: flex; align-items: center; gap: 12px; width: 100%; max-width: 440px; padding: 10px 8px 10px 10px; border-radius: 18px; background: var(--n-toast); border: 1px solid var(--n-border); box-shadow: var(--n-shadow-toast); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); color: var(--n-text); font-family: "Lexend", system-ui, -apple-system, sans-serif; box-sizing: border-box; animation: nova-toast-in .22s ease-out; transition: opacity .18s ease, transform .18s ease; }
.nova-toast.is-leaving { opacity: 0; transform: translateY(-6px); }
.nova-toast-ic { width: 32px; height: 32px; border-radius: 11px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgb(var(--n-green-rgb) / .14); color: var(--n-green); }
.nova-toast--aviso .nova-toast-ic { background: rgb(var(--n-amber-rgb) / .14); color: var(--n-amber); }
.nova-toast--erro { border-color: rgb(var(--n-rose-rgb) / .4); }
.nova-toast--erro .nova-toast-ic { background: rgb(var(--n-rose-rgb) / .14); color: var(--n-rose); }
.nova-toast-msg { margin: 0; flex-grow: 1; min-width: 0; font-size: 14px; line-height: 1.4; font-weight: 600; overflow-wrap: anywhere; }
.nova-toast-x { width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 0; border: none; background: transparent; color: var(--n-label); cursor: pointer; }
.nova-toast-x:hover { background: rgb(var(--n-slate-rgb) / .08); color: var(--n-text); }
.nova-toast svg.i { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@keyframes nova-toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (min-width: 1024px) {
  /* Na casca web: no alto da área principal, à direita do cabeçalho. */
  .nova-web .nova-toasts { left: calc(var(--nw-side) + 40px); right: 40px; top: 20px; align-items: flex-end; }
}
@media (prefers-reduced-motion: reduce) {
  .nova-toast { animation: none; transition: none; }
}

/* ==========================================================================
 * Hoje — versão larga (prancha WebHoje, ≥1024px): app/views/today/_nova_web.
 * Abaixo de 1024px some; vale a tela de celular (today/_nova, .nw-mobile-only).
 * ========================================================================== */
.nova-web .nw-hoje { display: none; }
@media (min-width: 1024px) {
  .nova-web .nw-hoje { display: flex; }
}
.nova-web .nw-hoje .nw-grid { gap: 24px; }
.nova-web .nw-hoje-hello { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.nova-web .nw-hoje-hello h1 { margin: 8px 0 0; font-size: 44px; line-height: 1.05; font-weight: 600; letter-spacing: -0.03em; color: var(--n-text); }
.nova-web .nw-hoje-hello p { margin: 10px 0 0; font-size: 16px; color: var(--n-muted); }
.nova-web .nw-hoje-place { font-size: 14px; color: var(--n-muted); white-space: nowrap; }
.nova-web .nw-hoje-form { margin: 0; display: inline-flex; }

/* Sinal do dia */
.nova-web .nw-hoje-signal { display: flex; gap: 24px; align-items: center; padding: 22px 26px; border-color: var(--n-border-signal); background: linear-gradient(120deg, rgb(var(--n-cyan-rgb) / .10), rgb(var(--n-surface-rgb) / .86) 40%); }
/* O orbe se funde ao cartão: sem poço escuro nem aro, só um halo suave. */
.nova-web .nw-hoje-signal-orb { width: 132px; height: 132px; border-radius: 50%; background: var(--n-orb-halo-soft); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.nova-web .nw-hoje-signal-body { display: flex; flex-direction: column; gap: 14px; flex-grow: 1; min-width: 0; }
.nova-web .nw-hoje-signal-body p { margin: 0; font-size: 22px; line-height: 1.38; font-weight: 500; letter-spacing: -0.01em; text-wrap: pretty; color: var(--n-text); }
.nova-web .nw-hoje-signal-note { font-size: 13px; color: var(--n-violet-soft); margin-top: -6px; }
.nova-web .nw-hoje-signal-foot { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* Comece por aqui (conta sem nada na mesa) */
.nova-web .nw-hoje-try { display: flex; flex-direction: column; gap: 12px; }
.nova-web .nw-hoje-try p { margin: 0; font-size: 15.5px; line-height: 1.5; }
.nova-web .nw-hoje-chips { display: flex; flex-wrap: wrap; gap: 8px; }

/* Seu dia · Precisa de você · O Ordi fez por você */
.nova-web .nw-hoje-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.nova-web .nw-hoje-list { padding: 8px 20px 6px; }
.nova-web .nw-hoje-head { display: flex; justify-content: space-between; align-items: center; padding: 12px 0 10px; }
.nova-web .nw-hoje-head a { font-size: 13px; font-weight: 600; }
.nova-web .nw-hoje-empty { margin: 0; padding: 6px 0 14px; font-size: 14px; color: var(--n-muted); }
.nova-web .nw-hoje-row { align-items: center; padding: 13px 0; border-top-color: var(--n-divider); }
.nova-web .nw-hoje-list .nw-hoje-head + .nw-hoje-row { border-top: none; }
.nova-web .nw-hoje-row .time { width: 48px; padding-top: 0; align-self: flex-start; padding-top: 2px; }
.nova-web .nw-hoje-row.now { margin: 0 -12px; padding: 13px 12px; border-radius: 14px; }
.nova .nw-hoje-act { height: 36px; padding: 0 12px; font-size: 13px; border-radius: 12px; flex-shrink: 0; }
.nova .nw-hoje-att { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--n-divider); }
.nova .nw-hoje-head + .nw-hoje-att { border-top: none; }
.nova .nw-hoje-needs { padding: 4px 18px; }
.nova .nw-hoje-needs > .nw-hoje-att:first-child { border-top: none; }
.nova .nw-hoje-att .ic { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nova .nw-hoje-att .body { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.nova .nw-hoje-att .body strong { font-weight: 700; font-size: 14.5px; color: var(--n-text); }
.nova .nw-hoje-att .body small { font-size: 12.5px; color: var(--n-muted); }
.nova .nw-hoje-att--amber .ic { background: rgb(var(--n-amber-rgb) / .12); color: var(--n-amber); }
.nova .nw-hoje-att--amber .body small { color: var(--n-amber-soft); }
.nova .nw-hoje-att--rose .ic { background: rgb(var(--n-red-rgb) / .12); color: var(--n-rose); }
.nova .nw-hoje-att--rose .body small { color: var(--n-rose-soft); }
.nova .nw-hoje-att--violet .ic { background: rgb(var(--n-violet-rgb) / .12); color: var(--n-violet); }
.nova .nw-hoje-att--violet .body small { color: var(--n-violet-soft); }
.nova .nw-hoje-att--cyan .ic { background: rgb(var(--n-cyan-rgb) / .12); color: var(--n-cyan); }
.nova-web .nw-hoje-receipt .body strong { font-size: 14px; font-weight: 600; }
.nova-web .nw-hoje-receipt .body small { font-size: 12px; color: var(--n-label); }
.nova-web .nw-hoje-link { background: none; border: none; padding: 0; cursor: pointer; font: inherit; font-size: 13px; font-weight: 700; color: var(--n-cyan); }
.nova-web .nw-hoje-link:hover { color: var(--n-cyan-soft); }
.nova-web .nw-hoje-habits { display: flex; flex-direction: column; gap: 16px; }
.nova-web .nw-hoje-habits .nw-hoje-head { padding: 0; }
.nova-web .nw-hoje-habits .n-ring .n-dial, .nova-web .nw-hoje-habits .n-ring .n-dial > svg { width: 68px; height: 68px; }
.nova-web .nw-hoje .goal { padding: 20px; }
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .nova-web .nw-hoje-pair { grid-template-columns: minmax(0, 1fr); }
}
.nova-web .nw-hoje-badge-line { display: flex; margin-top: 3px; }
.nova-web .nw-hoje-signal-actions { margin-left: auto; display: inline-flex; gap: 8px; align-items: center; }

/* Hoje · Onda D (06/10/2026): ação em toda linha de "Seu dia" (H-06), bloco
 * "Sem hora" (H-01), "Ver o dia todo"/"Ver tudo" (H-03) e faixa de viagem
 * (H-10) — celular, app e versão larga. */
.nova .day-row .nw-hoje-form { margin: 0; display: inline-flex; align-self: center; }
.nova .day-row .title-line { flex-wrap: wrap; row-gap: 4px; }
.nova .pair > :only-child { grid-column: 1 / -1; }
.nova .day-row.passed .body strong { color: var(--n-muted); }
.nova .untimed-row .time { display: flex; align-items: center; color: var(--n-label); }
.nova .untimed-row.late .time { color: var(--n-rose-soft); }
.nova .today-more { border-top: 1px solid var(--n-line); }
.nova .today-more > summary { list-style: none; cursor: pointer; padding: 12px 0; font-size: 13px; font-weight: 700; color: var(--n-cyan); }
.nova .today-more > summary::-webkit-details-marker { display: none; }
.nova .today-more[open] > summary { color: var(--n-muted); }
.nova .today-more-count { font-weight: 600; color: var(--n-muted); }
.nova .today-more > .day-row:first-of-type { border-top: none; }
.nova .today-travel { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: center; padding: 12px 16px; border-color: rgb(var(--n-violet-rgb) / .35); background: rgb(var(--n-violet-rgb) / .08); }
.nova .today-travel .ic { color: var(--n-violet); display: flex; flex-shrink: 0; }
.nova .today-travel .body { display: flex; flex-direction: column; gap: 2px; flex: 1 1 200px; min-width: 0; }
.nova .today-travel .nw-hoje-form { margin-left: auto; }
.nova .today-travel .acts { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.nova .today-travel .acts .nw-hoje-form { margin-left: 0; }
.nova .today-travel .body strong { font-size: 14.5px; font-weight: 700; color: var(--n-text); }
.nova .today-travel .body small { font-size: 12.5px; color: var(--n-muted); }

/* Resumo da manhã/da noite no Hoje (frente PERFIL, Onda D; resumos/_hoje). */
.nova .today-digest { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; min-width: 0; }
.nova .today-digest-head { display: flex; gap: 12px; align-items: center; }
.nova .today-digest-head .ic { color: var(--n-amber-deep); display: flex; flex-shrink: 0; }
.nova .today-digest-head .body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nova .today-digest-head strong { font-size: 14.5px; font-weight: 700; color: var(--n-text); }
.nova .today-digest-head small { font-size: 12.5px; color: var(--n-muted); }
.nova .today-digest-text { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; line-height: 1.45; color: var(--n-text); overflow-wrap: anywhere; }
.nova .today-digest-text p { margin: 0; }
.nova .today-digest-more > summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--n-cyan-deep); list-style: none; }
.nova .today-digest-more > summary::-webkit-details-marker { display: none; }
.nova .today-digest-more[open] > summary { margin-bottom: 8px; color: var(--n-muted); }
.nova .today-digest-audio { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.nova .today-digest-audio audio { flex: 1 1 200px; max-width: 100%; height: 36px; }

/* ==========================================================================
 * Perfil › Aparência (devise/registrations/edit, theme_choice_controller.js)
 * Três opções com miniatura do tema; a escolhida ganha o aro do acento.
 * ========================================================================== */
.nova .nt-theme { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; border: none; min-width: 0; }
.nova .nt-theme-opt { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 10px; border-radius: 18px; background: rgb(var(--n-slate-rgb) / .06); border: 1px solid var(--n-border); cursor: pointer; min-width: 0; }
.nova .nt-theme-opt input { position: absolute; opacity: 0; pointer-events: none; }
.nova .nt-theme-opt:has(input:checked) { border-color: var(--n-cyan-deep); box-shadow: inset 0 0 0 1px var(--n-cyan-deep); background: rgb(var(--n-cyan-rgb) / .08); }
.nova .nt-theme-opt:has(input:focus-visible) { outline: 2px solid var(--n-cyan); outline-offset: 2px; }
.nova .nt-theme-opt .stack { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nova .nt-theme-opt strong { font-size: 14px; font-weight: 700; color: var(--n-text); }
.nova .nt-theme-opt small { font-size: 12px; color: var(--n-muted); }
.nova .nt-swatch { position: relative; display: block; height: 54px; border-radius: 12px; overflow: hidden; border: 1px solid var(--n-swatch-line); }
.nova .nt-swatch i { position: absolute; left: 10px; right: 10px; height: 10px; border-radius: 5px; }
.nova .nt-swatch i:first-child { top: 12px; right: 34%; }
.nova .nt-swatch i:last-child { top: 30px; }
.nova .nt-swatch--dark { background: var(--n-swatch-dark); }
.nova .nt-swatch--dark i { background: var(--n-swatch-dark-card); }
.nova .nt-swatch--light { background: var(--n-swatch-light); }
.nova .nt-swatch--light i { background: var(--n-swatch-light-card); box-shadow: 0 0 0 1px var(--n-swatch-line); }
.nova .nt-swatch--auto { background: linear-gradient(90deg, var(--n-swatch-light) 50%, var(--n-swatch-dark) 50%); }
.nova .nt-swatch--auto i { background: linear-gradient(90deg, var(--n-swatch-light-card) 50%, var(--n-swatch-dark-card) 50%); }
@media (max-width: 380px) {
  .nova .nt-theme { gap: 8px; }
  .nova .nt-theme-opt { padding: 8px; }
}

/* ---------- Onda D: cartão da revisão no Hoje (reviews/_today_card) ---------- */
.nova .rv-today-card { display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; }
.nova .rv-today-card:hover { border-color: var(--n-raised-ring); }
.nova .rv-today-line { margin: 0; font-size: 14px; line-height: 1.5; color: var(--n-soft); }
.nova .rv-today-cta { font-size: 13px; font-weight: 700; color: var(--n-strong); }
.nova .rv-today-chip { height: 26px; padding: 0 10px; font-size: 12px; font-weight: 700; background: rgb(var(--n-amber-rgb) / .10); border-color: rgb(var(--n-amber-rgb) / .35); color: var(--n-amber-soft); }

/* Comemoração (celebration_controller): o Di "feito" no lugar do ícone e do
   confete. Sem aro: o Di já é o desenho inteiro. */
.swal2-icon.ordi-celebration-di { border: 0 !important; width: 56px; height: 56px; margin: .6em auto .2em; }
.swal2-icon.ordi-celebration-di .swal2-icon-content, .swal2-icon.ordi-celebration-di .di { width: 100%; height: 100%; display: block; }
.swal2-toast .swal2-icon.ordi-celebration-di { width: 32px; height: 32px; margin: 0 .5em 0 0; }