/* ============================================================
   Sr. Bee Aprovei · visual profissional (Lavender Fog)
   Camada carregada depois do style.css: troca cores, fonte, vidro,
   menu recolhível, palco escuro do post e barra inferior no celular.
   ============================================================ */
@font-face{font-family:"SrBee Sans";src:url(fonts/inter-tight-latin-300-normal.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"SrBee Sans";src:url(fonts/inter-tight-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"SrBee Sans";src:url(fonts/inter-tight-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--ink:#2F2936;--plum:#584B63;--mid:#84758D;--soft:#B1A1B3;--mist:#D8CBD6;--paper:#F4EEF1;
  --violet:#584B63!important;--navy:#2F2936;--mute:#84758D;--line:rgba(88,75,99,.13);--ok:#4E7A62;--warn:#9A6A2E;--bad:#A8445C;--info:#5D6A8F;
  --glass:rgba(255,255,255,.42);--r:22px;--sans:"SrBee Sans","Helvetica Neue",Helvetica,Arial,sans-serif;--serif:var(--sans);
  --shadow:0 24px 60px -24px rgba(47,41,54,.28),0 2px 6px rgba(47,41,54,.04);--sidew:76px}
html{background:#F7F3F6}
body{font:300 15px/1.55 var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;letter-spacing:-.005em}
b,strong,h1,h2,h3,th{font-weight:500}
h1{font-weight:400;letter-spacing:-.03em;color:var(--ink)}h2,h3{font-weight:500;color:var(--ink)}
.serif,.h-title em,.xhero em,.d-title em,.pp-main em{font-family:var(--sans)!important;font-style:normal!important;font-weight:300!important;color:var(--mid)!important}
a{color:var(--plum)}
.muted,.mini{color:var(--mid)}
.eyebrow{font-weight:400;font-size:11px;letter-spacing:.16em;color:var(--mid)}
/* fundo de seda lilás → branco */
.bg{background:url(silk.svg) center/cover no-repeat,linear-gradient(160deg,#EFE8EE,#F7F3F6 45%,#fff)!important;filter:none}
/* vidro */
.card,.inner{background:rgba(255,255,255,.42);border:1px solid rgba(255,255,255,.82);border-radius:var(--r);backdrop-filter:blur(26px) saturate(160%);-webkit-backdrop-filter:blur(26px) saturate(160%);box-shadow:var(--shadow)}
.card.dark,.alertbox,.d-need,.onb-hero,.rep-card.dark{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,rgba(47,41,54,.94),rgba(88,75,99,.88))!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 24px 50px -24px rgba(47,41,54,.7)!important}
.card.dark .eyebrow,.alertbox .mini,.d-need .eyebrow,.onb-hero .eyebrow,.rep-card.dark .eyebrow,.rep-card.dark .mini{color:var(--mist)!important}
.card.dark h3,.d-need h3,.d-need b,.rep-card.dark h3{color:#fff}
.alertbox{display:flex;flex-direction:column;gap:6px;border-radius:18px;padding:16px 18px;margin:10px 0}
.alertbox b{color:#fff}.alertbox span{color:#EDE5EC;font-size:14px}.alertbox .btn{align-self:flex-start;margin-top:6px}
.tone-mist,.okbox,.notice{background:linear-gradient(160deg,rgba(216,203,214,.65),rgba(216,203,214,.38))!important;border:1px solid rgba(255,255,255,.75)!important;color:var(--ink)!important}
/* pontinhos de janela do Mac nos destaques */
.dots{display:flex;gap:7px;margin-bottom:10px}.dots i{width:10px;height:10px;border-radius:50%;display:block;background:#FF5F57}.dots i:nth-child(2){background:#FEBC2E}.dots i:nth-child(3){background:#28C840}
/* botões e etiquetas */
.btn{font:400 14.5px var(--sans);background:var(--plum)!important;color:#fff;box-shadow:0 10px 24px -12px rgba(88,75,99,.85)}
.btn:hover{background:var(--ink)!important}
.btn.ghost{background:rgba(255,255,255,.7)!important;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.btn.ghost:hover{background:#fff!important}
.btn.light{background:rgba(255,255,255,.92)!important;color:var(--ink)}
.btn.danger{background:rgba(255,255,255,.8)!important;color:var(--bad)}
.card.dark .btn.ghost,.alertbox .btn,.d-need .btn.ghost{background:rgba(255,255,255,.12)!important;color:#fff;border:1px solid rgba(255,255,255,.28)}
.pill{font-weight:400;font-size:12px;padding:3px 10px}
.pill.ok{background:rgba(78,122,98,.13);color:var(--ok)}.pill.warn{background:rgba(154,106,46,.13);color:var(--warn)}.pill.bad{background:rgba(168,68,92,.12);color:var(--bad)}
.pill.acc,.pill.info,.pill.lib{background:rgba(88,75,99,.11);color:var(--plum)}.pill.mute{background:rgba(132,117,141,.12);color:var(--mid)}.pill.navy{background:var(--ink);color:#fff}
.badge{background:var(--plum);font-weight:400}
label{font-weight:400;color:var(--ink)}
input,select,textarea{font:300 15px var(--sans);color:var(--ink);background:rgba(255,255,255,.72);border:1px solid rgba(88,75,99,.16);border-radius:14px}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(88,75,99,.25);outline-offset:1px;border-color:var(--soft)}
input[type=checkbox],input[type=radio]{accent-color:var(--plum)}
.tabs a,.seg a,.ctabs a{font-weight:400}
.tabs a.on,.seg a.on,.ctabs a.on{background:var(--ink)!important;color:#fff!important}
.ctabs a .ic{color:var(--plum)}
.kpi .v,.d-big,.h-nums b{font-weight:300!important;color:var(--ink)!important}
.kpi .l{font-weight:400}
.toast{background:rgba(47,41,54,.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-weight:300}
.ub{font-weight:400}.ub.u0{background:var(--ink)}.ub.u1{background:var(--plum)}.ub.u2{background:var(--mid)}.ub.u3{background:var(--mist);color:var(--ink)}
.chead{border-top:0}
.face{font-weight:400}
.av{background:linear-gradient(135deg,var(--plum),var(--soft));font-weight:400}
.over{font-weight:500}
th{color:var(--mid);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.ic{stroke-width:1.5}

/* ---------- menu lateral recolhível: abre ao passar o mouse ---------- */
.app{display:block;padding:16px 16px 16px calc(var(--sidew) + 32px)}
.side{position:fixed;left:16px;top:16px;bottom:16px;height:auto;width:var(--sidew);z-index:40;padding:16px 0;gap:0;border-radius:28px;overflow:hidden auto;scrollbar-width:none;
  background:linear-gradient(160deg,rgba(255,255,255,.55),rgba(216,203,214,.38));border:1px solid rgba(255,255,255,.75);
  backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 30px 70px -25px rgba(47,41,54,.35);transition:width .35s cubic-bezier(.2,.8,.2,1),background .3s}
.side::-webkit-scrollbar{display:none}
.side:hover,.side:focus-within{width:272px;background:linear-gradient(160deg,rgba(255,255,255,.34),rgba(216,203,214,.26))}
.side .brand{padding:0 18px 14px;margin:0 0 6px;border-bottom:1px solid var(--line);white-space:nowrap;gap:12px}
.side .brand img{width:40px;height:40px;flex:0 0 40px;object-fit:contain;border-radius:0}
.side .brand>div,.side .nl,.side .navgroup,.side .who>div,.side .navfoot>span{opacity:0;transition:opacity .2s}
.side:hover .brand>div,.side:hover .nl,.side:hover .navgroup,.side:hover .who>div,.side:hover .navfoot>span,
.side:focus-within .brand>div,.side:focus-within .nl,.side:focus-within .navgroup,.side:focus-within .who>div,.side:focus-within .navfoot>span{opacity:1}
.side .brand b{font-weight:500;font-size:14px}.side .brand span{color:var(--mid)}
.side .navgroup{padding:12px 28px 4px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mid);white-space:nowrap;height:30px;font-weight:400}
.side nav{gap:2px}
.side .nav{position:relative;justify-content:flex-start;gap:14px;height:44px;margin:0 10px;padding:0 18px;border-radius:14px;color:var(--mid);white-space:nowrap;font-weight:400;font-size:15px}
.side .nav .ic{width:20px;height:20px;flex:0 0 20px}
.side .nav::before{content:"";position:absolute;left:-10px;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--plum);transform:scaleY(0);transition:transform .25s}
.side .nav:hover,.side .nav.on{color:var(--ink);background:rgba(255,255,255,.58);box-shadow:none;font-weight:400}
.side .nav:hover::before,.side .nav.on::before{transform:scaleY(1)}
.side .nav .badge{position:absolute;left:32px;top:5px;min-width:17px;height:17px;padding:0 5px;font-size:10px;line-height:17px;text-align:center}
.side:hover .nav .badge,.side:focus-within .nav .badge{position:static;margin-left:auto;height:20px;line-height:20px;font-size:11px}
.side .navfoot{margin:8px 10px 0;border-radius:16px;white-space:nowrap}
.side .who{margin:auto 10px 0;padding:12px 8px 0;border-top:1px solid var(--line);white-space:nowrap}
.side .who .av{width:38px;height:38px;flex:0 0 38px}
.main{padding:14px 6px 70px}

/* ---------- celular: menu vira barra inferior de vidro ---------- */
@media (max-width:900px){
  .app{padding:12px 12px 96px}
  .side,.side:hover,.side:focus-within{position:fixed;left:10px;right:10px;top:auto;bottom:10px;width:auto;height:66px;padding:8px;border-radius:24px;flex-direction:row;overflow:hidden;
    background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(216,203,214,.45))}
  .side .brand,.side .navgroup,.side .who,.side .navfoot{display:none!important}
  .side nav{flex-direction:row;overflow-x:auto;gap:2px;width:100%;scrollbar-width:none}.side nav::-webkit-scrollbar{display:none}
  .side .nav{flex-direction:column;justify-content:center;gap:2px;height:50px;min-width:66px;margin:0;padding:0 8px;font-size:10.5px;border-radius:16px}
  .side .nl{opacity:1!important;max-width:74px;overflow:hidden;text-overflow:ellipsis}
  .side .nav::before{left:24px;right:24px;top:auto;bottom:-6px;width:auto;height:3px;transform:scaleX(0)}
  .side .nav.on::before{transform:scaleX(1)}
  .side .nav .badge,.side:hover .nav .badge{position:absolute;left:auto;right:10px;top:2px;margin:0;height:17px;line-height:17px;font-size:10px}
  .helpbtn{bottom:88px!important}.toast{bottom:92px}
  .fab{bottom:90px!important}
}

/* ---------- entrada / login: limpo, vidro ---------- */
.who-pick .wp-box,.loginbox,.solo>.card{background:rgba(255,255,255,.42);backdrop-filter:blur(28px) saturate(160%);-webkit-backdrop-filter:blur(28px) saturate(160%);border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow)}
.wp-opt{background:rgba(255,255,255,.55)!important;border:1px solid rgba(255,255,255,.85)!important;font-weight:300}
.wp-opt:hover{background:rgba(255,255,255,.8)!important}
.wp-opt b{font-weight:500}

/* ---------- saudação ---------- */
.d-greet{font-weight:300;color:var(--mid)}
.d-title{font-weight:300!important;letter-spacing:-.035em}
.d-hero{background:rgba(255,255,255,.42)!important}
.d-bee{filter:drop-shadow(0 14px 20px rgba(47,41,54,.25))}

/* ---------- personalização do cliente: sempre desfocada, sem cor, sob véu lilás ---------- */
.bg.cphoto{inset:-60px;background-size:cover!important;background-position:center!important;filter:blur(38px) saturate(.35);transform:scale(1.05)}
.bg.clogo{background-size:220px!important;background-repeat:repeat!important;filter:blur(14px) grayscale(1);opacity:.55}
.cveil{position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(160deg,rgba(244,238,241,.72),rgba(216,203,214,.56) 55%,rgba(177,161,179,.46))}

/* ---------- boas-vindas e relatórios ---------- */
.onb-start{display:flex;align-items:center;gap:18px;margin-bottom:18px;flex-wrap:wrap}.onb-start>div{flex:1;min-width:220px}.onb-start .dots{margin:0;align-self:flex-start}
.onb-hero{border-radius:24px;padding:26px 28px}.onb-hero p{font-size:20px;font-weight:300;line-height:1.45;margin:8px 0 0;color:#fff}
.onb-b p{margin:8px 0 0;white-space:normal}
.onb-link{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-top:8px;border-radius:14px;background:rgba(255,255,255,.6);text-decoration:none;color:var(--ink)}
.rep-items{display:grid;gap:8px;max-height:430px;overflow:auto;padding-right:4px}
.rep-it{display:flex;align-items:center;gap:12px;margin:0;padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.55);cursor:pointer;font-weight:300}
.rep-it b{display:block;font-weight:400}.rep-it .mini{display:block}
.rep-th{width:46px;height:56px;border-radius:10px;overflow:hidden;flex:0 0 46px;background:var(--mist);display:grid;place-items:center;font-size:10px;color:var(--mid)}.rep-th img{width:100%;height:100%;object-fit:cover}
.rep-card{border-radius:24px}
.daycols.kanban{grid-template-columns:repeat(8,minmax(210px,1fr))}

/* ---------- aprovação do post: palco escuro + moldura de vidro ---------- */
.stage{position:relative;overflow:hidden;border-radius:28px;padding:30px 18px;display:flex;align-items:center;justify-content:center;min-height:560px;
  background:url(stage.svg) center/cover no-repeat,#17131C}
.stage.cphoto{background:#17131C}
.stage .phimg{position:absolute;inset:-40px;background:var(--ph) center/cover;filter:grayscale(1) blur(16px) contrast(1.15)}
.stage .phblur{position:absolute;inset:0;background:linear-gradient(160deg,rgba(14,11,18,.88),rgba(33,27,40,.74) 50%,rgba(74,61,88,.62))}
.stage .phtint{position:absolute;inset:0;background:#584B63;mix-blend-mode:color;opacity:.9}
.stage>.igf{position:relative;z-index:2}
.igf{width:min(430px,100%);border-radius:26px;padding:14px;color:#fff;
  background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.55);
  backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 50px 100px -30px rgba(0,0,0,.75)}
.igf-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}.igf-h b{color:#fff;font-weight:500;font-size:14px}.igf-h small{display:block;color:var(--mist);font-size:12px}
.igf-h .face{border-color:rgba(255,255,255,.6)}
.igf-media{border-radius:14px;overflow:hidden;background:rgba(0,0,0,.25)}
.igf-media img,.igf-media video{display:block;width:100%;height:auto}
.igf .slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.igf .slides::-webkit-scrollbar{display:none}
.igf .slides>*{flex:0 0 100%;scroll-snap-align:center}
.igf-dots{display:flex;justify-content:center;gap:5px;margin:10px 0 2px}.igf-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}.igf-dots i.on{background:#fff}
.igf-cap{margin-top:10px;font-size:13.5px;line-height:1.5;color:#fff;max-height:150px;overflow:auto;white-space:pre-line}.igf-cap b{color:#fff}
.igf-when{display:block;margin-top:8px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.igf-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.14);color:#fff;font-size:18px;cursor:pointer;backdrop-filter:blur(10px)}
.stage-tag{position:absolute;left:20px;top:18px;z-index:3;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.78);color:var(--plum)}
.apv{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,1fr);gap:20px;align-items:start}
.apv-side{display:flex;flex-direction:column;gap:14px}
.step{border-radius:20px;padding:16px 18px}
.step-h{display:flex;align-items:center;gap:12px}.step-n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:0 0 30px;background:var(--mist);color:var(--ink);font-size:13px;font-weight:500}
.step.done .step-n{background:var(--plum);color:#fff}.step.lock{opacity:.6}
.step-h b{font-weight:500}.step-h .pill{margin-left:auto}
.step-a{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.step details{margin-top:10px}.step summary{cursor:pointer;color:var(--plum);font-size:14px}
.refuse{background:transparent!important;border:1px dashed rgba(88,75,99,.3)!important;box-shadow:none!important}
.chatbox{border-radius:22px}
@media (max-width:980px){.apv{grid-template-columns:1fr}.stage{min-height:0;padding:20px 10px;border-radius:22px}}

.d-need .d-big,.d-need b,.d-need p,.d-need .muted{color:#fff!important}.d-need .eyebrow{color:var(--mist)!important}
.side .nav .badge{max-width:26px;overflow:hidden;text-overflow:clip;white-space:nowrap}
.side:hover .nav .badge,.side:focus-within .nav .badge{max-width:none}
.side .navfoot{padding:12px 16px;gap:14px}.side .navfoot .ic{flex:0 0 20px}