/* Design round 2, picked by Thiago on 10 Nov 2026 (gtm/2026-11-10-gova-crm-design-round-2.html), copied from the shots:
   N2 is the look: a lilac-to-lime backdrop, one big rounded shell, white rounded cards with no borders or shadows,
   grey circles for icon buttons, pills for everything you press, large semibold figures, soft pill tags.
   N5 is the proposals board (a capsule per stage, cards that lead with the company and the amount).
   N6 is the tables (ruled rows and columns inside a card, small header icons, a boxed chevron to open a row).
   Dark keeps the same shapes on near-black. --lilac and --lime are N2's own; GOVA's indigo and lime sit close to them. */
:root{
  --lilac:#9b9bce;--lime:#cdf26f;--ink:#0d0d12;--soft:#4a4a57;--muted:#73737f;
  --shell:#f5f4fa;--card:#fff;--chip:#e9e8ef;--chip-2:#f0eff5;--rule:#ebeaf1;
  --t-lime:#e7f6c2;--t-lilac:#dcdcf0;--t-yellow:#f8f4bd;--t-rose:#fbdcd6;--on-rose:#8a2c1c;--late:#d2452d;--good:#19b44c;
  --back:linear-gradient(120deg,#9b9bce 0%,#a5a8c4 38%,#bcd493 72%,#cdf26f 100%);
  --font:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;color-scheme:light;
}
:root[data-theme=dark]{
  --ink:#f4f4f8;--soft:#c3c3cf;--muted:#8d8d9b;--shell:#15151b;--card:#1f1f27;--chip:#2b2b35;--chip-2:#25252e;--rule:#2c2c36;
  --t-lime:rgba(205,242,111,.16);--t-lilac:rgba(155,155,206,.24);--t-yellow:rgba(240,228,130,.16);--t-rose:rgba(240,120,100,.18);--on-rose:#f3a595;--late:#f08a75;--good:#7fe08f;
  --back:linear-gradient(120deg,#2e2e55 0%,#2a2c40 40%,#2f3a25 75%,#44531f 100%);color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font:400 15px/1.45 var(--font);color:var(--ink);background:var(--back) fixed;-webkit-font-smoothing:antialiased;font-feature-settings:'cv11' 1,'ss01' 1,'tnum' 1;letter-spacing:-.006em}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0;font-weight:400}
.muted{color:var(--muted)}.soft{color:var(--soft)}.right{text-align:right}.nowrap{white-space:nowrap}
.u{text-decoration:underline;text-decoration-color:var(--chip);text-underline-offset:4px}.u:hover{text-decoration-color:var(--ink)}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none;display:block}

/* the shell (N2) */
.app{margin:14px;min-height:calc(100vh - 28px);background:var(--shell);border-radius:40px;padding:26px 30px 34px 22px;display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:26px;row-gap:0;align-content:start}
.logo{width:46px;height:46px;background:var(--ink);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;align-self:center;justify-self:center}
.logo.word{-webkit-mask:none;mask:none;background:none;font-weight:700;font-size:20px;display:grid;place-items:center}
.top{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none}.top::-webkit-scrollbar{display:none}.top>*{flex:none}
.top .sp{flex:1 1 0}
.pill{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 20px;border-radius:999px;background:var(--chip);border:0;font-size:15px;color:var(--ink);cursor:pointer;white-space:nowrap}
.pill:hover{background:color-mix(in srgb,var(--chip) 82%,var(--ink))}
.pill.on{background:var(--lilac);color:#fff}
.pill.dark{background:var(--ink);color:var(--shell)}.pill.dark:hover{opacity:.86}
.pill.danger{background:var(--late);color:#fff}.pill.danger:hover{background:var(--late);opacity:.88}
:root[data-theme=dark] .pill.danger{color:#1a0a07}
.pill.sm{height:36px;padding:0 15px;font-size:14px;gap:8px}.pill.sm svg.i{width:16px;height:16px}
.pill.ghost{background:transparent;box-shadow:inset 0 0 0 1px var(--chip)}
.pill:disabled{opacity:.45;cursor:default}
.pill .n{min-width:20px;height:20px;border-radius:10px;background:var(--ink);color:var(--shell);font-size:11.5px;font-weight:600;display:inline-grid;place-items:center;padding:0 6px}
.pill.on .n{background:#fff;color:#0d0d12}
.circ{width:46px;height:46px;border-radius:50%;background:var(--chip);border:0;display:inline-grid;place-items:center;color:var(--soft);cursor:pointer;flex:none}
.circ:hover{color:var(--ink);background:color-mix(in srgb,var(--chip) 82%,var(--ink))}
.circ.sm{width:38px;height:38px}.circ.sm svg.i{width:17px;height:17px}
.circ.white{background:var(--card)}
.face{width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--shell);display:inline-grid;place-items:center;font-weight:600;font-size:15px;flex:none;border:0;cursor:pointer}.face:hover{opacity:.86}
.rail{display:flex;flex-direction:column;gap:12px;align-items:center;margin-top:150px;position:sticky;top:22px;align-self:start}
.rail .end{margin-top:22px}
.main{min-width:0;padding-top:44px}

/* page head (N2) */
.hello{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:26px}
.hello h1{font-size:54px;line-height:1.06;letter-spacing:-.032em}
.hello .lede{font-size:17px;color:var(--muted);margin-top:10px;max-width:780px}
.hello .lede b{color:var(--ink);font-weight:500}
.acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.crumb{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:14px;margin-bottom:14px}.crumb:hover{color:var(--ink)}

/* cards (N2) */
.cards{display:grid;gap:14px}
.c3{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1.05fr)}
.c2{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}
.c2e{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.c3e{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:var(--card);border-radius:32px;padding:26px 28px 28px;min-width:0;position:relative}
.card>header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.card>header>div{min-width:0}
.card h2{font-size:27px;line-height:1.15;letter-spacing:-.022em}
.card.tall{display:flex;flex-direction:column;overflow:hidden}
.stats{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;gap:24px}
.card header p{color:var(--muted);font-size:14.5px;margin-top:4px}
.big{font-size:76px;line-height:1;font-weight:500;letter-spacing:-.05em;white-space:nowrap}
.big.md{font-size:48px;font-weight:600;letter-spacing:-.045em}.big.sm{font-size:34px;letter-spacing:-.035em}
.withnote{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.withnote .aside{font-size:15px;line-height:1.35;padding-bottom:7px;color:var(--soft)}
.withnote .big:not(.md)+.aside{padding-bottom:12px;color:var(--ink)}
.up{color:var(--good)}.down{color:var(--late)}
.lbl{font-size:15px;margin-bottom:6px}
.prog{height:11px;border-radius:6px;background:var(--chip);overflow:hidden;margin-top:14px}.prog i{display:block;height:100%;border-radius:6px;background:var(--lilac)}.prog.lime i{background:var(--lime)}
.tag{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:999px;font-size:13.5px;white-space:nowrap;background:var(--t-lilac);color:var(--ink)}
.tag.lime{background:var(--t-lime)}.tag.yellow{background:var(--t-yellow)}.tag.rose{background:var(--t-rose);color:var(--on-rose)}.tag.grey{background:var(--chip)}
.tag.sm{height:25px;padding:0 10px;font-size:12.5px}
.tag i{width:7px;height:7px;border-radius:50%;margin-right:7px;display:block}
:root[data-theme=dark] .tag i,:root[data-theme=dark] .info i{box-shadow:0 0 0 1.5px rgba(255,255,255,.28)}
.info span{overflow:hidden;text-overflow:ellipsis}
.info{display:inline-flex;align-items:center;height:40px;padding:0 17px;border-radius:999px;background:var(--chip);font-size:14.5px;margin:0 6px 8px 0;border:0;color:var(--ink);cursor:pointer;white-space:nowrap;max-width:100%;overflow:hidden}
.info:hover{background:color-mix(in srgb,var(--chip) 82%,var(--ink))}
.info i{width:9px;height:9px;border-radius:50%;margin-right:9px;flex:none}.info svg.i{width:17px;height:17px;margin-right:8px}
.info.warn{background:var(--t-yellow)}.info.warn:hover{background:color-mix(in srgb,var(--t-yellow) 86%,var(--ink))}
.empty{color:var(--muted);padding:10px 0;font-size:15px}

/* the pill bars with dots (N2, "New leads"): they run to the card's edges and are cut by it, as in the shot */
.wave{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;min-height:216px;margin:10px -28px -28px;padding-bottom:8px}
.wave .w{flex:0 1 15px;min-width:8px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;transform:translateY(var(--y,0))}
.wave .w i{display:block;width:100%;aspect-ratio:1;border-radius:50%;background:var(--lilac);flex:none}
.wave .w b{display:block;width:100%;height:var(--h,40%);border-radius:8px;background:var(--lime);flex:none}
.wave .w.late b{background:var(--lilac)}.wave .w.late i{background:var(--lime)}
.wave .w:hover b{filter:brightness(.92)}

/* the block chart with its lilac strip (N2, "Comparison of won") */
.compare{display:grid;grid-template-columns:340px minmax(0,1fr) 78px;gap:28px;padding-right:0;overflow:hidden}
.compare .strip{background:var(--lilac);margin:-26px 0 -28px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 0}
.compare .strip .end{margin-top:auto}
.compare .chart{min-width:0;display:flex;flex-direction:column}
.compare .legend{justify-content:flex-end;margin:6px 0 18px}
.blocks{display:flex;align-items:flex-end;gap:5px;height:226px;margin-top:auto}
.blocks .col{flex:1;max-width:116px;min-width:0;height:100%;display:flex;flex-direction:column-reverse;gap:5px;border:0;background:none;padding:0;cursor:pointer}
.blocks .col i{display:block;height:calc((100% - 20px)/5);border-radius:10px;background:var(--lime)}
.blocks .col.alt i{background:var(--lilac)}
.blocks .col:hover i{filter:brightness(.93)}
.blocklbl{display:flex;gap:5px;margin-top:12px;color:var(--muted);font-size:13.5px}.blocklbl span{flex:1;max-width:116px;text-align:center;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legend{display:flex;gap:20px;font-size:14.5px;align-items:center}.legend i{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px;vertical-align:-1px}
.bars{display:flex;gap:5px;margin-top:18px}.bars i{display:block;width:10px;height:28px;border-radius:5px;background:var(--chip)}.bars i.on{background:var(--lilac)}

/* tables inside cards: the short list of N2 and the ruled table of N6 */
table{width:100%;border-collapse:collapse}
.list th{font-weight:400;font-size:13.5px;text-align:left;padding:8px 10px 10px 0;color:var(--ink)}
.list td{padding:9px 10px 9px 0;vertical-align:middle;font-size:14.5px}
.list th:last-child,.list td:last-child{padding-right:0}
.list td.grow{width:100%;max-width:0}
.who{display:flex;align-items:center;gap:11px;min-width:0}
.who .a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.who .a .muted{font-weight:400}
a.who:not([href]){cursor:default}.who .b{color:var(--muted);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who>div{min-width:0}
.av{width:34px;height:34px;border-radius:50%;background:var(--t-lilac);color:var(--ink);display:inline-grid;place-items:center;font-size:12.5px;font-weight:600;flex:none}
.av.l{background:var(--t-lime)}.av.y{background:var(--t-yellow)}
.av.sm{width:28px;height:28px;font-size:11px}
.av.xl{width:92px;height:92px;font-size:30px;font-weight:500;letter-spacing:-.02em}
.sq{width:32px;height:32px;border-radius:10px;display:inline-grid;place-items:center;font-size:12.5px;font-weight:700;color:#fff;flex:none}
.tick{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--muted);background:transparent;cursor:pointer;padding:0;display:block;flex:none}
.tick:hover{border-color:var(--good);background:var(--t-lime)}
.grid{background:var(--card);border-radius:28px;overflow-x:auto}
.cut{display:inline-block;max-width:270px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.grid table th{font-weight:400;font-size:14px;color:var(--muted);text-align:left;padding:15px 18px;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);white-space:nowrap}
.grid table th svg.i{display:inline-block;width:15px;height:15px;vertical-align:-2px;margin-right:7px}
.grid table td{padding:13px 18px;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);font-size:15px;vertical-align:middle}
.grid table th:last-child,.grid table td:last-child{border-right:0}
.grid table tr:last-child td{border-bottom:0}
.grid table tr.click{cursor:pointer}.grid table tr.click:hover td{background:var(--chip-2)}
.grid .a{font-weight:500}.grid .b{color:var(--muted);font-size:13.5px}
.chev{width:28px;height:28px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--rule);display:inline-grid;place-items:center;color:var(--soft)}.chev svg.i{width:14px;height:14px}
.gridfoot{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-top:1px solid var(--rule);color:var(--muted);font-size:14px}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.field{position:relative;display:inline-flex;align-items:center}
.field svg.i{position:absolute;left:16px;width:17px;height:17px;color:var(--muted);pointer-events:none}
.field input[type=search]{padding-left:44px}

/* fields */
input[type=text],input[type=email],input[type=password],input[type=date],input[type=search],select,textarea{width:100%;height:46px;padding:0 18px;border:0;border-radius:23px;background:var(--chip);font-size:15px}
.card input[type=text],.card select,.card textarea{background-color:var(--chip-2)}
textarea{height:auto;padding:13px 18px;border-radius:20px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:2px solid var(--lilac);outline-offset:1px}
input::placeholder,textarea::placeholder{color:var(--muted)}
select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' fill='none' stroke='%2384848f' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M1 1l4.500 4.500L10 1'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 17px center}
select.mini{height:32px;width:auto;font-size:13.5px;padding:0 32px 0 13px;border-radius:16px;background-position:right 12px center}
input[type=color]{width:100%;height:46px;border:0;border-radius:23px;background:var(--chip);padding:6px 10px}
input[type=checkbox]{width:18px;height:18px;accent-color:var(--lilac)}

/* board (N5) */
.board{display:grid;grid-template-columns:repeat(5,minmax(250px,1fr));gap:12px;overflow-x:auto;padding-bottom:4px}
.lanehead{display:flex;align-items:center;gap:10px;height:56px;padding:0 14px 0 16px;background:var(--card);border-radius:20px;margin-bottom:10px}
.lanehead .mark{width:6px;height:20px;border-radius:3px;background:var(--muted)}
.lanehead b{font-weight:600;font-size:16.5px;letter-spacing:-.015em;white-space:nowrap}
.lanehead .cnt{margin-left:auto;min-width:28px;height:28px;border-radius:9px;background:var(--chip);display:grid;place-items:center;font-size:13.5px;color:var(--soft);padding:0 8px}
.lanehead .sum{color:var(--muted);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.lanebody{background:color-mix(in srgb,var(--chip) 55%,transparent);border-radius:24px;padding:8px;min-height:260px}
.lanebody.over{outline:2px solid var(--lilac)}
.deal{background:var(--card);border-radius:18px;padding:16px 16px 14px;margin-bottom:8px;cursor:pointer;display:block}
.deal:last-child{margin-bottom:0}
.deal:hover{box-shadow:0 0 0 2px var(--chip)}
.deal.sel{box-shadow:0 0 0 2px var(--lilac)}
.deal .co{display:flex;align-items:center;gap:11px;font-weight:500;font-size:16px;letter-spacing:-.015em;min-width:0}
.deal .co span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.deal .amt{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:16px}
.deal .amt b{font-size:26px;font-weight:500;letter-spacing:-.04em;white-space:nowrap}
.deal .state{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;white-space:nowrap}
.deal .state svg.i{width:16px;height:16px}
.deal .state.late{color:var(--late)}.deal .state.none{color:var(--late)}.deal .state.ok{color:var(--soft)}
.deal .desc{color:var(--muted);font-size:14px;line-height:1.4;margin-top:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px}
.deal .row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px}
.ticks{display:flex;gap:3px;align-items:center}.ticks i{display:block;width:4px;height:17px;border-radius:2px;background:var(--chip)}.ticks i.on{background:var(--lilac)}
.date{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:15px;box-shadow:inset 0 0 0 1px var(--rule);font-size:13.5px;color:var(--soft);white-space:nowrap}.date svg.i{width:15px;height:15px;color:var(--muted)}
.deal .foot{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:13px;padding-top:12px;border-top:1px solid var(--rule);color:var(--muted);font-size:13.5px;white-space:nowrap}
.deal .foot span:first-child{overflow:hidden;text-overflow:ellipsis}

/* the proposal panel */
.drawer{position:fixed;top:14px;right:14px;bottom:14px;width:min(520px,calc(100vw - 28px));background:var(--card);border-radius:36px;z-index:20;transform:translateX(calc(100% + 30px));transition:transform .22s ease,visibility 0s .22s;visibility:hidden;display:flex;flex-direction:column;box-shadow:0 30px 80px -20px rgba(20,20,40,.35),0 0 0 1px var(--rule)}
.drawer.open{transform:none;visibility:visible;transition:transform .22s ease}
.dhead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:28px 28px 18px 32px}
.dhead h2{font-size:27px;line-height:1.15;letter-spacing:-.025em;margin-top:10px}
.dhead .side{display:flex;gap:8px;flex:none}
.dbody{flex:1;overflow:auto;padding:4px 32px 24px}
.dfoot{display:flex;gap:8px;flex-wrap:wrap;padding:16px 28px 26px 32px}
.kv{display:grid;grid-template-columns:minmax(96px,150px) minmax(0,1fr);gap:13px 14px;font-size:15px;align-items:center}
.kv>span{min-width:0;overflow-wrap:anywhere}
.kv>span:nth-child(odd){color:var(--muted)}
.seg{display:inline-flex;background:var(--chip);border-radius:999px;padding:4px;gap:2px;margin:26px 0 18px}
.seg button{height:36px;padding:0 17px;border:0;border-radius:18px;background:transparent;font-size:14.5px;color:var(--soft);cursor:pointer}
.seg button.on{background:var(--card);color:var(--ink);font-weight:500}
.card .seg,.drawer .seg{background:var(--chip-2)}.card .seg button.on,.drawer .seg button.on{background:var(--ink);color:var(--card)}
.note{display:flex;align-items:center;gap:8px;background:var(--chip-2);border-radius:26px;padding:6px 6px 6px 8px;margin-bottom:22px}
.note input{background-color:transparent!important;height:38px;padding:0 10px;min-width:0}.note input:focus{outline:0}
.note select{flex:none;background-color:var(--card)!important}
.note .send{width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--card);border:0;display:grid;place-items:center;cursor:pointer;flex:none}.note .send svg.i{width:17px;height:17px}
.day{color:var(--muted);font-size:13.5px;margin:0 0 14px}
.ev{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;padding-bottom:20px;position:relative}
.ev:not(:last-child)::before{content:"";position:absolute;left:19.5px;top:44px;bottom:4px;border-left:1.5px dotted var(--chip)}
.ev .ic{width:40px;height:40px;border-radius:50%;background:var(--t-lilac);display:grid;place-items:center}
.ev .ic svg.i{width:17px;height:17px}
.ev.ligacao .ic{background:var(--t-lime)}.ev.reuniao .ic{background:var(--t-yellow)}.ev.sys .ic{background:var(--chip)}
.ev .t{font-weight:500;font-size:15px}.ev .t span{color:var(--muted);font-weight:400;font-size:13.5px;margin-left:8px}
.ev p{color:var(--soft);margin-top:2px}
.ev.sys .t{font-weight:400;color:var(--muted)}
.todo{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:13px;align-items:center;padding:11px 0;border-bottom:1px solid var(--rule)}
.todo:first-child{padding-top:0}.todo:last-of-type{border-bottom:0}
.todo .side{display:flex;gap:8px;align-items:center}
/* The small button. It used to be bare grey text; Thiago, 10 Nov 2026: anything pressed looks like a button, as in the rest of the look. */
.linkb{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 13px;border:0;border-radius:15px;background:var(--chip);color:var(--ink);font-size:13.5px;line-height:1;cursor:pointer;white-space:nowrap;flex:none}
.linkb:hover{background:color-mix(in srgb,var(--chip) 82%,var(--ink))}
.linkb svg.i{width:15px;height:15px}
.linkb.danger{background:var(--t-rose);color:var(--on-rose)}.linkb.danger:hover{background:color-mix(in srgb,var(--t-rose) 84%,var(--late))}
.todo .side{flex-wrap:wrap;justify-content:flex-end}

.rowline{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--rule)}
.rowline:last-child{border-bottom:0}.rowline.click{cursor:pointer}.rowline.click:hover .a,.rowline button.main:hover b{text-decoration:underline;text-underline-offset:4px}
.rowline .main{flex:1 1 200px;min-width:0;text-align:left}
.rowline button.main{background:none;border:0;padding:0;cursor:pointer;display:grid;gap:2px}
.rowline button.main b{font-weight:500;overflow-wrap:anywhere}.rowline button.main i{font-style:normal;color:var(--muted);font-size:13.5px}
.rowline>b{font-weight:500}
/* the people found while writing a proposal */
.found{display:grid;gap:4px;margin-top:-6px;padding:6px;border-radius:20px;background:var(--card)}
.found p{padding:8px 10px;font-size:14px}.found[hidden]{display:none}
.linkb:disabled,.tick:disabled,.pill:disabled,.circ:disabled{opacity:.45;cursor:default}
:focus-visible{outline:2px solid var(--lilac);outline-offset:2px}

/* person */
.profile{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.profile .id{display:flex;gap:24px;align-items:center;min-width:0;flex:1 1 320px}.profile .id>div{min-width:0}.profile h1{overflow-wrap:anywhere}
.profile h1{font-size:40px;line-height:1.1;letter-spacing:-.03em}
.profile .role{color:var(--muted);margin:6px 0 12px;font-size:16px}
.tags{display:flex;gap:6px;flex-wrap:wrap}.tags .tag{max-width:100%;overflow:hidden}
.scroll{overflow-x:auto}
.stack{display:grid;gap:14px;align-content:start}
.subj .ctl{gap:6px}
.subj{display:flex;justify-content:space-between;align-items:center;gap:8px 10px;padding:9px 0;border-bottom:1px solid var(--rule);flex-wrap:wrap}.subj .tag{max-width:100%;overflow:hidden}
.subj:last-of-type{border-bottom:0}.subj .ctl{display:flex;gap:10px;align-items:center}
.next{font-size:19px;line-height:1.4;letter-spacing:-.015em}

/* the account menu, the bar for many people, small things of the second pass */
.menu{position:fixed;z-index:30;width:292px;background:var(--card);border-radius:26px;padding:10px;box-shadow:0 30px 80px -20px rgba(20,20,40,.35),0 0 0 1px var(--rule);display:grid;gap:2px}
.menu[hidden]{display:none}
.menu .me{display:grid;gap:1px;padding:10px 12px 12px;border-bottom:1px solid var(--rule);margin-bottom:6px}.menu .me b{font-weight:500;font-size:15.5px}.menu .me span{color:var(--muted);font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu button,.menu a{display:flex;align-items:center;gap:11px;height:42px;padding:0 12px;border:0;border-radius:14px;background:none;font-size:14.5px;cursor:pointer;text-align:left;color:var(--ink)}
.menu button:hover,.menu a:hover{background:var(--chip-2)}.menu svg.i{width:17px;height:17px;color:var(--soft)}
.bulk{position:sticky;bottom:18px;z-index:15;margin:16px auto 0;width:max-content;max-width:100%;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--ink);color:var(--shell);border-radius:30px;padding:8px 8px 8px 22px;box-shadow:0 24px 60px -18px rgba(20,20,40,.5)}
.bulk b{font-weight:500;white-space:nowrap}.bulk .sp{flex:1 1 12px}
.bulk .linkb{height:36px;padding:0 15px;border-radius:18px;font-size:14px;background:color-mix(in srgb,var(--shell) 16%,transparent);color:var(--shell)}.bulk .linkb:hover{background:color-mix(in srgb,var(--shell) 28%,transparent)}
.bulk .pill{background:color-mix(in srgb,var(--shell) 16%,transparent);color:var(--shell)}.bulk .pill:hover{background:color-mix(in srgb,var(--shell) 28%,transparent)}
.bulk .pill.danger{background:var(--late);color:#fff}.bulk .circ{background:color-mix(in srgb,var(--shell) 16%,transparent);color:var(--shell)}
.ckc{width:46px;padding-right:0!important;cursor:default}
input[type=checkbox]{cursor:pointer;flex:none}
.only-l{display:none}
.cardfoot{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--rule)}
.ev .t .linkb{float:right;opacity:0;transition:opacity .12s}.ev:hover .t .linkb,.ev .t .linkb:focus-visible{opacity:1}
@media(hover:none){.ev .t .linkb{opacity:1}}
.dfoot .sp{flex:1}
#toast button{margin-left:14px;background:none;border:0;color:var(--lime);font:inherit;font-weight:500;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:4px}
:root[data-theme=dark] #toast button{color:#4b6b12}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:9px;vertical-align:1px}
.stackbar{display:flex;gap:2px;height:8px;margin-top:8px;min-width:120px}.stackbar i{display:block;height:100%;border-radius:4px}
.months{display:flex;align-items:flex-end;gap:10px;height:240px;margin-top:8px}
.mo{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;align-items:center;gap:8px}
.mo .pair2{flex:1;display:flex;align-items:flex-end;justify-content:center;gap:4px;width:100%;border-radius:14px;background:var(--chip-2);padding:6px 4px}
.mo .pair2 b{display:block;width:min(22px,38%);border-radius:8px;background:var(--lilac);min-height:0}.mo .pair2 b.w{background:var(--lime)}
.mo span{font-size:13px;color:var(--muted)}
.reason{padding:12px 0;border-bottom:1px solid var(--rule)}.reason:last-child{border-bottom:0}.reason>div:first-child{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.reason b{font-weight:500}.reason span{color:var(--muted);font-size:13.5px;white-space:nowrap}
.deal{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.deal.ghost{position:fixed;z-index:60;pointer-events:none;margin:0;transform:rotate(2deg) scale(1.03);box-shadow:0 26px 60px -16px rgba(20,20,40,.5),0 0 0 2px var(--lilac);opacity:.96}
.deal.lift{opacity:.35}

/* the three kinds of access, side by side */
.roles3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px}
.roles3>div{background:var(--card);border-radius:20px;padding:14px 16px}
.roles3 b{font-weight:500;font-size:15.5px}.roles3 ul{margin:8px 0 0;padding-left:16px;color:var(--soft);font-size:13.5px;line-height:1.45}.roles3 li{margin:2px 0}
.roleseg{margin:0;background:var(--chip-2)}.roleseg button{height:32px;padding:0 13px;font-size:13.5px}
.sheet .roleseg button.on{background:var(--ink);color:var(--card);font-weight:500}
.form label .roleseg{justify-self:start;background:var(--card);padding:5px}.form label .roleseg button{height:36px}
/* a reader sees every page and none of the controls that change something; the server refuses them anyway */
[data-role=leitor] :is([data-new],[data-top-deal],[data-rail-person],[data-rail-task],[data-new-task],[data-new-deal],[data-new-person],.profile [data-deal],.profile [data-task],.drawer [data-task],[data-task2],[data-edit],[data-note],.tick,[data-done],[data-push],[data-del-task],[data-del-note],[data-step],[data-del-deal],[data-edit-company],[data-new-company],[data-subjects],.ckc,[data-unlink],[data-add],.strip a[href="#/importar"]){display:none!important}
[data-role=leitor] select:is([data-stage],[data-status]){pointer-events:none;background-image:none;padding-right:13px}
[data-role=leitor] .deal{cursor:pointer}

/* modal, toast, sign-in */
#modal{position:fixed;inset:0;background:rgba(18,18,30,.4);backdrop-filter:blur(6px);display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px;z-index:40;overflow:auto}
#modal[hidden],#toast[hidden]{display:none}
.sheet{background:var(--shell);border-radius:34px;padding:30px 32px 28px;width:100%;max-width:540px}
.sheet.wide{max-width:720px}
.sheethead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.sheethead .circ{background:var(--card)}
.sheet h4,.card h4{font-size:17px;font-weight:500;letter-spacing:-.01em;margin:0}
.sheet .note{background:var(--card)}.sheet .found{background:var(--card)}
.rows{display:grid;gap:6px}
.srow,.urow{display:flex;align-items:center;gap:10px;background:var(--card);border-radius:20px;padding:8px 14px 8px 8px;min-width:0;flex-wrap:wrap}
.srow input[type=color]{width:42px;height:36px;padding:3px;flex:none;background:none}
.srow input[type=text]{flex:1 1 200px;height:38px;min-width:0;background-color:var(--chip-2)}
.srow.off input[type=text]{color:var(--muted);text-decoration:line-through}.urow.off{opacity:.62}
.urow{padding:10px 14px}.urow .ctl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}.urow .main{flex:1 1 180px;min-width:0;display:grid}.urow .main b{font-weight:500}.urow .main i{font-style:normal;color:var(--muted);font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mailprev{margin:12px 0 0;padding:16px 18px;border-radius:20px;background:var(--card);font:400 13.5px/1.55 var(--font);white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto}
.mailprev[hidden]{display:none}
.res{margin-top:12px;display:grid;gap:2px;max-height:56vh;overflow:auto}.res h4{font-size:13px;color:var(--muted);font-weight:400;margin:12px 4px 4px}
.opt{display:flex;align-items:center;gap:10px;padding:7px 10px;border:0;border-radius:14px;background:none;cursor:pointer;text-align:left;min-width:0;width:100%}
.opt:hover,.opt:focus-visible{background:var(--card)}.found .opt:hover,.found .opt:focus-visible{background:var(--chip-2)}
.opt span:last-child{display:grid;min-width:0}.opt b{font-weight:500;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opt i{font-style:normal;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opt .av svg.i{width:14px;height:14px}
.sheet h3{font-size:30px;letter-spacing:-.03em;margin:0 0 20px}
.sheet input,.sheet select,.sheet textarea{background-color:var(--card)}
.sheet input:disabled{color:var(--muted)}
.form{display:grid;gap:14px}.form>*{min-width:0}.form label{display:grid;gap:7px;font-size:14px;color:var(--soft);min-width:0}.form input,.form select{min-width:0;max-width:100%}
.form label.plain{display:flex;align-items:center;gap:10px}
.form .pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form .actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
.err{color:var(--late);font-size:14px;min-height:20px}
#toast{position:fixed;bottom:34px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--shell);padding:13px 22px;border-radius:999px;z-index:50;font-size:14.5px;white-space:nowrap}
.login{margin:14px;min-height:calc(100vh - 28px);background:var(--shell);border-radius:40px;padding:26px 30px;display:grid;grid-template-rows:auto 1fr;gap:20px}
.login .mid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:14px;align-items:stretch}
.login .say{background:var(--lilac);color:#fff;border-radius:32px;padding:44px;display:flex;flex-direction:column;justify-content:space-between;min-height:520px}
.login .say h1{font-size:54px;line-height:1.04;letter-spacing:-.035em}
.login .say .logo{background:#fff;width:88px;height:88px;align-self:flex-start}
.login .in{background:var(--card);border-radius:32px;padding:44px;display:grid;align-content:center}
.login .in h2{font-size:34px;letter-spacing:-.03em;margin-bottom:6px}
.login .in form{margin-top:22px}
.login .in input{background-color:var(--chip-2)}
.map{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
progress{width:100%;height:11px;appearance:none;-webkit-appearance:none;border:0;border-radius:6px;overflow:hidden;background:var(--chip)}
progress::-webkit-progress-bar{background:var(--chip)}progress::-webkit-progress-value{background:var(--lime)}
.demo{color:var(--muted);font-size:13px;text-align:center;margin-top:26px}
.loading{margin:14px;min-height:calc(100vh - 28px);border-radius:40px;background:var(--shell);display:grid;place-items:center;color:var(--muted);font-size:16px}

@media(max-width:1380px){.hide-m{display:none}.top .only-wide{width:46px;padding:0;justify-content:center}.top .only-wide .t{display:none}}
@media(max-width:1060px){.top a.pill{padding:0 16px}.top a.pill>svg{display:none}.c2{grid-template-columns:minmax(0,1fr)}}
@media(max-width:1180px){.hide-l{display:none}.only-l{display:inline}.grid table th,.grid table td{padding-left:12px;padding-right:12px}.cut{max-width:185px}.grid .chevcol{display:none}.c3,.c3e{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.c3>*:nth-child(2){grid-column:1/-1;order:3}.c3e>*:first-child{grid-column:1/-1}.compare{grid-template-columns:280px minmax(0,1fr) 70px}.big{font-size:60px}.hello h1{font-size:44px}}
@media(max-width:820px){
  .app{margin:8px;border-radius:28px;padding:16px 14px 24px;grid-template-columns:minmax(0,1fr);min-height:calc(100vh - 16px)}
  .logo{justify-self:start;width:40px;height:40px;grid-row:1}.rail{display:none}
  .top{grid-row:2;overflow-x:auto;margin:14px -14px 0;padding:0 14px 4px}.top .sp{display:none}.top .only-wide{display:none}
  .main{padding-top:22px}.hello h1,.profile h1{font-size:32px}.hello .lede{font-size:15.5px}
  .c3,.c2,.c2e,.c3e{grid-template-columns:minmax(0,1fr)}.card{border-radius:26px;padding:22px 20px 24px}.big{font-size:48px}.big.md{font-size:38px}
  .compare{grid-template-columns:minmax(0,1fr);gap:18px;padding-right:20px}.compare .strip{display:none}.blocks{height:170px}.wave{margin:10px -20px -24px}.blocklbl{font-size:11.5px}
  .board{grid-template-columns:repeat(5,84vw)}.grid{overflow-x:auto}.grid table{min-width:720px}
  .drawer{top:8px;right:8px;bottom:8px;width:calc(100vw - 16px);border-radius:28px}.dhead,.dbody,.dfoot{padding-left:22px;padding-right:20px}
  .profile .id{gap:16px}.av.xl{width:64px;height:64px;font-size:22px}.map{grid-template-columns:1fr 1fr}
  .login{margin:8px;border-radius:28px;padding:16px}.login .mid{grid-template-columns:minmax(0,1fr)}.login .say{min-height:240px;padding:28px}.login .say h1{font-size:34px}.login .in{padding:28px}
  .hide-s,.hide-m,.hide-l{display:none}.roles3{grid-template-columns:minmax(0,1fr)}.form .pair{grid-template-columns:minmax(0,1fr)}.roleseg{max-width:100%}.roleseg button{padding:0 10px}.card>header{flex-wrap:wrap}.months{gap:4px;height:180px}.mo span{font-size:11px}.bulk{border-radius:24px;padding:12px;bottom:10px}.menu{width:min(292px,calc(100vw - 24px))}.rowline .main{flex-basis:100%}.profile .id{flex-direction:column;align-items:flex-start;gap:14px}.c3>*:nth-child(2){order:0}.rail{position:static}#toast{white-space:normal;text-align:center;width:calc(100vw - 40px)}
}