/* Agention: visual "Íon", escolhido pelo Ian em 20/10/2026 (direção A do canvas de visuais).
   Escuro por padrão; a pessoa troca para claro ou automático em Configurações > Aparência.
   O tema vem em <html data-tema="escuro|claro|auto"> (tema.js aplica antes de desenhar). */
:root{
  --surface:#070B16; --raised:#0E1424; --ink:#E8F0FF; --muted:#8FA0C2; --line:#1E2A44; --chip:#16213D;
  --accent:#39E0FF; --accent-ink:#04121A; --accent-soft:#0C2A3A;
  --strong:#0E1630; --strong-line:#22345C; --on-strong:#E8F0FF; --on-strong-muted:#8FA0C2;
  --alta:#FF5C93; --alta-soft:#3A1028; --alta-ink:#FF8DB4;
  --media:#FFC24D; --media-dot:#FFC24D; --media-soft:#33270C;
  --baixa:#A4AABE; --baixa-soft:#1A2236;
  --ok:#4BE3A0; --ok-soft:#0F2A22;
  --scrim:rgba(0,0,0,.6); --knob:#FFFFFF;
  --qr-plate:#FFFFFF; --qr-ink:#111216;
  --brilho:0 0 10px;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 32px rgba(0,0,0,.45);
  --f-display:"Space Grotesk","Segoe UI",system-ui,sans-serif;
  --f-body:"Manrope","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  color-scheme:dark;
}
/* Íon claro: mesmo desenho, fundo claro. Ciano mais escuro para dar contraste no branco. */
:root[data-tema="claro"]{
  --surface:#F4F7FC; --raised:#FFFFFF; --ink:#0B1222; --muted:#55607A; --line:#DCE3EF; --chip:#EAF0F8;
  --accent:#007A9E; --accent-ink:#FFFFFF; --accent-soft:#E0F6FC;
  --strong:#0B1630; --strong-line:#0B1630; --on-strong:#E8F0FF; --on-strong-muted:#A3B1CF;
  --alta:#C8235F; --alta-soft:#FDE7EF; --alta-ink:#A51D4F;
  --media:#8A5A00; --media-dot:#E0A100; --media-soft:#FCF0CF;
  --baixa:#55607A; --baixa-soft:#ECEFF5;
  --ok:#147A4E; --ok-soft:#E1F4EA;
  --scrim:rgba(12,14,24,.5);
  --brilho:0 0 0;
  --shadow:0 1px 2px rgba(11,18,34,.06), 0 10px 30px rgba(11,18,34,.10);
  color-scheme:light;
}
@media (prefers-color-scheme: light){
  :root[data-tema="auto"]{
    --surface:#F4F7FC; --raised:#FFFFFF; --ink:#0B1222; --muted:#55607A; --line:#DCE3EF; --chip:#EAF0F8;
    --accent:#007A9E; --accent-ink:#FFFFFF; --accent-soft:#E0F6FC;
    --strong:#0B1630; --strong-line:#0B1630; --on-strong:#E8F0FF; --on-strong-muted:#A3B1CF;
    --alta:#C8235F; --alta-soft:#FDE7EF; --alta-ink:#A51D4F;
    --media:#8A5A00; --media-dot:#E0A100; --media-soft:#FCF0CF;
    --baixa:#55607A; --baixa-soft:#ECEFF5;
    --ok:#147A4E; --ok-soft:#E1F4EA;
    --scrim:rgba(12,14,24,.5);
    --brilho:0 0 0;
    --shadow:0 1px 2px rgba(11,18,34,.06), 0 10px 30px rgba(11,18,34,.10);
    color-scheme:light;
  }
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);font-weight:700;margin:0;text-wrap:balance;letter-spacing:-.01em}
p,ul,ol{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
svg.ic{width:18px;height:18px;flex:none}

/* ---------- Casca do app ---------- */
.app{container:app / inline-size;height:100dvh;display:flex;flex-direction:column;position:relative;background:var(--surface);color:var(--ink);padding-top:env(safe-area-inset-top,0px)}
.app-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.tela{--gl:max(20px,env(safe-area-inset-left,0px));--gr:max(20px,env(safe-area-inset-right,0px));padding-left:var(--gl);padding-right:var(--gr);padding-block:0 36px;min-height:100%}
.miolo{max-width:1080px;margin-inline:auto}
.coluna{max-width:520px;margin-inline:auto;display:grid;gap:18px}
.carregando{display:grid;place-items:center;min-height:60vh;color:var(--muted)}

.topo{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;padding-block:10px}
.topo-estreito{max-width:520px;width:100%;margin-inline:auto}
/* Marca: anel de órbita com um íon (ponto) + nome */
.marca{font-family:var(--f-display);font-weight:700;font-size:21px;letter-spacing:.01em;position:relative;display:inline-flex;align-items:center;gap:9px}
.marca::before{content:"";width:22px;height:22px;border-radius:50%;border:2px solid var(--accent);flex:none}
.marca::after{content:"";position:absolute;left:15px;top:50%;margin-top:-14px;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:var(--brilho) var(--accent)}
.voltar{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--raised);display:grid;place-items:center;flex:none}
.espaco-voltar{width:40px}
.passo{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.link{white-space:nowrap;border:0;background:none;padding:6px 2px;color:var(--accent);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:12px;border:1px solid transparent;font-weight:600;line-height:1.2;text-align:center;text-decoration:none}
.btn-pri{background:var(--accent);color:var(--accent-ink)}
.btn-sec{background:var(--raised);border-color:var(--line);color:var(--ink)}
.btn-ghost{background:none;color:var(--muted)}
.btn-ghost:hover{background:var(--chip)}
.btn-perigo{background:none;border-color:var(--alta);color:var(--alta)}
.btn-perigo-cheio{background:var(--alta);color:var(--surface)}
.btn-bloco{width:100%}
.btn-grande{min-height:54px;padding:0 28px;font-size:17px;border-radius:14px}
.btn-p{min-height:36px;padding:0 12px;font-size:13.5px;border-radius:10px}
.btn[disabled]{opacity:.42;cursor:not-allowed}

.lead{font-size:18px;color:var(--muted);max-width:32ch}
.lead-s{color:var(--muted)}
.dica{font-size:13px;color:var(--muted)}
.rotulo{font-size:13px;font-weight:600}
.secao{font-size:19px;display:flex;align-items:center;gap:8px}
.secao-sub{font-size:13.5px;color:var(--muted);margin-top:2px}
.cont{font-family:var(--f-mono);font-size:12px;font-weight:500;padding:2px 8px;border-radius:999px;background:var(--chip);color:var(--muted)}
.eyebrow{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.erro-form{font-size:14px;color:var(--alta);font-weight:500}

.campo{display:grid;gap:6px}
.campo label{font-size:13px;font-weight:600}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=time],select{width:100%;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--raised);color:var(--ink)}
input::placeholder{color:var(--muted);opacity:.8}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:20px;height:20px;margin:0;flex:none}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:3px;border-radius:12px;background:var(--chip)}
.seg button{border:0;background:none;min-height:38px;border-radius:9px;font-weight:600;font-size:14px;color:var(--muted)}
.seg button[aria-selected="true"]{background:var(--raised);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--raised);font-size:14px;color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:600}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-flex;align-items:center;gap:4px;padding:5px 5px 5px 12px;border-radius:999px;background:var(--chip);font-size:14px}
.tag button{width:26px;height:26px;border-radius:50%;border:0;background:none;display:grid;place-items:center;color:var(--muted)}
.tag button:hover{background:var(--line)}
.add-linha{display:flex;gap:8px}
.add-linha input{flex:1;min-width:0}

.opcoes{display:grid;gap:10px}
.opcao{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--raised);cursor:pointer}
.opcao b{display:block}
.opcao small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.opcao:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.opcao:has(input:disabled){opacity:.6;cursor:not-allowed}
.breve{font-family:var(--f-mono);font-size:10.5px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;padding:2px 6px;border-radius:5px;background:var(--chip);color:var(--muted);margin-left:6px;vertical-align:2px}

input.switch{appearance:none;-webkit-appearance:none;width:46px;height:28px;border-radius:999px;background:var(--line);position:relative;flex:none;margin:0;transition:background .2s;cursor:pointer}
input.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--knob);box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
input.switch:checked{background:var(--accent)}
input.switch:checked::after{transform:translateX(18px)}
input.switch:disabled{opacity:.45;cursor:not-allowed}

.status{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--ok-soft);color:var(--ok);white-space:nowrap}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:var(--brilho) currentColor}
.status.off{background:var(--alta-soft);color:var(--alta)}
.status.meio{background:var(--media-soft);color:var(--media)}
.banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:12px 14px;border-radius:12px;background:var(--media-soft);font-size:14px}
.banner p{flex:1;min-width:200px}
.banner.ruim{background:var(--alta-soft)}
.banner.info{background:var(--accent-soft)}

/* Página inicial */
.hero{display:grid;gap:30px;padding-block:8px 36px}
.hero h1{font-size:46px;line-height:.98;letter-spacing:-.025em;margin-top:12px}
.hero .lead{margin-top:14px}
.hero-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:24px}
.sobre{color:var(--accent)}
.demo{display:grid;gap:8px;padding:16px;border-radius:22px;background:var(--chip)}
.demo-cab{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);padding-inline:2px}
.mini{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--raised);border:1px solid var(--line)}
.mini .selo{grid-row:span 2;align-self:start}
.mini b{font-size:14px}
.mini span.t{font-size:13px;color:var(--muted);grid-column:2}
.mini:nth-child(3){margin-inline:8px;opacity:.92}
.mini:nth-child(4){margin-inline:16px;opacity:.7}
.passos{display:grid;gap:18px;padding-block:8px 36px}
.passos ol{list-style:none;padding:0;display:grid;gap:12px}
.passos li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start;align-content:start;padding:16px;border-radius:16px;border:1px solid var(--line);background:var(--raised)}
.passos .num{font-family:var(--f-display);font-size:30px;line-height:1;color:var(--accent)}
.passos b{display:block;font-size:16px}
.passos p{color:var(--muted);font-size:14px;margin-top:2px}
.privacidade{padding:26px 22px;border-radius:24px;background:var(--strong);border:1px solid var(--strong-line);color:var(--on-strong);display:grid;gap:18px}
.privacidade .eyebrow{color:var(--on-strong-muted)}
.privacidade h2{font-size:30px;line-height:1.05}
.privacidade ul{list-style:none;padding:0;display:grid;gap:14px}
.privacidade li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:15px;color:var(--on-strong-muted)}
.privacidade li b{color:var(--on-strong)}
.privacidade svg{margin-top:2px;color:var(--on-strong)}
.rodape{display:flex;flex-wrap:wrap;gap:6px 16px;padding-block:28px 4px;font-size:13px;color:var(--muted)}
.rodape span:last-child{margin-left:auto}

/* Conhecendo você */
.tela-q{display:flex;flex-direction:column;padding-bottom:0}
.tela-q .coluna{flex:1;align-content:start;width:100%}
.prog{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.prog i{height:5px;border-radius:3px;background:var(--line)}
.prog i.feito{background:var(--accent)}
.prog i.pulado{background:var(--media-dot)}
.prog i.atual{background:var(--accent);opacity:.45}
.q-info{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--muted)}
.q-titulo{font-size:28px;line-height:1.1;margin-top:6px}
.q-pe{position:sticky;bottom:0;display:flex;align-items:center;gap:8px;margin-top:28px;padding-block:12px calc(16px + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:1px solid var(--line);max-width:520px;width:100%;margin-inline:auto}
.q-pe .btn-pri{margin-left:auto;min-width:130px}
.empresa-bloco{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--raised)}
.empresa-cab{display:flex;align-items:center;justify-content:space-between;gap:8px}
.empresa-cab .link{padding:0;font-size:13px;color:var(--muted)}
[data-add-empresa]{justify-self:start}
.linha-switch{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--raised);cursor:pointer}
.linha-switch small{display:block;color:var(--muted);font-size:13px}

/* Permissões */
.termo{display:grid;gap:12px}
.check{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--raised);cursor:pointer}
.check:has(input:checked){border-color:var(--accent)}
.check:has(input:disabled){opacity:.6;cursor:not-allowed}
.check small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.obrig{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);margin-left:4px}
.cuidados{list-style:none;padding:0;display:grid;gap:10px;font-size:14.5px}
.cuidados li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px}
.cuidados svg{color:var(--ok);margin-top:2px}
.alerta{padding:14px;border-radius:14px;background:var(--media-soft);font-size:14px}
.alerta b{display:block;margin-bottom:2px}
.registro{font-size:12px;color:var(--muted);line-height:1.5}

/* Conectar WhatsApp */
.qr-wrap{position:relative;width:min(260px,100%);margin-inline:auto;aspect-ratio:1;max-width:100%;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--qr-plate);display:grid;place-items:center}
.qr-wrap svg{display:block;width:100%;height:100%}
.qr-espera{font-size:13px;color:#5B6177;text-align:center;padding:20px}
.qr-tempo{text-align:center;font-size:12px;color:var(--muted)}
.passos-wa{padding-left:22px;display:grid;gap:8px;font-size:14.5px}
.passos-wa li::marker{font-family:var(--f-mono);color:var(--accent)}
.codigo{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;padding:16px;border-radius:14px;background:var(--chip)}
.codigo .mono{font-size:28px;font-weight:500;letter-spacing:.12em}
.conexao{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--raised)}
.conexao b{display:block}
.conexao small{display:block;color:var(--muted);font-size:13px}
.luz{width:12px;height:12px;border-radius:50%;flex:none;background:var(--muted);animation:pulso 1.6s ease-in-out infinite}
.conexao[data-estado="conectando"] .luz,.conexao[data-estado="reconectando"] .luz,.conexao[data-estado="iniciando"] .luz{background:var(--accent);animation:pulso .6s ease-in-out infinite}
.conexao[data-estado="conectado"]{border-color:var(--ok);background:var(--ok-soft)}
.conexao[data-estado="conectado"] .luz{background:var(--ok);animation:none}
.conexao[data-estado="erro"],.conexao[data-estado="expirado"]{border-color:var(--alta);background:var(--alta-soft)}
.conexao[data-estado="erro"] .luz,.conexao[data-estado="expirado"] .luz{background:var(--alta);animation:none}
@keyframes pulso{50%{opacity:.3}}
.lembrete{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;font-size:13.5px;color:var(--muted)}
.lembrete svg{color:var(--accent)}

/* Telas logadas */
.tela-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 16px;padding-block:22px 18px}
.tela-cab h1{font-size:30px;line-height:1.05}
.data{color:var(--muted);margin-bottom:4px}
.pilha{display:grid;gap:14px}
.pilha-banners{display:grid;gap:10px;margin-bottom:18px}

/* Hoje */
.hoje-grid{display:grid;gap:20px}
.hoje-lado{display:grid;gap:14px;align-content:start}
.resumo-dia{padding:18px;border-radius:20px;background:var(--strong);border:1px solid var(--strong-line);color:var(--on-strong);display:grid;gap:10px}
.resumo-dia .eyebrow{color:var(--on-strong-muted);display:flex;justify-content:space-between;gap:8px}
.resumo-dia ul{list-style:none;padding:0;display:grid;gap:8px;font-size:15px;line-height:1.4}
.resumo-dia li{display:grid;grid-template-columns:14px minmax(0,1fr);gap:8px}
.resumo-dia li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--on-strong-muted);margin-top:.55em}
.resumo-dia .link{color:var(--on-strong);justify-self:start;padding:0;font-size:13.5px}
.contadores{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.cont-btn{display:grid;gap:2px;justify-items:start;padding:10px 10px 9px;border-radius:14px;border:1px solid var(--line);background:var(--raised);text-align:left}
.cont-btn[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.cont-n{font-family:var(--f-display);font-size:28px;line-height:1;font-variant-numeric:tabular-nums}
.cont-r{font-size:12px;color:var(--muted);line-height:1.2}
.c-alta{color:var(--alta)} .c-media{color:var(--media)} .c-baixa{color:var(--baixa)}
.filtros{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--gl)) calc(-1 * var(--gr));padding-inline:var(--gl) var(--gr);padding-block:2px}
.filtros::-webkit-scrollbar{display:none}
.filtros .chip{flex:none;min-height:36px;font-size:13.5px}
.lendo{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.lendo::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulso .8s ease-in-out infinite}
.grupo-imp{display:grid;gap:10px}
.grupo-imp+.grupo-imp{margin-top:22px}
.grupo-imp h2{font-family:var(--f-body);font-size:13px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:8px}
.selo{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.02em;white-space:nowrap;flex:none}
.selo::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.selo-alta{background:var(--alta-soft);color:var(--alta-ink)}
.selo-media{background:var(--media-soft);color:var(--media)}
.selo-media::before{background:var(--media-dot)}
.selo-baixa{background:var(--baixa-soft);color:var(--baixa)}
.conv{display:grid;gap:10px;padding:15px;border-radius:20px;border:1px solid var(--line);background:var(--raised)}
.conv[data-imp="alta"]{border-color:color-mix(in srgb,var(--alta) 40%,var(--line))}
.conv[data-imp="baixa"]{background:var(--surface)}
.conv-topo{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:start}
/* Avatar em anel (órbita), na cor da importância */
.av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:transparent;border:1.5px solid var(--line);font-weight:700;font-size:13px;color:var(--ink)}
.av-grupo{border-radius:12px}
.conv[data-imp="alta"] .av{border-color:var(--alta);color:var(--alta-ink)}
.conv[data-imp="media"] .av{border-color:var(--media-dot);color:var(--media)}
.conv-id{min-width:0}
.conv-id h3{font-family:var(--f-body);font-size:15.5px;font-weight:600;letter-spacing:0;line-height:1.25;overflow-wrap:anywhere}
.conv-meta{font-size:12.5px;color:var(--muted);margin-top:2px}
.conv-resumo{font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.conv-antes{list-style:none;padding:0;display:grid;gap:4px;font-size:13.5px;color:var(--muted);border-left:2px solid var(--line);padding-left:10px}
.conv-pe{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.acao{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--ink)}
.acao svg{width:16px;height:16px;color:var(--accent)}
.sem-resp{font-size:12.5px;color:var(--alta);font-weight:500}
.conv-botoes{display:flex;flex-wrap:wrap;gap:8px;padding-top:2px}
.conv-botoes .btn{flex:1 1 140px;min-height:44px}
.btn-resolver{background:var(--accent);color:var(--accent-ink);font-size:15px;font-weight:700}
.btn-resolver svg{width:18px;height:18px}
.btn-resolver:hover{filter:brightness(1.08)}
.conv-mais{display:flex;justify-content:flex-end;margin-top:-4px}
.conv-mais .link{font-size:12.5px;color:var(--muted);font-weight:500;padding:2px}
.nao-lida{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:var(--alta-soft);color:var(--alta-ink);font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
.grupo-esperando h2{color:var(--ink);font-family:var(--f-display);font-size:15px}
.grupo-esperando .conv{border-color:color-mix(in srgb,var(--alta) 45%,var(--line))}
.vazio{padding:28px 16px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:16px}
.resolvidas{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}
.resolvidas summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--muted)}
.resolvida{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.resolvida span{flex:1;min-width:0;color:var(--muted);text-decoration:line-through}
.confirma{display:grid;gap:10px;padding:14px;border-radius:14px;background:var(--alta-soft);font-size:14px}
.confirma div{display:flex;flex-wrap:wrap;gap:8px}

/* Agenda */
.agenda-grid{display:grid;gap:28px}
.sug{display:grid;grid-template-columns:58px minmax(0,1fr);gap:14px;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--raised)}
.sug-ok{border-color:var(--ok)}
.folha{align-self:start;display:grid;justify-items:center;align-content:start;padding:8px 0;border-radius:12px;background:var(--accent-soft);color:var(--accent);font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;line-height:1.2}
.folha b{font-family:var(--f-display);font-size:26px;letter-spacing:0;line-height:1.05}
.sug-ok .folha{background:var(--ok-soft);color:var(--ok)}
.sug-corpo{display:grid;gap:6px;min-width:0}
.sug-corpo h3{font-family:var(--f-body);font-size:15.5px;font-weight:600;letter-spacing:0;overflow-wrap:anywhere}
.sug-quando{font-size:12.5px;color:var(--muted)}
.sug-origem{font-size:13.5px;padding:10px 12px;border-radius:10px;background:var(--chip);overflow-wrap:anywhere}
.sug-de{display:block;font-size:12px;color:var(--muted);margin-bottom:2px}
.sug-botoes{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
.sug-ignorada{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;border:1px dashed var(--line);font-size:13.5px;color:var(--muted)}
.semperm{padding:12px 14px;border-radius:12px;background:var(--chip);font-size:13.5px}

/* Configurações */
.ajustes-grid{display:grid;gap:26px}
.bloco{display:grid;gap:8px;align-content:start}
.bloco h2{font-size:17px}
.lista{border:1px solid var(--line);border-radius:16px;background:var(--raised);overflow:hidden}
.linha{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;border-bottom:1px solid var(--line);cursor:default}
label.linha{cursor:pointer}
.linha:last-child{border-bottom:0}
.linha-txt{display:grid;gap:1px;min-width:0}
.linha-rot{font-size:12.5px;color:var(--muted)}
.linha-val{font-size:14.5px;overflow-wrap:anywhere}
.linha-txt b{font-weight:600;font-size:14.5px}
.linha-txt small{font-size:12.5px;color:var(--muted)}
.linha select{width:auto;min-height:38px}
.pulada{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--media);margin-left:6px}
.nota-baixa{font-size:12px;color:var(--muted);padding-inline:2px}
.tabela-uso{width:100%;border-collapse:collapse;font-size:13px}
.tabela-uso th,.tabela-uso td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tabela-uso td.n{text-align:right}
.rolar-x{overflow-x:auto}

/* Conversar com o ION */
textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--raised);color:var(--ink);font:inherit;line-height:1.45;resize:vertical}
textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.ion-grid{display:grid;gap:24px}
.chat{display:grid;gap:12px;align-content:start;min-width:0}
.chat-msgs{display:flex;flex-direction:column;gap:10px;max-height:min(60vh,560px);overflow-y:auto;padding:4px 2px}
.msg{max-width:88%;padding:10px 14px;border-radius:16px;font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.msg-ion{align-self:flex-start;background:var(--raised);border:1px solid var(--line);border-bottom-left-radius:6px}
.msg-pessoa{align-self:flex-end;background:var(--accent);color:var(--accent-ink);border-bottom-right-radius:6px}
.msg-pensando{color:var(--muted);font-style:italic}
.chat-form{display:flex;gap:8px;align-items:flex-end}
.chat-form textarea{flex:1;min-width:0;resize:none}
.ion-notas-pe{display:flex;align-items:center;justify-content:space-between;gap:8px}

.ion-abas{max-width:420px;margin-bottom:20px}
.tarefas{min-width:0}
.tarefa{display:grid;gap:8px;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--raised)}
.tarefa-cab{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tarefa-tipo{font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:6px;background:var(--chip);color:var(--muted)}
.tarefa-tipo.acao{background:var(--media-soft);color:var(--media)}
.tarefa-pedido{font-weight:600}
.tarefa-resposta{font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.tarefa-acao{font-size:13.5px;padding:10px 12px;border-radius:10px;background:var(--media-soft)}
.semperm p+p{margin-top:8px}

/* Tour do primeiro acesso */
.tour-veu{position:fixed;inset:0;z-index:40}
.tour-veu i{position:fixed;background:rgba(10,12,24,.62)}
.tour-foco{position:fixed;z-index:41;border-radius:14px;border:2px solid var(--accent);pointer-events:none}
.tour-foco.sem{display:none}
.tour-card{position:fixed;z-index:42;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));margin-inline:auto;max-width:440px;display:grid;gap:10px;padding:18px;border-radius:18px;background:var(--raised);color:var(--ink);box-shadow:var(--shadow)}
.tour-card.topo{bottom:auto;top:calc(16px + env(safe-area-inset-top,0px))}
.tour-card h2{font-size:21px}
.tour-passo{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tour-pe{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tour-pe .btn-pri{margin-left:auto}

/* Barra de abas */
.tabbar{display:flex;flex:none;border-top:1px solid var(--line);background:var(--raised);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
.tab-marca{display:none}
.tab{flex:1;display:grid;justify-items:center;gap:2px;padding:9px 0 10px;border:0;background:none;color:var(--muted);font-size:11.5px;font-weight:600}
.tab svg{width:22px;height:22px}
.tab[aria-current="page"]{color:var(--accent)}

.toast{position:absolute;left:16px;right:16px;bottom:16px;margin-inline:auto;max-width:440px;padding:12px 14px;border-radius:12px;background:var(--strong);color:var(--on-strong);font-size:14px;box-shadow:var(--shadow);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none;z-index:5}
.toast.on{opacity:1;transform:none}
.app[data-logado] .toast{bottom:calc(82px + env(safe-area-inset-bottom,0px))}

/* Tela larga */
@container app (min-width:700px){
  .tela{--gl:max(36px,env(safe-area-inset-left,0px));--gr:max(36px,env(safe-area-inset-right,0px))}
  .hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:48px;padding-block:40px 56px}
  .hero h1{font-size:60px}
  .passos ol{grid-template-columns:repeat(3,minmax(0,1fr))}
  .passos li{grid-template-columns:1fr}
  .privacidade{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);padding:36px;gap:32px}
  .privacidade h2{font-size:38px}
  .q-titulo{font-size:34px}
  .hoje-grid{grid-template-columns:320px minmax(0,1fr);gap:32px;align-items:start}
  .hoje-lado{position:sticky;top:16px}
  .filtros{flex-wrap:wrap;margin-inline:0;padding-inline:0;overflow:visible}
  .agenda-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:36px;align-items:start}
  .ajustes-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 32px}
  .ion-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:36px;align-items:start}
  .tabbar{order:-1;align-items:center;gap:4px;border-top:0;border-bottom:1px solid var(--line);padding-block:10px;padding-left:max(36px,env(safe-area-inset-left,0px));padding-right:max(36px,env(safe-area-inset-right,0px))}
  .tab-marca{display:block;margin-right:28px}
  .tab{flex:none;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;font-size:14px}
  .tab svg{width:18px;height:18px}
  .tab[aria-current="page"]{background:var(--accent-soft)}
  .app[data-logado] .toast{bottom:16px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}