/* GERADO de docs/prototipo/ecosystem-forreal-prototipo.html por scripts/extrair-prototipo.mjs. Não editar à mão. */
@font-face{font-family:'TWK Lausanne';src:url(/eco/fonts/twk-lausanne-300.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'TWK Lausanne';src:url(/eco/fonts/twk-lausanne-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'TWK Lausanne';src:url(/eco/fonts/twk-lausanne-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'TWK Lausanne';src:url(/eco/fonts/twk-lausanne-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'RealDeal Grid';src:url(/eco/fonts/realdeal-grid-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}

/* Layout: sidebar de navegação + área de trabalho; cards claros sobre papel, um card graphite por tela para o que exige ação. */
:root{
  --paper:#F2F1EE; --surface:#FFFFFF; --ink:#20201E; --ink2:#4A4945; --muted:#8F897E;
  --hair:#DCDAD4; --soft:#E9E7E2; --verde:#69B7B9; --verde-ink:#3E8C8E; --cinza:#E5E5E5;
  --feat:#20201E; --feat-ink:#E5E5E5; --feat-muted:#A39E93; --feat-hair:#3A3935;
  --warn:#B7793A; --crit:#B4533F;
  --f-text:'TWK Lausanne',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --f-grid:'RealDeal Grid','TWK Lausanne',ui-monospace,monospace;
  --r:14px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#161614; --surface:#1F1F1D; --ink:#E9E7E2; --ink2:#C2BFB8; --muted:#A39E93;
  --hair:#34332F; --soft:#2A2926; --verde:#69B7B9; --verde-ink:#8FCBCD; --cinza:#2A2926;
  --feat:#2C2B28; --feat-ink:#EDEBE6; --feat-muted:#A39E93; --feat-hair:#45443F;
  --warn:#D39A5E; --crit:#D27A66; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#161614; --surface:#1F1F1D; --ink:#E9E7E2; --ink2:#C2BFB8; --muted:#A39E93;
  --hair:#34332F; --soft:#2A2926; --verde:#69B7B9; --verde-ink:#8FCBCD; --cinza:#2A2926;
  --feat:#2C2B28; --feat-ink:#EDEBE6; --feat-muted:#A39E93; --feat-hair:#45443F;
  --warn:#D39A5E; --crit:#D27A66; color-scheme:dark}

*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--f-text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--verde);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.eyebrow{font-family:var(--f-grid);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
h1,h2,h3{margin:0;text-wrap:balance;letter-spacing:-.02em}
h1{font-size:30px;font-weight:600;line-height:1.1}
h2{font-size:18px;font-weight:600}
h3{font-size:15px;font-weight:600}
p{margin:0}

/* shell */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100%}
.side{position:sticky;top:env(safe-area-inset-top,0px);height:100vh;padding:24px 18px;border-right:1px solid var(--hair);display:flex;flex-direction:column;gap:24px;background:var(--paper);overflow-y:auto}
.brand{display:flex;align-items:center;gap:12px}
.brand svg{width:34px;height:34px;flex:none}
.brand b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.1}
.brand span{font-size:11px;color:var(--muted)}
.nav{display:flex;flex-direction:column;gap:2px}
.nav button{display:flex;align-items:center;gap:12px;border:0;background:none;padding:9px 10px;border-radius:9px;text-align:left;color:var(--ink2);font-weight:500}
.nav button:hover{background:var(--soft);color:var(--ink)}
.nav button[aria-current="page"]{background:var(--ink);color:var(--paper)}
.nav .dotico{width:14px;height:14px;flex:none;display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.nav .dotico i{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.35}
.nav .dotico i.on{opacity:1}
.side .client{margin-top:auto;border-top:1px solid var(--hair);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.side .client b{font-size:13px}
.side .client small{color:var(--muted);font-size:12px}
.linkbtn{border:0;background:none;padding:0;color:var(--verde-ink);font-weight:500;font-size:12px;text-align:left}
.linkbtn:hover{text-decoration:underline}

.main{min-width:0;padding:28px clamp(16px,3.5vw,44px) 64px}
.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.topbar .t{display:flex;flex-direction:column;gap:8px;min-width:0}
.topbar .sub{color:var(--ink2);max-width:62ch}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--hair);border-radius:99px;padding:3px 10px;font-size:12px;color:var(--ink2);background:var(--surface);white-space:nowrap}
.pill.ex{border-style:dashed;color:var(--muted)}

/* cards */
.grid{display:grid;gap:16px}
.g-12{grid-template-columns:repeat(12,minmax(0,1fr))}
.c{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);padding:20px;min-width:0;display:flex;flex-direction:column;gap:14px}
.c.feat{background:var(--feat);color:var(--feat-ink);border-color:var(--feat)}
.c.feat .eyebrow{color:var(--feat-muted)}
.c.flat{background:transparent}
.span-12{grid-column:span 12}.grid.span-5{min-width:0}.span-8{grid-column:span 8}.span-7{grid-column:span 7}.span-6{grid-column:span 6}.span-5{grid-column:span 5}.span-4{grid-column:span 4}.span-3{grid-column:span 3}
.c-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.muted{color:var(--muted)}
.ink2{color:var(--ink2)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);border-radius:10px;padding:9px 16px;font-weight:500;font-size:13px;text-decoration:none;white-space:nowrap}
.btn:hover{opacity:.88}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--hair)}
.btn.ghost:hover{border-color:var(--ink)}
.c.feat .btn{background:var(--feat-ink);color:var(--feat);border-color:var(--feat-ink)}
.c.feat .btn.ghost{background:transparent;color:var(--feat-ink);border-color:var(--feat-hair)}

/* estado: latente → formação → ativo (marrom → graphite → verde) */
.st{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;white-space:nowrap}
.st::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--muted);opacity:.55}
.st.formacao::before{background:var(--ink);opacity:1}
.st.ativo::before{background:var(--verde);opacity:1}
.c.feat .st.formacao::before{background:var(--feat-ink)}
.mod{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;border-radius:99px;padding:2px 9px 2px 7px;border:1px solid var(--hair);white-space:nowrap;color:var(--ink2)}
.mod i{display:inline-flex;gap:2px}
.mod i b{width:5px;height:5px;border-radius:50%;background:var(--muted);opacity:.35}
.mod i b.on{background:var(--ink);opacity:1}
.mod.por i b.on{background:var(--verde)}
.mod.tbd{border-style:dashed;color:var(--muted)}
.c.feat .mod{border-color:var(--feat-hair);color:var(--feat-ink)}
.c.feat .mod i b.on{background:var(--feat-ink)}
.c.feat .mod.por i b.on{background:var(--verde)}

.bar{height:6px;border-radius:99px;background:var(--soft);overflow:hidden}
.bar > span{display:block;height:100%;background:var(--ink);border-radius:99px}
.bar.v > span{background:var(--verde)}
.c.feat .bar{background:var(--feat-hair)}
.c.feat .bar > span{background:var(--feat-ink)}

.navg{font-family:var(--f-grid);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:14px 10px 6px}
.navg:first-child{padding-top:0}
.nav .nl{flex:1}
.bdg{font-style:normal;font-size:11px;min-width:18px;height:18px;border-radius:99px;display:inline-grid;place-items:center;padding:0 5px;background:var(--soft);color:var(--ink2);font-variant-numeric:tabular-nums}
.bdg.crit{background:var(--crit);color:#fff}
.nav button[aria-current="page"] .bdg{background:var(--paper);color:var(--ink)}
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.tm{border:1px solid var(--hair);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.tm.on{border-color:var(--ink)}
.tm b{font-size:14px;font-weight:600}
.answer{margin-top:6px;border-left:2px solid var(--verde);padding:4px 0 4px 12px;display:flex;flex-direction:column;gap:3px;font-size:13px}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px;vertical-align:middle}
.evboard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.evn{display:flex;flex-direction:column;gap:6px;min-width:0}
.evn label{font-size:12px;color:var(--feat-muted);font-weight:500}
.evn .inp{background:transparent;border-color:var(--feat-hair);color:var(--feat-ink);font-size:24px;font-weight:600;padding:6px 10px;letter-spacing:-.02em}
.evn .inp:focus{border-color:var(--feat-ink)}
.evn span{font-size:12px;color:var(--feat-muted)}
.evrates{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.evrates > div{display:flex;flex-direction:column;gap:6px}
.evrates small{font-size:11.5px;color:var(--feat-muted)}
.rate{display:flex;flex-direction:column;gap:6px}
.rate .rv{font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1}
.up-eb{font-family:var(--f-text);font-weight:600;color:var(--verde-ink);letter-spacing:.08em}
.upwrap{display:flex;flex-direction:column;gap:14px;max-width:1240px}
.dropzone{border:1.5px dashed var(--hair);border-radius:16px;padding:44px 20px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;cursor:pointer;background:transparent;transition:background .15s,border-color .15s}
.dropzone:hover,.dropzone.over{border-color:var(--verde);background:color-mix(in srgb,var(--verde) 7%,transparent)}
.dropzone b{font-size:15px;font-weight:600;margin-top:4px}
.dropzone .muted{font-size:12.5px}
.dz-ico{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--verde) 16%,var(--surface));color:var(--ink)}
.pillbtn{border-radius:99px;padding:10px 22px;font-size:14px;margin-top:6px}
.sec-eb{margin-top:14px}
.folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.folder{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:18px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;min-height:140px;min-width:0}
.folder:hover{border-color:var(--ink)}
.folder b{font-size:14px;font-weight:600;line-height:1.25;flex:1}
.folder .muted{font-size:12px}
.folder .f-ico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--soft);color:var(--ink2);margin-bottom:6px}
.folder.on{background:color-mix(in srgb,var(--verde) 12%,var(--surface));border-color:var(--verde)}
.folder.on .f-ico{background:var(--verde-ink);color:var(--surface)}
.folder.add{border-style:dashed;background:transparent;align-items:center;justify-content:center;min-height:100px}
.folder.add b{flex:0}
.folder.new-on{border-color:var(--ink)}
.files{display:flex;flex-direction:column;gap:10px}
.file{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:14px 18px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center}
.fi-ico{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--verde) 12%,var(--surface));color:var(--ink2)}
.fi-nm{font-weight:500;font-size:15px;overflow-wrap:anywhere}
.fi-meta{font-size:12.5px;color:var(--ink2);margin-top:2px}
.fi-ph{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.fi-act{display:flex;gap:8px;align-items:center}
.iconbtn{min-width:38px;height:38px;border-radius:99px;border:1px solid var(--hair);background:var(--surface);display:grid;place-items:center;color:var(--ink2)}
.iconbtn:hover{border-color:var(--ink);color:var(--ink)}
.iconbtn.danger{border-color:var(--crit);color:var(--crit)}
.empty{border:1px dashed var(--hair);border-radius:14px;padding:28px;text-align:center;font-size:13px}
.reqs{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.req-list{display:flex;flex-direction:column}
.req{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--hair)}
.req:first-child{border-top:0}
.req .tt{font-weight:500;font-size:13.5px}
.req .ds{font-size:12px;color:var(--muted)}
@media (max-width:560px){.file{grid-template-columns:auto minmax(0,1fr)}.fi-act{grid-column:1/-1;justify-content:flex-end}.folders{grid-template-columns:1fr 1fr}}
.up-sec{font-family:var(--f-text);font-weight:600;letter-spacing:.08em;color:var(--ink2)}
.pill-lg{border-radius:99px;padding:11px 22px;font-size:14px}
.pill-md{border-radius:99px;padding:10px 22px;font-size:14px}
.pill-sm{border-radius:99px;padding:7px 14px;font-size:13px}
.admrow{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.fi-ico.gray{background:var(--soft)}
.fi-ico.sm{width:28px;height:28px;border-radius:7px}
.imgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.imcard{background:var(--feat);color:var(--feat-ink);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:18px;min-height:220px}
.imcard h3{font-size:18px}
.imcard p{font-size:13px;color:var(--feat-muted)}
.im-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.im-sym{color:var(--feat-ink);display:grid;place-items:center;min-height:40px}
.im-tag{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--verde);border:1px solid color-mix(in srgb,var(--verde) 55%,transparent);border-radius:99px;padding:3px 10px;white-space:nowrap}
.im-foot{margin-top:auto;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--feat-muted);border-top:1px solid var(--feat-hair);padding-top:12px}
.im-st{color:var(--feat-ink);font-weight:500}
.im-st.ok{color:var(--verde)}
.tabs{display:inline-flex;gap:4px;background:var(--soft);border-radius:14px;padding:5px;flex-wrap:wrap;align-self:flex-start;max-width:100%}
.tabs button{border:0;background:none;border-radius:10px;padding:8px 16px;font-size:13.5px;font-weight:500;color:var(--ink2)}
.tabs button[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.trow{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:14px 18px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center}
.trow:hover{border-color:var(--ink)}
.chk.big{width:22px;height:22px;border-radius:6px}
.chk.big:checked{background:var(--verde-ink);border-color:var(--verde-ink)}
.trow-main{border:0;background:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:2px;min-width:0}
.tr-t{font-weight:500;font-size:15px;display:flex;align-items:baseline;gap:9px}
.tr-t i{width:7px;height:7px;border-radius:50%;flex:none;transform:translateY(-2px)}
.tr-s{font-size:13px;color:var(--ink2);padding-left:16px}
.trow.done .tr-t{text-decoration:line-through;color:var(--muted)}
.tr-r{display:flex;align-items:center;gap:10px}
.tr-chat{font-size:11.5px;color:var(--muted)}
.av{width:30px;height:30px;border-radius:50%;background:var(--verde-ink);color:var(--surface);display:inline-grid;place-items:center;font-size:12px;font-weight:600;flex:none}
.av.sm{width:26px;height:26px;font-size:10.5px;background:var(--soft);color:var(--ink2)}
.linkish{border:0;background:none;padding:0;text-align:left}
.kanban{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.kcol{display:flex;flex-direction:column;gap:10px;background:var(--soft);border-radius:var(--r);padding:12px;min-height:60px}
.kcol-h{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 2px;font-size:13px;font-weight:600}
.kcard{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.kcard:hover{border-color:var(--ink)}
.kcard.done{opacity:.72}
.kcard.done .kc-t{text-decoration:line-through;color:var(--muted)}
.kc-row{display:flex;align-items:flex-start;gap:10px}
.kc-main{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.kc-top{display:flex;justify-content:space-between;align-items:center;gap:6px}
.kc-top i{width:7px;height:7px;border-radius:50%;flex:none}
.kc-t{font-weight:500;font-size:14px;line-height:1.3}
.kc-s{font-size:12px;color:var(--ink2)}
.kc-foot{display:flex;justify-content:space-between;align-items:center;gap:8px}
.kc-start{align-self:flex-start}
@media (max-width:860px){.kanban{grid-template-columns:1fr}}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.dcard{display:flex;gap:12px;align-items:flex-start;background:var(--soft);border-radius:12px;padding:12px 14px;text-decoration:none;color:inherit;border:1px solid transparent}
.dcard:hover{border-color:var(--verde)}
.dn{font-family:var(--f-grid);font-size:12.5px;color:var(--muted);flex:none;padding-top:2px}
.dcard b{font-size:14px;display:block;margin-bottom:3px}
.dcard p{font-size:12.5px;color:var(--ink2);margin:0;line-height:1.4}
.orbit-wrap{display:flex;flex-direction:column;align-items:center;gap:18px;padding:36px 16px 10px}
.orbit{position:relative;width:min(420px,100%);aspect-ratio:1/1}
.orbit-ring{position:absolute;left:50%;top:50%;width:86.8%;height:86.8%;border:3px dotted var(--verde);border-radius:50%;transform:translate(-50%,-50%);animation:orbit-spin 90s linear infinite}
@keyframes orbit-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.orbit-ring{animation:none}}
.orbit-photo{position:absolute;left:50%;top:50%;width:37%;aspect-ratio:1/1;border-radius:50%;transform:translate(-50%,-50%);border:4px solid var(--surface);box-shadow:0 2px 14px rgba(0,0,0,.14);object-fit:cover;background:var(--soft)}
.orbit-node{position:absolute;transform:translate(-50%,-50%);background:var(--surface);border-radius:99px;padding:10px 20px;font-weight:700;font-size:13.5px;box-shadow:0 2px 8px rgba(0,0,0,.08);white-space:nowrap;border:1px solid var(--hair);color:var(--ink);text-decoration:none}
.orbit-node:hover{border-color:var(--verde);color:var(--verde-ink)}
.orbit-welcome{text-align:center;font-size:21px;font-weight:700;letter-spacing:-.01em;max-width:520px}
@media (max-width:560px){.orbit-node{padding:7px 12px;font-size:11.5px}.orbit-welcome{font-size:17px}}
.tdrawer{gap:22px;width:min(500px,100%)}
.td-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;border-bottom:1px solid var(--hair);padding-bottom:18px;margin:0 -24px;padding-left:24px;padding-right:24px}
.td-head h2{font-size:21px;line-height:1.2}
.td-title{font-size:20px;font-weight:600;border-color:transparent;padding:4px 6px;margin-left:-6px}
.td-title:hover{border-color:var(--hair)}
.x.round{border-radius:50%;width:36px;height:36px}
.lbl{font-size:11.5px!important;font-weight:600!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)!important}
.respbox{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--hair);border-radius:10px;padding:6px 8px 6px 10px;align-self:flex-start;max-width:100%}
.inp.bare{border:0;padding:4px 2px;font-size:15px;font-weight:500;background:transparent;min-width:0}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pl{border:1px solid var(--hair);background:var(--surface);border-radius:99px;padding:6px 16px;font-size:13.5px;font-weight:500}
.pl:hover{border-color:var(--ink)}
.pl[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pl.pl-alta[aria-pressed="true"]{background:var(--crit);border-color:var(--crit);color:#fff}
.tdocs{display:flex;flex-direction:column;gap:6px}
.tdocs > div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px}
.chat{border:1px solid var(--hair);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.msgs{padding:14px;display:flex;flex-direction:column;gap:10px;max-height:320px;overflow-y:auto;background:var(--paper)}
.msg{max-width:82%;padding:11px 15px;border-radius:14px;font-size:13.5px;line-height:1.45}
.msg.them{background:var(--soft);align-self:flex-start;border-top-left-radius:4px}
.msg.me{background:var(--verde-ink);color:#fff;align-self:flex-end;border-top-right-radius:4px;font-weight:500}
.mfrom{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:3px}
.chat-in{display:flex;gap:10px;padding:10px;border-top:1px solid var(--hair);background:var(--surface)}
.chat-in .inp{border-radius:99px;padding:10px 16px}
.sendbtn{width:42px;height:42px;border-radius:50%;border:0;background:var(--verde-ink);color:#fff;display:grid;place-items:center;flex:none}
.sendbtn:hover{opacity:.88}
@media (max-width:560px){.trow{grid-template-columns:auto minmax(0,1fr)}.tr-r{grid-column:2}.imgrid{grid-template-columns:1fr}}
.chatapp{display:grid;grid-template-columns:280px minmax(0,1fr);background:var(--surface);border:1px solid var(--hair);border-radius:16px;overflow:hidden;min-height:560px;max-width:1540px}
.convs{border-right:1px solid var(--hair);padding:14px;display:flex;flex-direction:column;gap:4px}
.conv{border:0;background:none;border-radius:12px;padding:12px;display:flex;gap:12px;align-items:center;text-align:left;width:100%}
.conv:hover{background:var(--soft)}
.conv.on{background:color-mix(in srgb,var(--verde) 12%,var(--surface))}
.conv b{font-size:14px;font-weight:600;display:flex;align-items:center}
.cv-last{font-size:12.5px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.av.lg{width:40px;height:40px;font-size:13.5px}
.av.alt{background:var(--muted);color:var(--surface)}
.convmain{display:flex;flex-direction:column;min-width:0}
.convhead{display:flex;align-items:center;gap:12px;padding:16px 22px;border-bottom:1px solid var(--hair)}
.convhead b{display:block;font-size:15px;font-weight:600}
.online{font-size:12.5px;color:var(--verde-ink)}
.convmsgs{flex:1;padding:22px;display:flex;flex-direction:column;gap:14px;overflow-y:auto;max-height:520px;min-height:360px}
.cm{display:flex;flex-direction:column;gap:6px;max-width:75%}
.cm.them{align-self:flex-start}
.cm.me{align-self:flex-end;align-items:flex-end}
.bub{padding:12px 16px;border-radius:14px;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.cm.them .bub{background:var(--soft)}
.cm.me .bub{background:var(--verde-ink);color:#fff;font-weight:500}
.ct{font-size:11px;color:var(--muted)}
.daysep{align-self:center;font-size:11.5px;color:var(--muted);border:1px solid var(--hair);border-radius:99px;padding:2px 10px}
.convin{display:flex;gap:12px;padding:14px 16px;border-top:1px solid var(--hair)}
.convin .inp{border-radius:99px;padding:11px 18px;background:var(--paper)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.vcard{border:1px solid var(--hair);background:var(--surface);border-radius:16px;padding:0;overflow:hidden;text-align:left;display:flex;flex-direction:column}
.vcard:hover{border-color:var(--ink)}
.vcard:hover .play{background:color-mix(in srgb,var(--verde) 45%,transparent)}
.thumb{position:relative;aspect-ratio:16/6.3;background:linear-gradient(135deg,#1C1C1A,#34322D);display:grid;place-items:center;width:100%}
.thumb.big{aspect-ratio:16/8}
.play{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--verde);color:var(--verde);display:grid;place-items:center;background:color-mix(in srgb,var(--verde) 18%,transparent);transition:background .15s}
.play.lg{width:72px;height:72px}
.dur{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.72);color:#fff;font-size:11.5px;font-weight:600;border-radius:6px;padding:2px 7px}
.seen{position:absolute;left:10px;bottom:10px;background:var(--verde);color:#16302f;font-size:11px;font-weight:600;border-radius:6px;padding:2px 8px}
.vbody{padding:16px 18px 18px;display:flex;flex-direction:column;gap:4px}
.vbody b{font-size:15px;font-weight:600;line-height:1.25}
.vbody span{font-size:13px;color:var(--ink2)}
@media (max-width:760px){.chatapp{grid-template-columns:minmax(0,1fr)}.convs{border-right:0;border-bottom:1px solid var(--hair);flex-direction:row;overflow-x:auto}.conv{min-width:220px}.cm{max-width:88%}}
/* painel */
.hero-next{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end}
.hero-next h2{font-size:24px;line-height:1.15;font-weight:600;margin-top:6px}
.meta-row{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--feat-muted);font-size:13px}
.meta-row b{color:var(--feat-ink);font-weight:500}
.subs-mini{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.subs-mini div{display:flex;gap:10px;align-items:center;font-size:13px}
.subs-mini .ck{width:14px;height:14px;border-radius:4px;border:1px solid var(--feat-hair);flex:none;display:grid;place-items:center}
.subs-mini .ck.on{background:var(--verde);border-color:var(--verde)}
.subs-mini .ck.on::after{content:"";width:6px;height:3px;border-left:1.5px solid var(--feat);border-bottom:1.5px solid var(--feat);transform:rotate(-45deg) translate(1px,-1px)}
.subs-mini .done{color:var(--feat-muted);text-decoration:line-through}

.matrix{display:grid;grid-template-columns:repeat(6,1fr);gap:0;aspect-ratio:1;max-width:100%}
.matrix .cell{display:grid;place-items:center;border:0;background:none;padding:0;position:relative}
.matrix .cell i{display:block;border-radius:50%;background:var(--muted);opacity:.4;width:36%;aspect-ratio:1;transition:transform .2s}
.matrix .cell.formacao i{background:var(--ink);opacity:1;width:44%}
.matrix .cell.ativo i{background:var(--ink);opacity:1;width:56%}
.matrix .cell.ativo.core i{background:var(--verde)}
.matrix .cell:hover i{transform:scale(1.18)}
.matrix-wrap{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:22px;align-items:center}
.score{font-size:44px;font-weight:600;letter-spacing:-.03em;line-height:1}
.score small{font-size:18px;color:var(--muted);font-weight:400}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--ink2)}

.phases{display:grid;grid-template-columns:4fr 3fr 5fr;gap:6px}
.phase{display:flex;flex-direction:column;gap:8px;min-width:0}
.phase .bar{height:8px}
.phase small{font-size:12px;color:var(--muted)}
.phase b{font-size:13px;font-weight:600}
.months{display:grid;grid-template-columns:repeat(12,1fr);margin-top:4px}
.months span{font-size:10.5px;color:var(--muted);text-align:center;font-family:var(--f-grid);letter-spacing:.05em}
.months span.now{color:var(--ink);font-weight:600}
.months span.now::after{content:"";display:block;width:5px;height:5px;border-radius:50%;background:var(--verde);margin:3px auto 0}

.kpi{display:flex;flex-direction:column;gap:6px}
.kpi .v{font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.kpi .d{font-size:12px;color:var(--ink2)}
.kpi .d.low{color:var(--warn)}
.spark{width:100%;height:36px;display:block}

.list{display:flex;flex-direction:column}
.li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--hair)}
.li:first-child{border-top:0;padding-top:2px}
.li .when{font-family:var(--f-grid);font-size:11px;letter-spacing:.06em;color:var(--muted);min-width:44px}
.li .tt{font-weight:500;font-size:13.5px}
.li .ds{font-size:12px;color:var(--muted)}
.li .tag{font-size:11.5px;color:var(--ink2)}
.li .tag.late{color:var(--crit)}
.chk{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1.5px solid var(--hair);border-radius:5px;margin:0;display:grid;place-items:center;background:var(--surface);flex:none}
.chk:hover{border-color:var(--ink)}
.chk:checked{background:var(--verde);border-color:var(--verde)}
.chk:checked::after{content:"";width:8px;height:4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.rem{display:grid;grid-template-columns:4px minmax(0,1fr);gap:12px;padding:10px 0;border-top:1px solid var(--hair)}
.rem:first-child{border-top:0;padding-top:0}
.rem::before{content:"";border-radius:4px;background:var(--muted);opacity:.5}
.rem.warn::before{background:var(--warn);opacity:1}
.rem.crit::before{background:var(--crit);opacity:1}
.rem.ok::before{background:var(--verde);opacity:1}
.rem b{font-weight:500;font-size:13.5px;display:block}
.rem span{font-size:12.5px;color:var(--ink2)}

/* travessia */
.filters{display:flex;gap:6px;flex-wrap:wrap}
.chipbtn{border:1px solid var(--hair);background:var(--surface);border-radius:99px;padding:5px 12px;font-size:12.5px;color:var(--ink2)}
.chipbtn[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.col{display:flex;flex-direction:column;gap:10px;min-width:0}
.col-head{padding:4px 2px 8px;display:flex;flex-direction:column;gap:6px;border-bottom:1px solid var(--hair);margin-bottom:4px}
.col-head h2{font-size:17px}
.col-head p{font-size:12.5px;color:var(--ink2)}
.ent{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;text-align:left;width:100%}
.ent:hover{border-color:var(--ink)}
.ent.ativo{background:transparent}
.ent .top{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}
.ent h3{font-size:14px;line-height:1.3}
.ent .foot{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.ent.is-next{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}

/* drawer & modal */
.scrim{position:fixed;inset:0;background:rgba(20,20,18,.42);z-index:40;display:flex;justify-content:flex-end}
.drawer{width:min(520px,100%);height:100%;background:var(--surface);padding:calc(24px + env(safe-area-inset-top,0px)) 24px calc(24px + env(safe-area-inset-bottom,0px));overflow-y:auto;display:flex;flex-direction:column;gap:20px;border-left:1px solid var(--hair)}
.modal-scrim{position:fixed;inset:0;background:rgba(20,20,18,.42);z-index:50;display:grid;place-items:center;padding:16px}
.modal{width:min(560px,100%);max-height:90vh;overflow:auto;background:var(--surface);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:16px;border:1px solid var(--hair)}
.x{border:1px solid var(--hair);background:none;border-radius:8px;width:32px;height:32px;display:grid;place-items:center;flex:none}
.x:hover{border-color:var(--ink)}
.seg{display:inline-grid;grid-auto-flow:column;border:1px solid var(--hair);border-radius:10px;padding:3px;gap:3px}
.seg button{border:0;background:none;border-radius:7px;padding:6px 12px;font-size:12.5px;display:flex;align-items:center;gap:6px}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.seg button[aria-pressed="true"] .st::before{background:currentColor;opacity:1}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-size:12px;color:var(--ink2);font-weight:500}
.inp{width:100%;border:1px solid var(--hair);background:var(--surface);border-radius:9px;padding:9px 11px;font-size:13.5px}
.inp:focus{outline:none;border-color:var(--ink)}
textarea.inp{min-height:90px;resize:vertical;line-height:1.5}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.subrow{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--hair)}
.subrow:first-child{border-top:0}
.subrow label{font-size:13.5px;cursor:pointer}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:8px 14px;font-size:13px}
.kv dt{color:var(--muted)}
.kv dd{margin:0}
.blocks{display:flex;flex-wrap:wrap;gap:6px}
.blocks span{font-size:12px;border:1px solid var(--hair);border-radius:8px;padding:3px 9px;color:var(--ink2)}

/* ecossistema */
.pillar{display:grid;grid-template-columns:130px minmax(0,1fr) 44px;gap:12px;align-items:center;padding:8px 0;border-top:1px solid var(--hair)}
.pillar:first-child{border-top:0}
.pillar b{font-size:13px;font-weight:600}
.pillar .pp{font-size:12.5px;text-align:right}
.matrix-big{display:grid;grid-template-columns:110px repeat(6,minmax(0,1fr));gap:0;align-items:center;max-width:520px;width:100%}
.matrix-big .rl{font-size:12px;color:var(--ink2);font-weight:500;padding-right:8px}
.matrix-big .cell{aspect-ratio:1;display:grid;place-items:center;border:0;background:none;padding:0}
.matrix-big .cell i{display:block;border-radius:50%;background:var(--muted);opacity:.4;width:30%;aspect-ratio:1}
.matrix-big .cell.formacao i{background:var(--ink);opacity:1;width:40%}
.matrix-big .cell.ativo i{background:var(--ink);opacity:1;width:52%}
.matrix-big .cell.ativo.core i{background:var(--verde)}
.matrix-big .cell:hover i{outline:1px solid var(--ink);outline-offset:4px}
.cell-tip{min-height:48px;font-size:13px;color:var(--ink2);border-top:1px solid var(--hair);padding-top:12px}
.cell-tip b{color:var(--ink)}

.ladder{display:flex;flex-direction:column;gap:0}
.step{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--hair)}
.step:first-child{border-top:0}
.step .lv{display:flex;flex-direction:column;align-items:center;gap:3px}
.step .lv i{width:6px;height:6px;border-radius:50%;background:var(--muted);opacity:.3}
.step .lv i.on{background:var(--ink);opacity:1}
.step .nm{font-weight:500}
.step .tp{font-size:12px;color:var(--muted)}
.step .tk{text-align:right;font-size:13px}
.step .tk b{display:block;font-weight:600;font-size:14px}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th{font-weight:500;color:var(--muted);text-align:left;font-size:12px;padding:8px 10px;border-bottom:1px solid var(--hair);white-space:nowrap}
td{padding:6px 10px;border-bottom:1px solid var(--hair);vertical-align:middle}
td .inp{padding:6px 8px;font-size:13px;min-width:90px}
td.r,th.r{text-align:right}
.rowdel{border:0;background:none;color:var(--muted);font-size:18px;line-height:1;padding:4px 8px;border-radius:6px}
.rowdel:hover{color:var(--crit);background:var(--soft)}

/* evento */
.countdown{display:flex;align-items:baseline;gap:10px}
.countdown .n{font-size:56px;font-weight:600;letter-spacing:-.04em;line-height:1}
.funnel{display:flex;flex-direction:column;gap:10px}
.fstep{display:grid;grid-template-columns:120px minmax(0,1fr) 110px;gap:12px;align-items:center;font-size:13px}
.fstep .track{height:26px;background:var(--soft);border-radius:6px;position:relative;overflow:hidden}
.fstep .track span{position:absolute;inset:0 auto 0 0;background:var(--ink);border-radius:6px}
.fstep .track em{position:absolute;top:0;bottom:0;width:2px;background:var(--verde)}
.fstep .r{text-align:right}

/* mesas */
.steps5{display:flex;flex-direction:column;gap:18px}
.s5{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px}
.s5 .n{font-family:var(--f-grid);font-size:12px;color:var(--muted);padding-top:3px}
.drop{border:1px dashed var(--hair);border-radius:10px;padding:14px;font-size:12.5px;color:var(--muted);text-align:center}
.status-tag{font-size:11.5px;border-radius:6px;padding:2px 8px;border:1px solid var(--hair);white-space:nowrap}
.status-tag.ok{border-color:var(--verde);color:var(--verde-ink)}

/* charts */
.chart{width:100%;display:block}
.chart text{fill:var(--muted);font-size:10.5px;font-family:var(--f-text)}
.chart .gl{stroke:var(--hair);stroke-width:1}
.chart .real{fill:var(--ink)}
.chart .meta{fill:none;stroke:var(--muted);stroke-width:1.2;stroke-dasharray:3 3}
.chart .metab{fill:var(--soft)}
.chart .hl{fill:var(--verde)}
.chart .ln{fill:none;stroke:var(--ink);stroke-width:2}
.chart .ar{fill:var(--ink);opacity:.07}
.chart .pt{fill:var(--verde)}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:10px;font-size:13px;z-index:60}

@media (max-width:1100px){
  .span-8,.span-7,.span-6,.span-5,.span-4{grid-column:span 12}
  .span-3{grid-column:span 6}
  .cols{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:820px){
  .app{grid-template-columns:minmax(0,1fr)}
  .side{position:sticky;top:env(safe-area-inset-top,0px);height:auto;z-index:20;flex-direction:row;align-items:center;padding:10px 16px;gap:14px;border-right:0;border-bottom:1px solid var(--hair);overflow-x:auto}
  .brand span,.side .client{display:none}
  .brand b{white-space:nowrap}
  .nav{flex-direction:row}
  .nav button{padding:7px 10px;white-space:nowrap}
  .nav .dotico,.navg{display:none}
  h1{font-size:24px}
  .hero-next{grid-template-columns:minmax(0,1fr)}
  .matrix-wrap{grid-template-columns:minmax(0,1fr)}
  .matrix-wrap .matrix{max-width:200px}
  .fgrid{grid-template-columns:minmax(0,1fr)}
  .fstep{grid-template-columns:84px minmax(0,1fr) 80px}
  .matrix-big{grid-template-columns:78px repeat(6,minmax(0,1fr))}
  .pillar{grid-template-columns:100px minmax(0,1fr) 40px}
}
@media (max-width:480px){ .span-3{grid-column:span 12} .countdown .n{font-size:44px} }
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

*{box-sizing:border-box}body{margin:0}img{max-width:100%}[hidden]{display:none!important}