/* CACTUS OPERAÇÃO v8: ajustes de estilo (o app.css do artefato fica intacto)
   Espaço do cliente no computador: o artefato escondia o menu lateral, mas a grade
   continuava reservando a coluna dele (248px) e o conteúdo ficava espremido nela. */
@media (min-width:960px){
  body.portal-mode .app{grid-template-columns:minmax(0,1fr)}
}

/* arquivos das peças no Drive (ajustes/83) */
.drv-alvo{position:relative; border-radius:12px; transition:box-shadow .15s, background-color .15s}
.drv-alvo.drv-sobre{box-shadow:0 0 0 2px var(--brand, #1B7A5A) inset; background:color-mix(in srgb, var(--brand, #1B7A5A) 8%, transparent)}
.drv-alvo.busy{opacity:.75}
.drv-ico{width:16px; height:16px; vertical-align:-3px; margin-right:6px; flex:0 0 auto}
.drv-falta{display:grid; place-items:center; color:var(--ink-3); background:var(--track)}

/* avaliação do cliente: 1 a 5 estrelas (ajustes/84) */
.av84{display:grid; gap:6px; padding:10px 12px; border-top:1px solid var(--line)}
.av84-t{color:var(--ink-2); font-weight:600}
.av84-st{display:flex; gap:2px}
.av84-e{appearance:none; border:0; background:none; padding:2px; font-size:26px; line-height:1; color:var(--line-2, #c9c5b5); cursor:pointer; transition:transform .1s, color .1s}
.av84-e.on{color:#F5B301}
.av84-e:not(:disabled):hover{transform:scale(1.15)}
.av84-e:disabled{cursor:default; font-size:18px}
.av84-cr{gap:6px}
.av84-c{flex:1 1 auto; min-width:0}
.av84-txt{margin:0; color:var(--ink-2); font-style:italic}
.av84.eq{background:var(--surface-2)}
.av84-dist{display:grid; gap:6px}
.av84-lin{display:grid; grid-template-columns:44px 1fr auto; gap:8px; align-items:center}
.av84-lb{color:var(--ink-2); white-space:nowrap}
.av84-bar{height:10px; border-radius:6px; background:var(--track); overflow:hidden}
.av84-bar i{display:block; height:100%; background:#F5B301; border-radius:6px}
.av84-q{color:var(--ink-3); font-size:.9em; white-space:nowrap}
.av84-lista{display:grid; gap:8px}
.av84-it{display:grid; grid-template-columns:auto 1fr; gap:4px 12px; align-items:center; text-align:left; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:inherit; cursor:pointer}
.av84-it .av84-e{font-size:16px}
.av84-it-t{display:grid; min-width:0}
.av84-it-t small{color:var(--ink-3)}
.av84-it .av84-txt{grid-column:1 / -1}
.av84-crit{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap}
.av84-cn{color:var(--ink-2); font-size:.95em}
/* estrelas de arrastar o dedo (como o adesivo de avaliar dos stories) */
.av84-sl{display:flex; gap:4px; padding:6px 4px; border-radius:24px; touch-action:none; user-select:none; -webkit-user-select:none; cursor:pointer; outline:none}
.av84-sl:focus-visible{box-shadow:0 0 0 2px var(--accent, #F5B301)}
.av84-sl .av84-e{font-size:34px; padding:0 2px; cursor:inherit; transition:transform .12s ease, color .1s}
.av84-sl .av84-e.on{transform:scale(1.05)}
.av84-sl .av84-e.vivo{transform:scale(1.45) translateY(-4px)}
/* janela de aprovar */
.av84-aprovar{display:grid; gap:12px; margin-top:4px}
.av84-crit-g{flex-direction:column; align-items:flex-start; gap:2px; padding:8px 0; border-bottom:1px solid var(--line)}
.av84-crit-g .av84-cn{font-weight:600; color:var(--ink)}
.av84-falta{color:var(--ink-3); min-height:1.2em}
.av84-ab{gap:12px; align-items:center; flex-wrap:wrap}

/* marca do cliente buscada no Drive (ajustes/84) */
.mcd{display:flex; flex-direction:column; gap:10px; min-width:min(560px, 100%)}
.mcd-pasta{display:flex; align-items:center; gap:6px; margin:0; color:var(--ink-2); font-size:13px}
.mcd-aviso{margin:0; color:var(--ink-2)}
.mcd-dica{margin:0; color:var(--ink-3); font-size:13px}
.mcd-grade{display:grid; grid-template-columns:repeat(auto-fill, minmax(130px, 1fr)); gap:10px; max-height:52vh; overflow:auto; padding:2px}
.mcd-it{display:flex; flex-direction:column; gap:4px; align-items:stretch; text-align:left; padding:8px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2, var(--surface)); color:var(--ink); cursor:pointer; font:inherit}
.mcd-it:hover, .mcd-it:focus-visible{border-color:var(--brand, #1B7A5A); box-shadow:0 0 0 2px color-mix(in srgb, var(--brand, #1B7A5A) 25%, transparent)}
.mcd-it[disabled]{opacity:.6; cursor:progress}
.mcd-th{width:100%; aspect-ratio:1; object-fit:contain; border-radius:8px; background:repeating-conic-gradient(var(--track, #eee) 0 25%, transparent 0 50%) 0 0/16px 16px}
.mcd-th.mcd-sem{display:grid; place-items:center; color:var(--ink-3); background:var(--track)}
.mcd-it b{font-size:12px; color:var(--ink); line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mcd-it small{font-size:11px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mcd-outra{display:flex; flex-direction:column; gap:4px; border-top:1px solid var(--line); padding-top:10px}
.mcd-outra .inline-row{display:flex; gap:8px}
.mcd-link{flex:1; min-width:0}

/* espaço de aprovação com o tema da marca (ajustes/84): as variáveis vêm de temaDaMarca() */
:is(html, html.cx3) .pt-marca.pt-tema{color:var(--ink)}
:is(html, html.cx3) .pt-marca.pt-tema .pt-top, :is(html, html.cx3) .pt-marca.pt-tema .ig{background:var(--surface) !important; color:var(--ink) !important; border-color:var(--line) !important}
:is(html, html.cx3) .pt-marca.pt-tema .qd-tabs{background:color-mix(in srgb, var(--surface) 80%, transparent) !important; border-color:var(--line) !important}
:is(html, html.cx3) .pt-marca.pt-tema .qd-tab:not([aria-pressed="true"]), :is(html, html.cx3) .pt-marca.pt-tema .chip:not(.on):not([aria-pressed="true"]){background:var(--surface-2) !important; color:var(--ink-2) !important; border-color:var(--line) !important}
:is(html, html.cx3) .pt-marca.pt-tema .qd-tab:not([aria-pressed="true"]) small{background:var(--track) !important; color:var(--ink-3) !important}
:is(html, html.cx3) .pt-marca.pt-tema .inp{background:var(--surface-2) !important; color:var(--ink) !important; border-color:var(--line-2) !important}
:is(html, html.cx3) .pt-marca.pt-tema .inp::placeholder{color:var(--ink-3)}
:is(html, html.cx3) .pt-marca.pt-tema .btn:not(.primary){background:var(--surface-2) !important; color:var(--ink) !important; border-color:var(--line-2) !important}
:is(html, html.cx3) .pt-marca.pt-tema .pt-tit, :is(html, html.cx3) .pt-marca.pt-tema .pt-tit b, :is(html, html.cx3) .pt-marca.pt-tema h1, :is(html, html.cx3) .pt-marca.pt-tema h2, :is(html, html.cx3) .pt-marca.pt-tema h3{color:var(--ink) !important}
:is(html, html.cx3) .pt-marca.pt-tema small, :is(html, html.cx3) .pt-marca.pt-tema .muted{color:var(--ink-3)}
:is(html, html.cx3) .pt-marca.pt-tema .pt-num b, :is(html, html.cx3) .pt-marca.pt-tema a:not(.btn):not(.ig-m){color:var(--pt-tinta) !important}
:is(html, html.cx3) .pt-marca.pt-tema .ig-av.com-logo{box-shadow:0 0 0 2px var(--pt-tinta) !important}
body.portal-mode.pt-tema-on{color:var(--ink)}
/* prévia do quadro de marca: nome legível no fundo claro */
.mc-prev:not(.esc) b{color:#15171A}
.mc-prev:not(.esc) small{color:#454A52}
/* janelas do espaço do cliente (estrelas ao aprovar, avisos, tela cheia) na mesma paleta da marca:
   sem isso, o texto escuro da marca clara caía no fundo escuro da janela e ficava ilegível */
body.pt-tema-on:not(#_) dialog.dlg{background:var(--surface) !important; background-image:none !important; color:var(--ink) !important; border-color:var(--line) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important}
body.pt-tema-on:not(#_) dialog.dlg :is(h1, h2, h3, b, strong, label, .av84-cn){color:var(--ink) !important}
body.pt-tema-on:not(#_) dialog.dlg :is(p, small, .muted, .av84-falta){color:var(--ink-2) !important}
body.pt-tema-on:not(#_) dialog.dlg :is(.dlg-close, .icon-btn, .btn:not(.primary)){background:var(--surface-2) !important; color:var(--ink) !important; border-color:var(--line-2) !important}
body.pt-tema-on:not(#_) dialog.dlg .btn.primary{background:var(--pt-cor) !important; color:var(--pt-on) !important; border-color:var(--pt-cor) !important}
body.pt-tema-on:not(#_) dialog.dlg :is(.av84-crit-g){border-color:var(--line) !important}
body.pt-tema-on:not(#_) dialog.dlg .av84-e:not(.on){color:color-mix(in srgb, var(--ink-3) 45%, var(--surface)) !important}
body.pt-tema-on:not(#_) dialog.dlg .inp{background:var(--surface-2) !important; color:var(--ink) !important; border-color:var(--line-2) !important}

/* vídeo e carrossel dentro dos cards (ajustes/85) */
.ap85{position:relative; display:grid; gap:6px; margin:4px 0 2px}
/* uma miniatura só, fixa, no mesmo formato em todos os cards */
.ap85-th{position:relative; display:block; width:100%; aspect-ratio:4 / 5; padding:0; border:0; border-radius:12px; overflow:hidden; background:var(--track); cursor:pointer}
.ap85-th img{width:100%; height:100%; object-fit:cover; display:block}
.ap85-th.sem{background:var(--surface-2)}
.ap85-tipo{display:flex; align-items:center; gap:6px; color:var(--ink-2); font-size:.85em; font-weight:600}
/* botões pequenos sobre a mídia */
.ig-mid{position:relative}
.md85-ac{position:absolute; top:8px; right:8px; z-index:4; display:flex; gap:6px}
.md85-b{display:grid; place-items:center; min-width:32px; height:32px; padding:0 9px; border-radius:16px; background:rgba(0,0,0,.6); color:#fff; font-size:12px; font-weight:700; text-decoration:none; backdrop-filter:blur(4px)}
.md85-b:hover{background:rgba(0,0,0,.8)}
.md85-n{position:absolute; left:8px; top:8px; z-index:3; padding:3px 8px; border-radius:12px; background:rgba(0,0,0,.6); color:#fff; font-size:11px; font-weight:700}
/* miniatura nos cards da esteira */
.md85-th{position:relative; width:100%; aspect-ratio:16 / 10; border-radius:8px; overflow:hidden; background:var(--track); margin-bottom:6px}
.md85-th img{width:100%; height:100%; object-fit:cover; display:block}
.md85-play{position:absolute; inset:0; display:grid; place-items:center; color:#fff; filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
.ap-th{position:relative}
.ap-th .md85-n{top:6px; left:6px}
.ap85-card{cursor:pointer}
.ap85-card:hover{border-color:var(--line-2, var(--line)); box-shadow:0 2px 10px rgba(0,0,0,.18)}

/* preview do arquivo final e link (ajustes/86) */
.pv86{margin:4px 0 8px}
.pv86-cheio{display:grid; gap:8px; justify-items:center; padding:8px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2)}
.pv86-v{width:100%; max-width:360px; max-height:520px; border-radius:10px; background:#000; aspect-ratio:9 / 16; object-fit:contain}
.pv86-uma{width:100%; max-width:420px}
.pv86-uma img{width:100%; border-radius:10px; display:block}
.pv86-car{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; width:100%; padding-bottom:4px}
.pv86-sl{flex:0 0 auto; width:min(70%, 260px); aspect-ratio:4 / 5; border-radius:10px; overflow:hidden; background:var(--track); scroll-snap-align:start}
.pv86-sl img{width:100%; height:100%; object-fit:cover; display:block}
.pv86-img{display:block}
.pv86-vazio{display:grid; justify-items:center; gap:6px; padding:28px 16px; border:2px dashed var(--line-2, var(--line)); border-radius:12px; text-align:center; color:var(--ink-2)}
.pv86-vazio small{color:var(--ink-3); max-width:420px}
.pv86-ic{color:var(--brand, #1B7A5A)}
.pv86-link{display:flex; align-items:center; gap:6px; margin-top:8px; flex-wrap:wrap}
.pv86-li{color:var(--ink-3)}
.pv86-in{flex:1 1 220px; min-width:0}

/* arquivo final na janela da peça, setas do carrossel (ajustes/87) */
.ed87{display:grid; gap:8px; margin:6px 0 14px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--surface-2)}
.ed87-h{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.ed87-h small{color:var(--ink-3)}
.ed87 .pv86-cheio{background:var(--surface)}
.car87{position:relative}
.car87-b{position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:34px; height:34px; border-radius:50%; border:0; display:grid; place-items:center; cursor:pointer;
  background:rgba(0,0,0,.55); color:#fff; box-shadow:0 2px 8px rgba(0,0,0,.25)}
.car87-b:hover{background:rgba(0,0,0,.75)}
.car87-b.esq{left:6px}
.car87-b.dir{right:6px}
.car87-b[hidden]{display:none}
.car87-arr{cursor:grabbing; user-select:none}
.ig-car, .ap85-car, .pv86-car{cursor:grab}

.cal88{margin-top:8px}

/* =====================================================================
   89: revisão de design (08/11)
   Só aparência. Nada de regra de negócio aqui. Cores sempre por variável,
   para o tema claro, o escuro e a marca de cada cliente continuarem valendo.
   ===================================================================== */

/* =====================================================================
   1. Tema claro de verdade
   A camada cx7 deixa o miolo de toda tela escuro, mesmo no tema claro.
   No claro, o miolo passa a ser claro: cartões brancos, texto escuro e
   o verde da Cactus como destaque. O escuro não muda.
   ===================================================================== */
html.cx-light #pages [id^="body-"]:not(:empty):not(:has(> .dx:first-child)){
  --bg:#EDF5EF; --surface:#FFFFFF; --surface-2:#F3F8F5; --surface-3:#E4F0E8;
  --ink:#0F241A; --ink-2:#34503F; --ink-3:#5A7366;
  --line:rgba(16,94,52,.10); --line-2:rgba(16,94,52,.18);
  --brand:#17904F; --brand-2:#0F7A41; --brand-soft:rgba(32,168,94,.12); --on-brand:#FFFFFF;
  --hero-a:#1E3A2E; --hero-b:#3E5A3F; --hero-ink:#F1F3E8; --lime:#D6E668;
  --ok:#2F6B45; --ok-soft:#DCEBDD; --ok-f:#4C8F5F; --on-ok-f:#FFFFFF;
  --warn:#8A5A00; --warn-soft:#F8EBC4; --warn-f:#DDA52A; --on-warn-f:#2B1D00;
  --bad:#A8322A; --bad-soft:#F6DDD9; --bad-f:#CF4A3F; --on-bad-f:#FFFFFF;
  --idle:#4F5A49; --idle-soft:#E8F0EA; --idle-f:#8A9683; --on-idle-f:#FFFFFF;
  --lg-ok:#4C8F5F; --lg-warn:#DDA52A; --lg-bad:#CF4A3F;
  --track:#DCEBE1; --grid:#E1EEE5; --axis:#C8DCCF;
  --c1:#17904F; --c2:#CF4A3F; --c4:#3B6EA8; --c5:#DDA52A; --c7:#6B5BB0;
  --shadow:0 1px 2px rgba(16,94,52,.05), 0 10px 28px -18px rgba(16,94,52,.28);
  --glass-tint:rgba(255,255,255,.92); --glass-tint-strong:#FFFFFF; --glass-hi:rgba(255,255,255,.9);
  --glass-edge:rgba(16,94,52,.10); --glass-edge-2:rgba(16,94,52,.06); --glass-shadow:var(--shadow);
  --focus:#17904F;
  /* as --dx-* (gráficos dos dashboards) continuam escuras de propósito: esses gráficos têm texto claro fixo */
  --g-fill:#FFFFFF; --g-fill-2:#F3F8F5; --g-fill-3:#FFFFFF; --g-edge:rgba(16,94,52,.10); --g-hi:inset 0 1px 0 #FFFFFF;
  --g-sh:0 1px 2px rgba(16,94,52,.05), 0 10px 28px -18px rgba(16,94,52,.28); --g-blur:none;
  color-scheme:light;
  background:rgba(255,255,255,.45); border-color:rgba(16,94,52,.08);
  box-shadow:0 24px 60px -36px rgba(16,94,52,.35);
}
/* cartões */
html.cx-light #pages [id^="body-"] :is(.panel, .gx-card, .tile, .kpi, .stat, .x4-card, .qp6-card, .qp-colw, .pt-card, .fb6-c, .ad-k, .fn6-vc, .fn6-li, .vw-card, .vw-col, .est-tile, .x5-semg, .nt-it:not(.row), .gx-vazio, .mm-wrap, .mm6-wrap, .fn-vis, .tbl-wrap, .cal-grid, .cal-side, .board .bcol, .bcard, .hm-wrap, .q-prox, .x4-cc, .ad-row),
html.cx-light #pages [id^="body-"] :is(.cx-stat, .cx-card, .qb, .t3-tile, .ar-p, .ap-card, .cd-box, .gv-ficha, .gv-th, .cx-ini .panel){
  background:#FFFFFF !important; border:1px solid var(--line) !important; box-shadow:var(--shadow) !important; color:var(--ink);
}
html.cx-light #pages [id^="body-"] :is(.gx-row, .qp-it, .todo-item, .ag-item, .mrow, .so li, .mh-i, .ind-r){background:var(--surface-2) !important; border-color:var(--line) !important}
html.cx-light #pages [id^="body-"] :is(.vw-card, .gx-card, .x4-card, .qp6-card, .pt-card, .gx-row, .qp-it, .ad-row):hover{border-color:color-mix(in srgb, var(--brand) 40%, transparent) !important}
html.cx-light #pages [id^="body-"] :is(.mm6-wrap, .mm-wrap){background-image:radial-gradient(rgba(16,94,52,.14) 1px, transparent 1px) !important; background-color:#F7FBF8 !important}
html.cx-light #pages [id^="body-"] :is(.mm6-no.d0, .qp-av){background:var(--brand); color:var(--on-brand)}
/* campos, botões, chips e abas */
html.cx-light #pages [id^="body-"] :is(.inp, select.inp, textarea.inp, input[type="search"].inp){background:#FFFFFF !important; border-color:var(--line-2) !important; color:var(--ink) !important}
html.cx-light #pages [id^="body-"] select.inp option{background:#FFFFFF; color:var(--ink)}
html.cx-light #pages [id^="body-"] .btn:not(.primary):not(.danger){background:#FFFFFF !important; border-color:var(--line-2) !important; color:var(--ink) !important}
html.cx-light #pages [id^="body-"] .icon-btn{background:#FFFFFF !important; border-color:var(--line-2) !important; color:var(--ink-2) !important}
html.cx-light #pages [id^="body-"] :is(.chip, .x4-chip, .qd-tab, .x5-ms, .x4-vws, .ed-cp, .qp-cli, .x6-vb){background:#FFFFFF !important; border-color:var(--line-2) !important; color:var(--ink-2) !important}
html.cx-light #pages [id^="body-"] :is(.chip.on, .x4-chip[aria-pressed="true"], .qd-tab[aria-pressed="true"], .vw-tabs > button[aria-selected="true"], .x5-vatual, .seg button[aria-pressed="true"], .nt-seg button[aria-pressed="true"], .t3-seg button[aria-pressed="true"]),
html.cx-light #pages [id^="body-"] .x6-vb .x5-vatual{background:var(--brand) !important; border-color:var(--brand) !important; color:var(--on-brand) !important}
html.cx-light #pages [id^="body-"] :is(.vw-tabs, .qd-tabs, .seg, .nt-seg, .q-abas, .cx-tabs, .ar-bar, .t3-seg){background:var(--surface-2) !important; border-color:var(--line) !important}
html.cx-light #pages [id^="body-"] :is(.ar-bar, .t3-seg){color:var(--ink-2) !important}
html.cx-light #pages [id^="body-"] table th{background:var(--surface-2) !important}
html.cx-light #pages [id^="body-"] table td{border-color:var(--line) !important}
html.cx-light #pages [id^="body-"] :is(.banner, .ad-alerta){background:#FFFFFF !important}
html.cx-light #pages [id^="body-"] .ad-alerta{border-color:color-mix(in srgb, var(--bad-f) 40%, transparent) !important; box-shadow:inset 3px 0 0 var(--bad-f) !important}
html.cx-light #pages [id^="body-"] .x5-cwarn{background:var(--warn-soft); color:var(--warn); border-color:color-mix(in srgb, var(--warn-f) 50%, transparent)}
html.cx-light #pages [id^="body-"] .nt-it.row{border-bottom-color:var(--line) !important}
html.cx-light #pages [id^="body-"] .rf-pi{background:var(--surface-2) !important; border-color:var(--line-2) !important}
html.cx-light #pages [id^="body-"] .x5-ml{background:#FFFFFF !important; border-color:var(--line-2) !important}
html.cx-light #pages [id^="body-"] .cx3-mcd{background:var(--surface-2) !important; border-color:var(--line) !important}
html.cx-light #pages [id^="body-"] :is(.cx-stat, .cx-card, .qb, .gx-card, .est-tile, .kpi)[data-s="bad"]{box-shadow:inset 0 3px 0 -1px var(--bad-f), var(--shadow) !important}
html.cx-light #pages [id^="body-"] :is(.cx-stat, .cx-card, .qb, .gx-card, .est-tile, .kpi)[data-s="warn"]{box-shadow:inset 0 3px 0 -1px var(--warn-f), var(--shadow) !important}
html.cx-light #pages [id^="body-"] .cx-chip{background:var(--brand-soft); color:var(--brand)}
/* ilhas escuras de propósito (saudação e desenho da esteira): ganham de volta as cores do escuro */
html.cx-light #pages [id^="body-"] :is(.cx-greet, .x10-est){
  --ink:#F1F3E8; --ink-2:#C7CBB8; --ink-3:#A9B7A3; --line:rgba(255,255,255,.14); --line-2:rgba(255,255,255,.22);
  --surface:rgba(255,255,255,.08); --surface-2:rgba(255,255,255,.12); --brand:#D6E668; --on-brand:#0F1F17;
  --bad:#FF9188; --warn:#F0C45A; --ok:#9FE0AE;
  color-scheme:dark; color:var(--ink); box-shadow:0 18px 40px -24px rgba(15,31,23,.6) !important;
}
/* Meu quadro e Produção: cartões e filtros que tinham cor de fundo escura fixa */
html.cx-light #pages [id^="body-"] .x10-card{background:#FFFFFF; border-color:var(--line); box-shadow:var(--shadow)}
html.cx-light #pages [id^="body-"] .x10-card:hover{border-color:color-mix(in srgb, var(--brand) 40%, transparent)}
html.cx-light #pages [id^="body-"] .x10-card.meu{box-shadow:inset 3px 0 0 var(--brand), var(--shadow)}
html.cx-light #pages [id^="body-"] .x10-card.hoje{box-shadow:inset 3px 0 0 var(--warn-f), var(--shadow)}
html.cx-light #pages [id^="body-"] .x10-card.atr{box-shadow:inset 3px 0 0 var(--bad-f), var(--shadow); border-color:color-mix(in srgb, var(--bad-f) 30%, transparent)}
html.cx-light #pages [id^="body-"] .x10-card.atr .x10-pz{color:var(--bad)}
html.cx-light #pages [id^="body-"] .x10-card.hoje .x10-pz{color:var(--warn)}
html.cx-light #pages [id^="body-"] .x10-seg{background:var(--surface-2); border-color:var(--line)}
html.cx-light #pages [id^="body-"] .x10-seg button[aria-pressed="true"]{background:var(--brand); color:var(--on-brand)}
html.cx-light #pages [id^="body-"] .x10-cli{background:#FFFFFF; border-color:var(--line-2); color:var(--ink-2)}
html.cx-light #pages [id^="body-"] .x10-cli.on{background:var(--brand-soft); border-color:var(--brand); color:var(--ink)}
html.cx-light #pages [id^="body-"] :is(.x10-vz, .x10-maist){border-color:var(--line-2)}
html.cx-light #pages [id^="body-"] .x10-vz span{color:var(--brand)}
/* verde-limão usado como texto vira o verde da marca (limão sobre branco não se lê) */
html.cx-light #pages [id^="body-"] :is(.x13-obs.tem, .fin-th.on, .fin-simv){color:var(--brand); border-color:var(--brand)}
html.cx-light #pages [id^="body-"] .x13-acbig{background:var(--brand-soft); border-color:color-mix(in srgb, var(--brand) 35%, transparent)}
html.cx-light #pages [id^="body-"] .cx-greet .btn:not(.primary):not(.danger){background:rgba(255,255,255,.08) !important; border-color:rgba(255,255,255,.2) !important; color:#F1F3E8 !important}

/* =====================================================================
   2. Botão principal com uma cor só
   Ação principal = o verde da Cactus, em todo lugar (barra de cima, título
   da tela e dentro do painel). O verde-limão fica para o que está
   selecionado (abas e filtros) e para o cartão de saudação.
   ===================================================================== */
html.cx-dark #pages [id^="body-"] .btn.primary:not(.cx-greet .btn){
  background:linear-gradient(135deg, #2FAE62, #1E7A45) !important; border-color:transparent !important; color:#F4F5F2 !important;
}
html.cx-light #pages [id^="body-"] .btn.primary:not(.cx-greet .btn){
  background:linear-gradient(135deg, #22A85E, #138A4A) !important; border-color:transparent !important; color:#FFFFFF !important;
}
:is(html.cx-light, html.cx-dark) #pages [id^="body-"] .cx-greet .btn.primary{background:#D6E668 !important; border-color:#D6E668 !important; color:#0F1F17 !important}

/* =====================================================================
   3. Menu de cima com o nome de cada tela (computador largo)
   Antes só a tela aberta mostrava o nome; as outras eram só ícones.
   ===================================================================== */
@media (min-width:1280px){
  html.cx3-top .cx3-nav > .cx3-tm .cx3-tl, html.cx3-top .cx3-nav > .cx3-dd > .cx3-tm .cx3-tl{display:inline}
  html.cx3-top .cx3-nav > .cx3-tm, html.cx3-top .cx3-nav > .cx3-dd > .cx3-tm{padding:0 12px 0 10px; font-size:13.5px}
  html.cx3-top .cx3-nav > .cx3-tm::after, html.cx3-top .cx3-nav > .cx3-dd > .cx3-tm::after{display:none}
  /* o número volta para o lado do nome, em vez de ficar por cima do ícone */
  html.cx3-top .cx3-nav > .cx3-tm .cx3-tb, html.cx3-top .cx3-nav > .cx3-dd > .cx3-tm .cx3-tb{position:static; box-shadow:none}
}

/* =====================================================================
   4. Aprovação do cliente
   ===================================================================== */
/* lista de clientes à esquerda: passar o mouse e o cliente aberto legíveis nos dois temas */
#pages [id^="body-"] .ap-cli:hover{background:var(--surface-2)}
#pages [id^="body-"] .ap-cli.on{background:var(--brand-soft); border-color:color-mix(in srgb, var(--brand) 30%, transparent); box-shadow:none}

/* card da peça: caixa de seleção no tom do card (o padrão do navegador saía branco no escuro) */
:is(html, html.cx3) .ap-ck input{
  -webkit-appearance:none; appearance:none; margin:0; flex:none;
  width:18px; height:18px; border-radius:6px; cursor:pointer;
  border:1.5px solid var(--line-2); background:transparent;
  display:grid; place-items:center; transition:background-color .15s, border-color .15s;
}
:is(html, html.cx3) .ap-ck input:hover{border-color:var(--ink-3)}
:is(html, html.cx3) .ap-ck input:checked{background:var(--brand); border-color:var(--brand)}
:is(html, html.cx3) .ap-ck input:checked::after{
  content:''; width:12px; height:12px; background:var(--on-brand);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
:is(html, html.cx3) .ap-ck input:focus-visible{outline:2px solid var(--focus, var(--brand)); outline-offset:2px}
/* título em no máximo 2 linhas: o card não estica e a grade fica alinhada */
:is(html, html.cx3) .ap-main{gap:3px; padding:2px 12px 12px}
:is(html, html.cx3) .ap-main b{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
  font-size:14px; line-height:1.3;
}
:is(html, html.cx3) .ap-main small{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
:is(html, html.cx3) .ap85{margin:0 12px 6px}
:is(html, html.cx3) .ap85-tipo{font-size:12px; color:var(--ink-3)}
/* rodapé: a data numa linha, as ações embaixo como botões pequenos que nunca quebram no meio */
:is(html, html.cx3) .ap-ft{flex-direction:column; align-items:stretch; gap:8px; padding:10px 12px 12px}
:is(html, html.cx3) .ap-ft .ap-info{font-size:12px; color:var(--ink-3)}
:is(html, html.cx3) .ap-lk{display:flex; flex-wrap:wrap; gap:6px; margin-left:0}
:is(html, html.cx3) .ap-lk .lnk{
  flex:1 1 auto; display:inline-flex; align-items:center; justify-content:center;
  min-height:30px; padding:0 10px; border-radius:999px; white-space:nowrap;
  border:1px solid var(--line-2); background:transparent; color:var(--ink-2);
  font-size:12px; font-weight:650; text-decoration:none; text-align:center;
  transition:background-color .15s, border-color .15s, color .15s;
}
:is(html, html.cx3) .ap-lk .lnk:hover{background:var(--surface-2); border-color:var(--ink-3); color:var(--ink)}
/* as ações ficam sempre à vista (escondidas até passar o mouse, deixavam um vão vazio no card) */
:is(html, html.cx3).cx3-simples .ap-card .ap-lk{opacity:1}

/* =====================================================================
   5. Listas de peças e tarefas (aba Peças do cliente e outras)
   O botão "Abrir", que só aparece ao passar o mouse, ocupava uma linha
   inteira vazia embaixo de cada item. Agora ele fica à direita, embaixo
   do selo, e o item não ganha altura à toa.
   ===================================================================== */
@media (hover:hover) and (pointer:fine) and (min-width:701px){
  /* (:has não pode ficar dentro de outro :has, por isso o "sem botão principal" vem como :not(:has(...)) na linha) */
  html.cx3-simples .gx-row:has(> .gx-acts):not(:has(> .gx-acts .primary)) > :is(.gx-body, .gx-ic){grid-row:1 / span 2}
  html.cx3-simples .gx-row:has(> .gx-right):not(:has(> .gx-acts .primary)) > .gx-acts{grid-column:3; grid-row:2; justify-content:flex-end; align-self:end; margin-top:0}
  html.cx3-simples .gx-row:not(:has(> .gx-right)):not(:has(> .gx-acts .primary)) > .gx-acts{grid-column:3; grid-row:1 / span 2; align-self:center; margin-top:0}
  html.cx3-simples .gx-row:not(:has(> .gx-acts .primary)) > .gx-acts .btn{min-height:26px; padding:0 10px; font-size:12px}
}

/* =====================================================================
   6. Produção › Esteira: as 8 etapas lado a lado (sem "Publicado" sozinho)
   ===================================================================== */
@media (min-width:1100px){
  #pages .est-macros{grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr)}
}
@media (min-width:600px) and (max-width:1099px){
  #pages .est-macros{grid-template-columns:repeat(4, minmax(0, 1fr))}
}

/* =====================================================================
   7. Selos (pílulas) nunca esticam na largura toda
   ===================================================================== */
.stack > .pill, .stack > .nbadge{justify-self:start; width:auto}

/* =====================================================================
   8. Card do cliente
   ===================================================================== */
/* abas numa linha só: menores, e o "Mais" sempre por último */
.cd-tabs{gap:4px}
.cd-tabs > .qd-tab, .cd-tabs > .cd-mais > summary{padding:7px 9px; font-size:12.5px}
.cd-tabs > .cd-mais{order:9}
/* link da pasta do Drive vira "Abrir pasta" (ajustes/89-design.js); se sobrar algum link cru, ele não quebra em mil linhas */
.gx-kv dd{min-width:0; overflow-wrap:anywhere}
.gx-kv dd .dz-link{display:inline-flex; align-items:center; gap:6px; font-weight:650}

/* =====================================================================
   9. Ferramentas e telas com dois cartões lado a lado: os dois começam na mesma altura
   ===================================================================== */
section.page .cx-two > section.cx-card + section.cx-card{margin-top:0}

/* =====================================================================
   10. Entrada das telas mais curta (parecia travado por quase 1 segundo)
   ===================================================================== */
@media (prefers-reduced-motion:no-preference){
  html.cx3:not(.lg-calmo) .cx3-entra{animation-duration:.18s}
  html.cx3:not(.lg-calmo) .cx3-entra :is(.cx-stat, .panel, .ap-card, .ar-p, .qb, .gx-card, .t3-tile, .cd-box, .est-tile, .vw-card){animation-duration:.22s; animation-delay:0s !important}
}

/* =====================================================================
   11. Celular
   ===================================================================== */
@media (max-width:700px){
  /* a data já aparece no topo; na saudação ela sai */
  #pages .cx-greet > div > small:first-child{display:none}
}
@media (max-width:480px){
  /* números da Visão geral: o nome ocupa a largura toda e não quebra ao lado do ícone */
  #pages .cx-stat .cx-chip{display:none}
  #pages .cx-stat .cx-sh{flex-direction:row; justify-content:flex-start}
  #pages .cx-stat .cx-sl{font-size:12.5px; line-height:1.25}
}

/* fileiras de abas sem a barra de rolagem: no celular arrasta com o dedo, no computador
   arrasta com o mouse ou usa a rodinha (ajustes/90) */
:is(.qd-tabs, .vw-tabs, .cx-tabs){scrollbar-width:none; -ms-overflow-style:none}
:is(.qd-tabs, .vw-tabs, .cx-tabs)::-webkit-scrollbar{display:none; width:0; height:0}
.ab90-rola{cursor:grab}
.ab90-arrastando{cursor:grabbing; user-select:none; -webkit-user-select:none}
.ab90-arrastando *{pointer-events:none}

/* Newsletter do app do cliente (Clientes › Newsletter do app) */
.nl91 .nl91-cfg { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 8px 0 12px; align-items: start; }
.nl91 .nl91-chk { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2, transparent); cursor: pointer; }
.nl91 .nl91-chk input { margin-top: 3px; accent-color: var(--brand); }
.nl91 .nl91-chk span { display: flex; flex-direction: column; gap: 2px; }
.nl91 .nl91-chk small { color: var(--ink-3); font-size: 12px; line-height: 1.35; }
.nl91 .nl91-ed { border: 1px solid var(--line); border-radius: 14px; padding: 14px; margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.nl91 .nl91-ed[data-s="rascunho"] { border-color: color-mix(in srgb, var(--warn, #c98a00) 55%, var(--line)); }
.nl91 .nl91-ed[data-s="descartada"] { opacity: .6; }
.nl91 .nl91-cab { display: flex; gap: 10px; align-items: flex-start; }
.nl91 .nl91-cab b { display: block; font-size: 15px; }
.nl91 .nl91-cab small { color: var(--ink-3); font-size: 12px; }
.nl91 .nl91-rot { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.nl91 .nl91-abertura { margin: 0; color: var(--ink-2); }
.nl91 .nl91-bloco { margin: 6px 0 0; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.nl91 .nl91-item { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--line); }
.nl91 .nl91-item p { margin: 4px 0; color: var(--ink-2); line-height: 1.45; }
.nl91 .nl91-item a { font-size: 12px; color: var(--brand); word-break: break-word; }
.nl91 .nl91-item.fora { opacity: .45; text-decoration: line-through; }
.nl91 .nl91-tirar { display: flex; gap: 6px; align-items: center; font-size: 12px; white-space: nowrap; cursor: pointer; }
.nl91 .nl91-fonte { display: flex; gap: 8px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); flex-wrap: wrap; }
.nl91 .nl91-fonte small { display: block; color: var(--ink-3); font-size: 12px; }
.nl91 .nl91-url { word-break: break-all; }
.nl91 .nl91-erro { color: var(--bad, #c0392b) !important; }
.nl91 .nl91-nova { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.nl91 .nl91-nova > :nth-child(2) { grid-column: span 1; }
@media (max-width: 720px) {
  .nl91 .nl91-nova { grid-template-columns: 1fr; }
  .nl91 .nl91-item { flex-direction: column; }
}

/* Cursos do app do cliente (Clientes › Cursos do app) */
.cu93 .cu93-curso { display: grid; grid-template-columns: 180px 1fr; gap: 16px; padding: 14px; margin-top: 12px; border: 1px solid var(--line); border-radius: 14px; }
.cu93 .cu93-capa { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; background: var(--surface-2, rgba(255, 255, 255, .04)); }
.cu93 .cu93-capa.vazia { display: grid; place-items: center; color: var(--ink-3); font-size: 12px; }
.cu93 .cu93-info { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cu93 .cu93-cab { display: flex; gap: 10px; align-items: center; }
.cu93 .cu93-cab b { font-size: 16px; }
.cu93 .cu93-desc { margin: 0; color: var(--ink-2); }
.cu93 .cu93-pub { color: var(--ink-3); font-size: 12px; }
.cu93 .cu93-aulas { display: flex; flex-direction: column; gap: 10px; }
.cu93 .cu93-mod-n { display: block; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.cu93 .cu93-aula { display: flex; gap: 10px; align-items: center; width: 100%; text-align: left; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: transparent; color: var(--ink); font: inherit; cursor: pointer; }
.cu93 .cu93-aula small { color: var(--ink-3); font-size: 12px; white-space: nowrap; }
.cu93 .cu93-aula:hover { border-color: var(--line-2); }
@media (max-width: 720px) { .cu93 .cu93-curso { grid-template-columns: 1fr; } }

/* calendário de produção (ajustes/94): cor por etapa, "+" no dia, arrastar, agenda, semana */
:root{
  --et-plan:#7C8CF8; --et-prod:#3BA0E6; --et-rev:#E0A33A; --et-aj:#E5684B; --et-cli:#A66BD8;
  --et-prog:#2E9B57; --et-pub:#6B7C85; --et-trava:#C0392B; --et-falha:#B03A2E; --et-ag:#8A8F98;
}
[data-etapa="n_plan"]{--et:var(--et-plan)} [data-etapa="n_prod"]{--et:var(--et-prod)} [data-etapa="n_rev"]{--et:var(--et-rev)}
[data-etapa="n_aj"]{--et:var(--et-aj)} [data-etapa="n_cli"]{--et:var(--et-cli)} [data-etapa="n_prog"]{--et:var(--et-prog)}
[data-etapa="n_pub"]{--et:var(--et-pub)} [data-etapa="n_trava"]{--et:var(--et-trava)} [data-etapa="n_falha"]{--et:var(--et-falha)}
.cal94-it[data-etapa]:not([data-etapa=""]){border-left:4px solid var(--et) !important; background:color-mix(in srgb, var(--et) 16%, var(--surface, transparent)) !important}
.cal94-topo{display:flex; align-items:center; justify-content:space-between; gap:4px}
.cal94-mais{display:grid; place-items:center; width:22px; height:22px; padding:0; border:0; border-radius:6px; background:transparent; color:var(--ink-3); cursor:pointer; opacity:.35; transition:opacity .12s, background .12s}
.vw-cal-d:hover .cal94-mais, .cal94-mais:focus-visible{opacity:1}
.cal94-mais:hover{background:var(--surface-2); color:var(--ink)}
.vw-cal-d.kan-alvo{outline:2px dashed var(--brand, #2E9B57); outline-offset:-3px; background:color-mix(in srgb, var(--brand, #2E9B57) 10%, transparent)}
.cal94-it.kan-arr{cursor:grab}
.cal94-it.arrastando{opacity:.5}
.cal94-ev{display:block; margin:2px 0; padding:2px 6px; border-radius:6px; font-size:11px; line-height:1.3; color:var(--ink-2); background:color-mix(in srgb, var(--et-ag) 18%, transparent); border-left:3px solid var(--et-ag); text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.cal94-semana .vw-cal-d{min-height:280px; align-content:start}
.cal94-modo{margin-left:auto}
.cal94-leg{display:flex; flex-wrap:wrap; gap:8px 14px; margin:10px 0 2px; font-size:12px; color:var(--ink-2)}
.cal94-leg-it{display:inline-flex; align-items:center; gap:6px}
.cal94-leg-it::before{content:''; width:10px; height:10px; border-radius:3px; background:var(--et, var(--et-ag))}

/* correções da equipe (ajustes/95) */
[data-etapa="n_agu"]{--et:#C68BE8}
/* (32) colunas do quadro na cor da etapa */
#pages .vw-kan .vw-col[data-etapa]{border-top:4px solid var(--et) !important}
.vw-kan .vw-col[data-etapa] > .vw-col-h{color:var(--et)}
.vw-kan .vw-col[data-etapa] > .vw-col-h svg{color:var(--et)}
#pages .est-tile[data-etapa]{box-shadow:inset 0 3px 0 var(--et) !important}
.est-tile[data-etapa] .est-tb b{color:var(--et)}
/* (18) motivo do ajuste */
.ed95-aj{margin:0 0 12px; padding:10px 12px; border-radius:10px; border:1px solid color-mix(in srgb, var(--et-aj, #E5684B) 55%, transparent); background:color-mix(in srgb, var(--et-aj, #E5684B) 12%, transparent)}
.ed95-aj b{display:block; margin-bottom:4px; color:var(--ink)}
.ed95-aj p{margin:0; white-space:pre-wrap; color:var(--ink-2)}
.x95-aj{box-shadow:inset 3px 0 0 var(--et-aj, #E5684B)}
/* (7) sem gravação */
.ed95-semgrav{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:12px 0 4px; padding:8px 10px; border:1px dashed var(--line-2, var(--line)); border-radius:10px}
.ed95-semgrav small{color:var(--ink-3)}
/* (4) filtro */
.chk95{display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--ink-2); cursor:pointer}
.lista95{margin:4px 0 12px; padding-left:18px}
/* (4) botão "Mostrar as já postadas" ao lado de "Ver como o cliente vê" */
.ap95-tg{display:inline-flex; align-items:center; gap:10px}
.ap95-sw{position:relative; width:30px; height:18px; flex:none; border-radius:999px; background:var(--line-2, rgba(255,255,255,.18)); transition:background .15s}
.ap95-sw i{position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%; background:var(--surface, #fff); box-shadow:0 1px 2px rgba(0,0,0,.35); transition:transform .15s}
.ap95-tg.on .ap95-sw{background:var(--brand, #2E9B57)}
.ap95-tg.on .ap95-sw i{transform:translateX(12px); background:#fff}
.ap95-grp{display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end}

/* janela da peça, pedidos de 09/11 (ajustes/96) */
/* (26) collab só com o @ */
.x8-chip.col small{display:none !important}

.ed96-refs > summary{cursor:pointer; list-style:none; display:flex; align-items:center; gap:8px}
.ed96-refs > summary::-webkit-details-marker{display:none}
.ed96-refs > summary::after{content:''; margin-left:auto; width:8px; height:8px; border-right:2px solid var(--ink-3); border-bottom:2px solid var(--ink-3); transform:rotate(45deg); transition:transform .15s}
.ed96-refs[open] > summary::after{transform:rotate(225deg)}
.ed96-cnt{color:var(--ink-3); font-size:12px; font-weight:500}
.ed96-refs-c{display:grid; gap:14px; margin-top:10px}
.ed96-g2{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:14px}
.ed96-campo{display:grid; gap:6px; min-width:0}
.ed96-rot{color:var(--ink-3); font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em}
.ed96-instr{width:100%; resize:vertical; min-height:70px}
.ed96-lst{display:grid; gap:4px}
.ed96-it{display:flex; align-items:center; gap:8px; min-width:0; padding:4px 6px; border-radius:8px; background:var(--surface-2)}
.ed96-it > a, .ed96-it > span:not(.ed96-ic){flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px}
.ed96-ic{display:grid; place-items:center; color:var(--ink-3); flex:none}
.ed96-vazio{color:var(--ink-3)}
.ed96-addw{display:flex; gap:6px}
.ed96-addw .inp{flex:1; min-width:0; height:34px; font-size:13px}
.ed96-g{grid-template-columns:1fr !important}
/* (5) links clicáveis embaixo dos campos */
.ed96-links{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px}
.ed96-links a{display:inline-flex; align-items:center; gap:5px; max-width:100%; padding:3px 9px; border-radius:999px; font-size:12px; text-decoration:none; color:var(--brand, #2E9B57); background:color-mix(in srgb, var(--brand, #2E9B57) 12%, transparent); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ed96-links a:hover{text-decoration:underline}
/* (29) capa */
.ed96-capa-l{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:8px}
.ed96-capa-im, .ed96-capa-vz{width:72px; height:128px; border-radius:10px; object-fit:cover; background:var(--surface-2); flex:none}
.ed96-capa-vz{display:grid; place-items:center; color:var(--ink-3); border:1px dashed var(--line)}
.ed96-capa-b{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
/* (30) puxar do Docs */
.ed96-docs{display:inline-flex; gap:6px; flex-wrap:wrap; margin-left:auto; margin-right:6px}
.ed96-docs a.ed-cp{text-decoration:none}
/* (24) atalho dos comentários */
.ed96-com{margin-right:8px}
/* arquivo final: adicionar mais (ajustes/87) */
.ed87-mais{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 0 4px}
.ed87-mais small{color:var(--ink-3)}
/* o link de referência do alto saiu: as referências ficam na seção de baixo (o campo segue escondido para guardar o valor antigo) */
#cx4Ed .ed-refw{display:none !important}
/* (25) o botão de ligar o som dos cliques sai */
.cx-pb.snd{display:none !important}
/* (30) campo ligado ao Google Docs */
.ed96-doc{display:inline-flex; align-items:center; gap:8px; margin-left:auto; margin-right:8px; min-width:0}
.ed96-doc-a{display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:600; text-decoration:none; color:#4C8BF5; background:color-mix(in srgb, #4C8BF5 14%, transparent)}
.ed96-doc-st{color:var(--ink-3); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ed96-doc-st[data-s="ok"]{color:var(--ok, #2E9B57)}
.ed96-doc-st[data-s="bad"]{color:var(--bad, #E5684B); white-space:normal}
.ed96-conf{display:grid; gap:6px; margin:0 0 8px; padding:10px 12px; border-radius:10px; border:1px solid color-mix(in srgb, #E5684B 55%, transparent); background:color-mix(in srgb, #E5684B 10%, transparent)}
.ed96-conf small{color:var(--ink-2)}

/* esteira de produção, pedidos de 09/11 (ajustes/97) */
.ed97-acao{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 14px; padding:12px 14px; border-radius:14px; border:1px solid var(--line); background:var(--surface-2)}
.ed97-acao[data-tipo="revisao"]{border-color:color-mix(in srgb, var(--et-rev, #E0A33A) 55%, transparent); background:color-mix(in srgb, var(--et-rev, #E0A33A) 10%, var(--surface-2))}
.ed97-acao[data-tipo="producao"], .ed97-acao[data-tipo="gravacao"]{border-color:color-mix(in srgb, var(--et-prod, #3BA0E6) 50%, transparent); background:color-mix(in srgb, var(--et-prod, #3BA0E6) 9%, var(--surface-2))}
.ed97-acao[data-tipo="material"]{border-color:color-mix(in srgb, #C68BE8 55%, transparent); background:color-mix(in srgb, #C68BE8 10%, var(--surface-2))}
.ed97-txt{display:grid; gap:2px; flex:1 1 220px; min-width:0}
.ed97-txt small{color:var(--ink-3)}
.ed97-ent{display:flex; align-items:center; gap:8px; flex-wrap:wrap; flex-basis:100%; margin-top:6px}
.ed97-ent-h{color:var(--ink-3); font-weight:600}
.ed97-ent-it{display:inline-flex; align-items:center; gap:6px; padding:3px 8px; border-radius:999px; background:var(--surface); border:1px solid var(--line); font-size:12px}
.ed97-ent-it small{color:var(--ink-3)}
.ed97-ent-it[data-s="ok"]{color:var(--ok, #2E9B57)}
.ed97-ent-it[data-s="bad"]{border-color:color-mix(in srgb, var(--bad, #C0392B) 60%, transparent)}
.ed97-data{height:26px; padding:0 6px; font-size:12px; width:auto}
.ed97-sem small{color:var(--ink-3); margin-left:6px}
/* etapa escolhida no trilho: a coluna fica em destaque no quadro */
.vw-kan.com-foco97 > .vw-col:not(.foco97){opacity:.55}
#pages .vw-kan > .vw-col.foco97{outline:2px solid var(--et, var(--brand, #2E9B57)); outline-offset:2px}
/* linha da etapa: clicar em qualquer parte abre a peça */
.linha97{cursor:pointer}
.linha97:hover{background:color-mix(in srgb, var(--ink) 5%, transparent)}
.linha97:focus-visible{outline:2px solid var(--brand, #2E9B57); outline-offset:2px}
/* a rolagem da janela da peça não é empurrada quando as seções entram em cima */
#cx4Ed .ed-in, #cx4Ed .ed-in *{overflow-anchor:none}

/* roteiros e gravações, pedidos de 09/11 (ajustes/98) */
.x98-barra{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:6px 0 10px}
.x98-dica{color:var(--ink-3)}
.x98-wrap{overflow-x:auto}
.x98-mesa{width:100%; border-collapse:separate; border-spacing:0; font-size:13px}
.x98-mesa th{position:sticky; top:0; text-align:left; white-space:nowrap; padding:8px 10px; font-size:12px; font-weight:600; color:var(--ink-3); background:var(--surface-2); border-bottom:1px solid var(--line); cursor:grab; user-select:none}
.x98-mesa th.x98-ck{cursor:default}
.x98-mesa td{padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:middle}
.x98-mesa tbody tr{cursor:grab}
.x98-mesa tbody tr:hover td{background:color-mix(in srgb, var(--ink) 4%, transparent)}
.x98-mesa tr.arrastando{opacity:.45}
.x98-mesa .x98-sobre, .x98-mesa tr.x98-sobre td{box-shadow:inset 0 2px 0 var(--brand, #2E9B57)}
.x98-mesa th.x98-sobre{box-shadow:inset 3px 0 0 var(--brand, #2E9B57)}
.x98-ck{width:34px}
.x98-ord{white-space:nowrap}
.x98-ord .x98-al{display:inline-grid; place-items:center; color:var(--ink-3); margin-right:4px; vertical-align:middle}
.x98-rot{white-space:nowrap}
.x98-rot > *{vertical-align:middle; margin-right:6px}
.x98-rot small{color:var(--ink-3)}
.x98-tema{min-width:180px}
.x98-tema .lnk{text-align:left; font-weight:600}
.x98-tema small{display:block}
.x98-mesa tr.x98-grupo td{background:var(--surface-2); padding:10px; font-weight:600}
.x98-mesa tr.x98-grupo td small{margin-left:10px; color:var(--ink-3); font-weight:500}
.x98-mesa tr.x98-grupo{cursor:default}
#pages .x98-mesa select.x13-st{width:auto !important; min-width:150px; max-width:none !important}

/* Calendário geral na Minha área (ajustes/99) */
.ag99-filtros{display:flex; gap:16px; flex-wrap:wrap; margin:4px 0 10px}
.ag99-it{display:flex; align-items:center; gap:4px; width:100%; margin:2px 0; padding:2px 6px; border:0; border-radius:6px; font:inherit; font-size:11px; line-height:1.3; text-align:left; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink)}
.ag99-grav{background:color-mix(in srgb, #E0A33A 22%, transparent); border-left:3px solid #E0A33A}
.ag99-grav.feita{background:color-mix(in srgb, #2E9B57 18%, transparent); border-left-color:#2E9B57; color:var(--ink-2)}
.ag99-pub{display:inline-flex; align-items:center; gap:4px; margin-top:3px; padding:2px 8px; border:1px solid var(--line); border-radius:999px; background:transparent; font:inherit; font-size:11px; color:var(--ink-2); cursor:pointer}
.ag99-pub:hover{background:var(--surface-2)}
.ag99-leg-grav{--et:#E0A33A} .ag99-leg-pub{--et:var(--ink-3)}
.ag99-criar{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:10px}
.ag99-op{display:grid; gap:4px; justify-items:start; padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface-2); font:inherit; color:var(--ink); text-align:left; cursor:pointer}
.ag99-op:hover{border-color:var(--brand, #2E9B57)}
.ag99-op > span{color:var(--brand, #2E9B57)}
.ag99-op small{color:var(--ink-3)}