/* CRM IV Help — mesma família visual de ivhelp.com.br: moldura em marinho-espaço, conteúdo "abrindo pro céu".
   Mobile-first (360px). Alturas fixas na moldura (sem layout shift). Raio 22/14/9 como no site. */
@font-face{font-family:'Bricolage';src:url(../fonts/bricolage-var.woff2) format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'Figtree';src:url(../fonts/figtree-var.woff2) format('woff2');font-weight:300 900;font-display:swap}

:root{
  --navy-900:#061427;--navy-800:#0B2348;--navy-700:#12325F;--navy-600:#1B4478;
  --sky:#70AFEF;--sky-deep:#3F73B2;--sky-ink:#245C9A;
  --orange:#E58423;--orange-soft:#F2A85A;--orange-ink:#1a0d02;
  --olive:#8C9E72;--olive-soft:#B2C09A;--olive-ink:#4F5E3C;
  --paper:#EEF3F9;--paper-2:#E3EBF5;--surface:#FFFFFF;
  --ink:#0B2348;--ink-soft:#3C4A5E;--ink-mute:#6B7A90;
  --line:rgba(11,35,72,.12);--line-soft:rgba(11,35,72,.07);
  --star:#EAF1FA;--star-soft:#B8C7DA;--star-mute:#7F94AE;--line-dark:rgba(184,199,218,.14);
  --danger:#C8432B;--danger-soft:#FBEAE6;--warn:#B8731A;--warn-soft:#FBF1E2;--good:var(--olive-ink);--good-soft:#EEF2E6;
  --r-lg:22px;--r-md:14px;--r-sm:9px;
  --font-d:'Bricolage',system-ui,sans-serif;--font-b:'Figtree',system-ui,sans-serif;
  --top:60px;--bottom:64px;--side:248px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --shadow:0 10px 30px -18px rgba(11,35,72,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-b);font-size:15px;line-height:1.5;color:var(--ink);background:var(--paper);
  padding-top:var(--top);padding-bottom:calc(var(--bottom) + env(safe-area-inset-bottom))}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--sky-deep);outline-offset:2px}
h1,h2,h3{font-family:var(--font-d);line-height:1.08;letter-spacing:-.02em;font-weight:700}
h1{font-size:clamp(26px,6vw,34px);letter-spacing:-.03em;font-weight:800;overflow-wrap:anywhere}
h2{font-size:17px;margin-bottom:12px}
.sub{color:var(--ink-mute);font-size:13.5px;margin-bottom:16px}

/* ---------- atmosfera (moldura) ---------- */
.atm{background:
  radial-gradient(70% 90% at 100% 0%,rgba(63,115,178,.35),transparent 70%),
  radial-gradient(40% 40% at 0% 100%,rgba(229,132,35,.14),transparent 70%),
  linear-gradient(180deg,var(--navy-900),var(--navy-800));color:var(--star)}
.stars{position:absolute;inset:0;pointer-events:none;opacity:.6;background-image:
  radial-gradient(1px 1px at 12% 22%,#fff 50%,transparent 51%),
  radial-gradient(1px 1px at 33% 68%,#fff 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 57% 15%,#cfe4ff 50%,transparent 51%),
  radial-gradient(1px 1px at 72% 80%,#fff 50%,transparent 51%),
  radial-gradient(1px 1px at 88% 30%,#fff 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 44% 42%,#fff 50%,transparent 51%),
  radial-gradient(1px 1px at 22% 88%,#cfe4ff 50%,transparent 51%),
  radial-gradient(1px 1px at 65% 55%,#fff 50%,transparent 51%);
  background-size:520px 420px}

.top{position:fixed;top:0;left:0;right:0;height:var(--top);z-index:30;display:flex;align-items:center;gap:12px;padding:0 16px;overflow:hidden;isolation:isolate}
.top>*{position:relative;z-index:1}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--font-d);font-weight:700;font-size:17px;letter-spacing:-.01em;color:#fff;min-height:44px}
.brand img{width:26px;height:auto}
.brand small{font-family:var(--font-b);font-weight:500;font-size:12px;color:var(--star-soft);margin-left:2px}
.who{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--star-soft)}
.who .av{width:32px;height:32px;border-radius:50%;background:var(--navy-600);border:1px solid var(--line-dark);display:grid;place-items:center;font-family:var(--font-d);font-weight:700;font-size:12px;color:#fff}
.who a{min-height:44px;display:flex;align-items:center;color:var(--star-soft)}
.who a:hover{color:#fff}

.side{display:none}
.bottom{position:fixed;bottom:0;left:0;right:0;height:calc(var(--bottom) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);z-index:30;display:flex;border-top:1px solid var(--line-dark);overflow:hidden;isolation:isolate}
.bottom a{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11.5px;font-weight:500;color:var(--star-soft);min-height:44px}
.bottom a svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bottom a.on{color:#fff}
.bottom a.on svg{stroke:var(--sky)}

.page{max-width:920px;margin:0 auto;padding:18px 16px 24px}

@media(min-width:860px){
  body{padding-bottom:28px;padding-left:var(--side)}
  .bottom{display:none}
  .top{left:var(--side);padding-left:24px}
  .side{display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;width:var(--side);z-index:31;padding:18px 14px;overflow:hidden;isolation:isolate}
  .side>*{position:relative;z-index:1}
  .side .brand{padding:4px 10px 18px;font-size:19px}
  .side .brand img{width:34px}
  .side nav{display:flex;flex-direction:column;gap:4px}
  .side nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:var(--r-md);font-weight:500;font-size:14.5px;color:var(--star-soft);transition:background .2s,color .2s}
  .side nav a svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .side nav a:hover{background:rgba(234,241,250,.07);color:#fff}
  .side nav a.on{background:rgba(112,175,239,.16);color:#fff}
  .side nav a.on svg{stroke:var(--sky)}
  .side .foot{margin-top:auto;font-size:12px;color:var(--star-mute);padding:0 12px}
  .top .brand{display:none}
  .page{padding:28px 32px 40px}
}

/* ---------- blocos ---------- */
.card{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-lg);padding:18px;margin-bottom:14px;box-shadow:var(--shadow)}
.card.flat{box-shadow:none}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:600;background:var(--paper-2);color:var(--ink-soft);white-space:nowrap}
.chip.sky{background:#E1EEFB;color:var(--sky-ink)}
.chip.olive{background:var(--good-soft);color:var(--good)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.danger{background:var(--danger-soft);color:var(--danger)}
.chip.orange{background:#FDEEDC;color:#9A5410}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border:0;border-radius:999px;background:var(--navy-800);color:#fff;font-weight:600;font-size:15px;cursor:pointer;transition:transform .25s var(--ease),background .2s,box-shadow .2s;white-space:nowrap}
.btn:hover{transform:translateY(-1px);background:var(--navy-700)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.primary{background:var(--orange);color:var(--orange-ink);box-shadow:0 10px 24px -10px rgba(229,132,35,.7)}
.btn.primary:hover{background:var(--orange-soft)}
.btn.soft{background:#E1EEFB;color:var(--sky-ink)}
.btn.soft:hover{background:#D2E4F8}
.btn.ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--line)}
.btn.ghost:hover{background:var(--surface);border-color:var(--sky-deep);color:var(--ink)}
.btn.danger{background:var(--danger);color:#fff}
.btn.sm{min-height:38px;padding:0 14px;font-size:13.5px}
.btn.block{width:100%}

.in{width:100%;min-height:46px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);transition:border-color .2s,box-shadow .2s}
.in:focus{outline:none;border-color:var(--sky-deep);box-shadow:0 0 0 3px rgba(112,175,239,.3)}
textarea.in{min-height:170px;resize:vertical;line-height:1.55}
select.in{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%233C4A5E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
label.lb{display:block;font-size:13px;font-weight:600;color:var(--ink-soft);margin:14px 0 6px}
.check{display:flex;align-items:center;gap:10px;min-height:44px;font-size:14.5px;cursor:pointer}
.check input{width:20px;height:20px;accent-color:var(--sky-deep)}

/* ---------- filtros ---------- */
.filters{margin-bottom:16px}
.filters .search-row{display:flex;gap:8px}
.filters .search-row .in{flex:1}
.filters details{margin-top:10px}
.filters summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:40px;font-size:14px;font-weight:600;color:var(--sky-ink)}
.filters summary::-webkit-details-marker{display:none}
.filters summary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}
.filters details[open] summary svg{transform:rotate(180deg)}
.filters .more{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.filters .checks{display:flex;gap:18px;flex-wrap:wrap;grid-column:1/-1}
@media(min-width:860px){
  .filters details{margin-top:12px}
  .filters .more{grid-template-columns:repeat(4,1fr)}
}

/* ---------- lead ---------- */
.lead{display:block;background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-lg);padding:16px 18px;margin-bottom:10px;min-height:100px;transition:border-color .2s,transform .25s var(--ease)}
.lead:hover{border-color:var(--sky);transform:translateY(-1px)}
.lead .nm{font-family:var(--font-d);font-weight:700;font-size:16.5px;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lead .meta{font-size:13.5px;color:var(--ink-mute);margin:3px 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.score{margin-left:auto;font-family:var(--font-d);font-weight:800;font-size:15px;color:var(--sky-ink);flex-shrink:0}
.pager{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:18px 0}
.kv{display:grid;grid-template-columns:104px 1fr;gap:8px 14px;font-size:14.5px}
.kv dt{color:var(--ink-mute)}.kv dd{overflow-wrap:anywhere}
.kv a{color:var(--sky-ink);font-weight:500}

/* ---------- conversa ---------- */
.thread{display:flex;flex-direction:column;gap:12px}
.msg{max-width:92%;padding:12px 14px;border-radius:var(--r-lg);font-size:14.5px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}
.msg.out{align-self:flex-end;background:var(--navy-800);color:var(--star);border-bottom-right-radius:var(--r-sm)}
.msg.out .mh{color:var(--star-soft)}
.msg.in{align-self:flex-start;background:var(--paper);border:1px solid var(--line-soft);border-bottom-left-radius:var(--r-sm)}
.msg .mh{font-size:12px;color:var(--ink-mute);margin-bottom:5px;font-weight:600;white-space:normal}
.msg.bad{border:1px solid var(--danger)}

/* ---------- travas / saúde ---------- */
.guard{border-radius:var(--r-md);padding:11px 14px;font-size:13.5px;margin:12px 0;min-height:44px;display:flex;align-items:center;gap:8px}
.guard.ok{background:var(--good-soft);color:var(--good)}
.guard.no{background:var(--danger-soft);color:var(--danger)}
.ring{position:relative;width:64px;height:64px;flex-shrink:0}
.ring svg{width:64px;height:64px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:6;stroke-linecap:round}
.ring .bg{stroke:var(--paper-2)}
.ring .fg{stroke:var(--sky-deep);transition:stroke-dashoffset .6s var(--ease)}
.ring.full .fg{stroke:var(--danger)}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-d);font-weight:800;font-size:15px;letter-spacing:-.02em}
.ring b small{font-weight:600;font-size:10px;color:var(--ink-mute);margin-left:1px}
.meter{height:8px;border-radius:4px;background:var(--paper-2);overflow:hidden;margin-top:8px}
.meter i{display:block;height:100%;background:var(--sky-deep);border-radius:4px}
.meter.full i{background:var(--danger)}
.grid2{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:860px){.grid2{grid-template-columns:1fr 1fr}}
.big{font-family:var(--font-d);font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1}
.big small{font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--ink-mute);letter-spacing:0}

/* ---------- empty ---------- */
.empty{text-align:center;padding:40px 18px}
.empty .mark{width:52px;margin:0 auto 14px}
.empty .mark img{width:52px;height:auto}
.empty p{color:var(--ink-mute);font-size:14px;margin-top:4px}

/* ---------- páginas públicas (entrar, redefinir, sair) ---------- */
body.pub{padding:0;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate}
body.pub .stars{position:fixed;opacity:.55}
.pub-card{position:relative;color:var(--ink);width:100%;max-width:400px;margin:16px;background:var(--surface);border-radius:var(--r-lg);padding:30px 24px 26px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.pub-card .brand{color:var(--ink);margin-bottom:22px;min-height:0}
.pub-card .brand img{width:34px}
.pub-card h1{font-size:26px;margin-bottom:6px}
.pub-card .sub{margin-bottom:18px}
.pub-card .btn{margin-top:20px}
.pub-foot{position:fixed;bottom:16px;left:0;right:0;text-align:center;font-size:12px;color:var(--star-mute)}
.imp-bar{height:10px;border-radius:5px;background:var(--paper-2);overflow:hidden}
.imp-bar i{display:block;height:100%;background:var(--sky-deep);border-radius:5px;transition:width .4s var(--ease)}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}