/* Escritório — módulo de Objetos Interativos (aba "Objetos" e modais de nota, link, TV e quadro).
   Tudo com as variáveis do tema (claro/escuro); amarelo só na tecla X; navy só nos botões padrão. */

.esc-obj-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.esc-obj-espaco { flex: 1; }
.esc-obj-meta { font-size: 12.5px; color: var(--tinta-2); align-self: center; }
.esc-obj-perigo { color: var(--erro); }
.esc-obj-perigo:hover { border-color: var(--erro); background: var(--erro-fundo); }
.botao svg { flex: none; }

/* tecla dentro do painel e dos modais (fora do .escritorio-completo) */
.esc-obj kbd, .esc-obj-modal kbd {
  display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px;
  border-radius: 5px; font: 700 11px/1 var(--dados); background: var(--amarelo); color: var(--navy); border: 0;
}

/* ---------- aba Objetos ---------- */
.esc-obj { display: flex; flex-direction: column; gap: 18px; }
.esc-obj__bloco { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 1px solid var(--linha); }

.esc-obj__perto {
  display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; align-items: center;
  padding: 14px; border-radius: var(--r-card); border: 1px dashed var(--linha); background: transparent;
}
.esc-obj__perto--ativo { border-style: solid; border-color: var(--tinta-3); background: var(--superficie); box-shadow: var(--sombra); }
.esc-obj__perto-ico {
  width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center;
  background: var(--superficie-2); color: var(--tinta);
}
.esc-obj__perto--ativo .esc-obj__perto-ico { background: var(--tinta); color: var(--fundo); }
.esc-obj__perto-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.esc-obj__perto-texto strong { font-size: 15px; color: var(--tinta); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-obj__perto .botao { grid-column: 1 / -1; justify-self: stretch; }
.esc-obj__perto .botao kbd { margin-left: 4px; }

.esc-obj__criar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.esc-obj__novo {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px 10px;
  border: 1px solid var(--linha); border-radius: 14px; background: var(--superficie); color: var(--tinta);
  font: 600 12px var(--texto); cursor: pointer;
  transition: border-color var(--t-rapido), transform var(--t-rapido) var(--ease), box-shadow var(--t-medio) var(--ease);
}
.esc-obj__novo:hover { border-color: var(--tinta-3); transform: translateY(-1px); box-shadow: var(--sombra); }
.esc-obj__novo:focus-visible { outline: 2px solid var(--foco); outline-offset: 2px; }

.esc-obj__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.esc-obj__item {
  width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 10px; text-align: left;
  border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--tinta); cursor: pointer;
  font: 500 13.5px var(--texto); transition: background-color var(--t-rapido), border-color var(--t-rapido);
}
.esc-obj__item:hover { background: var(--superficie); border-color: var(--linha); }
.esc-obj__item:focus-visible { outline: 2px solid var(--foco); outline-offset: -2px; }
.esc-obj__item--perto { background: var(--superficie); border-color: var(--tinta-3); }
.esc-obj__item-ico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--superficie-2); color: var(--tinta); }
.esc-obj__item-ico--nota { background: #EFE2B0; color: #030C31; }
.esc-obj__item-ico--tv { background: #C9CFDD; color: #030C31; }
.esc-obj__item-ico--whiteboard { background: #E2DBCA; color: #030C31; }
.esc-obj__item-ico--link { background: #A6B1C9; color: #030C31; }
.esc-obj__item-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.esc-obj__item-nome { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-obj__item-sub { font-size: 12px; color: var(--tinta-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-obj__item-dist { flex: none; font: 500 11px var(--dados); color: var(--tinta-2); }

/* ---------- modais (cabeçalho comum) ---------- */
.esc-obj-cab { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.esc-obj-cab__ico { flex: none; width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--superficie-2); color: var(--tinta); }
.esc-obj-cab__texto { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.esc-obj-cab__titulo { margin: 0; font-size: 20px; line-height: 1.2; overflow-wrap: anywhere; }
.esc-obj-modal .modal__acoes { align-items: center; flex-wrap: wrap; }

.esc-obj-form__campos { display: flex; flex-direction: column; gap: 14px; }
.esc-obj-form textarea { font-family: var(--texto); font-size: 15px; }
.esc-obj-modal input[type=url]::placeholder, .esc-obj-modal input[type=text]::placeholder, .esc-obj-modal textarea::placeholder { color: var(--tinta-3); }

/* ---------- nota ---------- */
.esc-nota__papel { display: block; }
.esc-nota__texto {
  display: block; width: 100%; min-height: 220px; resize: vertical; padding: 18px 18px 22px;
  border: 0; border-radius: 4px 4px 18px 4px;
  background: var(--nota, #EFE2B0); color: #030C31;
  font: 500 16px/1.5 var(--texto);
  box-shadow: 0 1px 0 rgba(3, 12, 49, .06), 0 14px 30px -18px rgba(3, 12, 49, .55);
  background-image: linear-gradient(transparent 23px, rgba(3, 12, 49, .07) 24px);
  background-size: 100% 24px; background-position: 0 14px;
}
.esc-nota__texto:hover, .esc-nota__texto:focus { border: 0; }
.esc-nota__texto:focus { outline: 2px solid var(--foco); outline-offset: 3px; box-shadow: 0 14px 30px -18px rgba(3, 12, 49, .55); }
.esc-nota__texto::placeholder { color: rgba(3, 12, 49, .45); }
.esc-nota__rodape { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.esc-nota__cores { display: flex; gap: 8px; }
.esc-nota__cor {
  width: 26px; height: 26px; border-radius: 8px; border: 1px solid rgba(3, 12, 49, .18); background: var(--cor); cursor: pointer;
  transition: transform var(--t-rapido) var(--ease);
}
.esc-nota__cor:hover { transform: translateY(-1px); }
.esc-nota__cor[aria-checked="true"] { outline: 2px solid var(--tinta); outline-offset: 2px; }

/* ---------- link ---------- */
.esc-link__ver { display: flex; flex-direction: column; gap: 6px; }
.esc-link__url {
  margin: 0; padding: 12px 14px; border-radius: 12px; background: var(--superficie-2);
  font: 500 13.5px var(--dados); color: var(--tinta) !important; overflow-wrap: anywhere;
}
.esc-link__form { display: flex; flex-direction: column; gap: 12px; }
.esc-link__form[hidden], .esc-link__ver[hidden] { display: none; }

/* ---------- TV ---------- */
.esc-tv__tela {
  position: relative; aspect-ratio: 16 / 9; width: 100%; border-radius: 16px; overflow: hidden;
  background: #0E0E10; box-shadow: inset 0 0 0 1px var(--linha);
}
.esc-tv__iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.esc-tv__vazia {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  padding: 24px; text-align: center; color: rgba(241, 239, 232, .7); font-size: 14px; line-height: 1.5;
  background: radial-gradient(120% 90% at 50% 40%, #1B2348 0%, #0E0E10 70%);
}
.esc-tv__vazia strong { color: #F1EFE8; font: 600 18px var(--display); letter-spacing: -.01em; }
.esc-tv__vazia span:last-child { max-width: 46ch; }
.esc-tv__vazia-ico { color: #F1EFE8; opacity: .8; }
.esc-tv__form { display: flex; gap: 10px; margin-top: 14px; }
.esc-tv__form[hidden] { display: none; }
.esc-tv__form input { flex: 1; }

/* ---------- quadro branco ---------- */
.esc-quadro__barra { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; }
.esc-quadro__grupo { display: flex; align-items: center; gap: 6px; padding: 4px; border: 1px solid var(--linha); border-radius: var(--r-pilula); background: var(--superficie); }
.esc-quadro__caneta {
  width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--superficie); background: var(--cor); cursor: pointer;
  box-shadow: 0 0 0 1px var(--tinta-3); transition: transform var(--t-rapido) var(--ease);
}
.esc-quadro__caneta:hover { transform: scale(1.08); }
.esc-quadro__caneta[aria-checked="true"] { box-shadow: 0 0 0 2px var(--tinta); }
.esc-quadro__ferr, .esc-quadro__tam {
  width: 30px; height: 30px; border-radius: 50%; border: 0; background: transparent; color: var(--tinta-2);
  display: grid; place-items: center; cursor: pointer;
}
.esc-quadro__ferr:hover, .esc-quadro__tam:hover { background: var(--superficie-2); color: var(--tinta); }
.esc-quadro__ferr[aria-checked="true"], .esc-quadro__tam[aria-checked="true"] { background: var(--tinta); color: var(--fundo); }
.esc-quadro__tam span { width: var(--t); height: var(--t); border-radius: 50%; background: currentColor; }
.esc-quadro__area {
  border-radius: 14px; overflow: hidden; background: #FFFFFF;
  box-shadow: inset 0 0 0 1px rgba(3, 12, 49, .14), 0 12px 32px -22px rgba(3, 12, 49, .5);
}
.esc-quadro__canvas { display: block; width: 100%; aspect-ratio: 16 / 9; cursor: crosshair; touch-action: none; }
.esc-quadro__canvas--borracha { cursor: cell; }
/* TV e quadro grandes: sobem na tela e a área 16:9 encolhe para caber sem rolar */
.modal-fundo:has(.esc-quadro), .modal-fundo:has(.esc-tv) { padding-top: 4vh; }
.esc-obj-modal:has(.esc-quadro), .esc-obj-modal:has(.esc-tv) { max-height: 92vh; }
.esc-quadro__area { width: min(100%, calc((92vh - 260px) * 16 / 9)); margin: 0 auto; }
.esc-tv__tela { width: min(100%, calc((92vh - 230px) * 16 / 9)); margin: 0 auto; }

/* =====================================================================
   Conteúdo no mapa (objetos-mapa.js): TV sobre o móvel, pop-ins, cartões e popover.
   Tudo dentro de #esc-ancoras (esc$.ancorar). No modo "mapa" a TV está em escala 'mundo'
   (o elemento é feito com resolução ≥ 4× e reduzido pelo núcleo), por isso os tamanhos lá são grandes.
   ===================================================================== */
.esc-tvm { box-sizing: border-box; color: var(--tinta); font-family: var(--texto); }
.esc-tvm__tela { position: relative; background: #0E0E10; overflow: hidden; }
.esc-tvm__iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.esc-tvm__cab, .esc-tvm__ctl, .esc-tvm__form, .esc-tvm__mini, .esc-tvm__ouvir { display: none; }

/* --- sobre a TV (modo mapa) --- */
.esc-tvm[data-modo="mapa"], .esc-tvm:not([data-modo]) {
  background: #0E0E10; border: 6px solid #17171B; border-radius: 6px;
  box-shadow: 0 0 0 3px rgba(3, 12, 49, .55), 0 18px 30px -14px rgba(3, 12, 49, .6);
}
.esc-tvm[data-modo="mapa"] .esc-tvm__tela, .esc-tvm:not([data-modo]) .esc-tvm__tela { position: absolute; inset: 0; }
/* Ampliar / Tela cheia: só com a TV ao alcance (classe --perto). Antes ficavam invisíveis mas pegando o
   mouse em qualquer distância, e só apareciam acertando o canto exato (o pai não recebe :hover). */
.esc-tvm[data-modo="mapa"] .esc-tvm__mini {
  display: flex; gap: 8px; position: absolute; top: 10px; right: 10px; pointer-events: none;
  opacity: 0; transition: opacity var(--t-rapido);
}
.esc-tvm--perto[data-modo="mapa"] .esc-tvm__mini { pointer-events: auto; opacity: .72; }
.esc-tvm--perto[data-modo="mapa"] .esc-tvm__mini:hover,
.esc-tvm--perto[data-modo="mapa"] .esc-tvm__mini:focus-within { opacity: 1; }
.esc-tvm__minibt {
  width: 52px; height: 52px; border-radius: 12px; border: 0; display: grid; place-items: center; cursor: pointer;
  background: rgba(3, 12, 49, .78); color: #F1EFE8;
}
.esc-tvm__minibt:hover { background: #030C31; }
.esc-tvm__minibt svg { width: 28px; height: 28px; }
/* som barrado pelo navegador: chip para ouvir (no mapa, maior por causa da escala) */
.esc-tvm--mudo .esc-tvm__ouvir {
  display: inline-flex; align-items: center; gap: 6px; position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%);
  pointer-events: auto; border: 0; border-radius: 999px; padding: 6px 12px; cursor: pointer;
  background: #FFD434; color: #030C31; font: 700 12px var(--texto); z-index: 2; white-space: nowrap;
}
.esc-tvm--mudo[data-modo="mapa"] .esc-tvm__ouvir { font-size: 30px; padding: 12px 26px; gap: 12px; bottom: 16px; }
/* no pop-in, o chip fica no alto da tela do vídeo (embaixo estão os controles) */
.esc-tvm--mudo[data-modo="popin"] .esc-tvm__ouvir, .esc-tvm--mudo[data-modo="solto"] .esc-tvm__ouvir { bottom: auto; top: 58px; }
.esc-tvm--mudo[data-modo="mapa"] .esc-tvm__ouvir svg { width: 30px; height: 30px; }

/* --- pop-in acima da TV e solto num canto --- */
.esc-tvm[data-modo="popin"], .esc-tvm[data-modo="solto"] {
  position: absolute; background: var(--superficie); border: 1px solid var(--linha); border-radius: 18px;
  box-shadow: 0 24px 60px -24px rgba(3, 12, 49, .55), 0 2px 6px rgba(3, 12, 49, .12); overflow: hidden;
}
.esc-tvm[data-modo="popin"] .esc-tvm__cab, .esc-tvm[data-modo="solto"] .esc-tvm__cab {
  display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 12px; cursor: grab; user-select: none; touch-action: none;
}
.esc-tvm--arrastando .esc-tvm__cab { cursor: grabbing; }
.esc-tvm--arrastando { opacity: .92; }
/* o ponteiro passando sobre o iframe (outro processo no Chrome) engolia o resto do arrasto e o pointerup */
.esc-tvm--arrastando .esc-tvm__iframe { pointer-events: none; }
.esc-tvm__ico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--superficie-2); }
.esc-tvm__titulos { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.esc-tvm__titulos strong { font: 600 13.5px var(--texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-tvm__titulos span { font-size: 11.5px; color: var(--tinta-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-tvm__bt {
  flex: none; width: 32px; height: 32px; border-radius: 10px; border: 0; background: transparent; color: var(--tinta-2);
  display: grid; place-items: center; cursor: pointer;
}
.esc-tvm__bt:hover { background: var(--superficie-2); color: var(--tinta); }
.esc-tvm__bt:focus-visible, .esc-tvm__minibt:focus-visible { outline: 2px solid var(--foco); outline-offset: 1px; }
.esc-tvm [data-acao="prender"] { display: none; }
.esc-tvm[data-modo="solto"] [data-acao="prender"] { display: grid; }
.esc-tvm[data-modo="popin"] .esc-tvm__tela, .esc-tvm[data-modo="solto"] .esc-tvm__tela { aspect-ratio: 16 / 9; width: 100%; }
.esc-tvm[data-modo="popin"] .esc-tvm__ctl, .esc-tvm[data-modo="solto"] .esc-tvm__ctl {
  display: flex; align-items: center; gap: 4px; padding: 6px 8px; flex-wrap: wrap;
}
.esc-tvm--vazia .esc-tvm__ctl, .esc-tvm--semapi .esc-tvm__ctl [data-acao="alternar"],
.esc-tvm--semapi .esc-tvm__ctl [data-acao="voltar10"], .esc-tvm--semapi .esc-tvm__ctl [data-acao="avancar10"] { display: none !important; }
.esc-tvm__tempo { font: 500 12px var(--dados); color: var(--tinta-2); padding-left: 4px; white-space: nowrap; }
.esc-tvm__espaco { flex: 1; }
.esc-tvm[data-modo="popin"] .esc-tvm__form:not([hidden]), .esc-tvm[data-modo="solto"] .esc-tvm__form:not([hidden]) {
  display: flex; gap: 8px; padding: 8px 10px 10px;
}
.esc-tvm__form input { flex: 1; min-width: 0; }
.esc-tvm__vazia {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 16px 22px; text-align: center; color: rgba(241, 239, 232, .7); font-size: 12.5px; line-height: 1.45;
  background: radial-gradient(120% 90% at 50% 40%, #1B2348 0%, #0E0E10 70%);
}
.esc-tvm__vazia strong { color: #F1EFE8; font: 600 15px var(--display); letter-spacing: -.01em; }
.esc-tvm__vazia span:last-child { max-width: 44ch; }
.esc-tvm__vazia > span:first-child { color: #F1EFE8; opacity: .8; }

/* solto: sai da âncora e fica num canto do mapa (o núcleo escreve transform/left/top inline) */
.esc-tvm.esc-tvm--solto { transform: none !important; visibility: visible !important; left: auto !important; top: auto !important; }
.esc-tvm.esc-tvm--solto.esc-tvm--no { left: 14px !important; top: 58px !important; }
.esc-tvm.esc-tvm--solto.esc-tvm--ne { right: 14px; top: 58px !important; }
.esc-tvm.esc-tvm--solto.esc-tvm--so { left: 14px !important; bottom: 14px; }
.esc-tvm.esc-tvm--solto.esc-tvm--se { right: 14px; bottom: 176px; }

/* tela cheia (qualquer modo) */
.esc-tvm:fullscreen {
  transform: none !important; visibility: visible !important; width: 100vw !important; height: 100vh !important;
  border: 0; border-radius: 0; background: #000; display: flex; flex-direction: column;
}
.esc-tvm:fullscreen, .esc-tvm:fullscreen * { pointer-events: auto !important; }
.esc-tvm:fullscreen .esc-tvm__tela { position: relative; inset: auto; flex: 1; aspect-ratio: auto; width: 100%; }
.esc-tvm:fullscreen .esc-tvm__cab, .esc-tvm:fullscreen .esc-tvm__ctl, .esc-tvm:fullscreen .esc-tvm__mini, .esc-tvm:fullscreen .esc-tvm__form { display: none !important; }

/* --- pop-ins de nota e quadro (não modais) --- */
.esc-popin {
  box-sizing: border-box; max-width: min(92vw, 640px); padding: 14px 16px 12px; border-radius: 18px;
  background: var(--superficie); color: var(--tinta); border: 1px solid var(--linha);
  box-shadow: 0 24px 60px -24px rgba(3, 12, 49, .55), 0 2px 6px rgba(3, 12, 49, .12);
  max-height: calc(100% - 24px); overflow: auto;
}
.esc-popin .esc-obj-cab { margin-bottom: 10px; gap: 10px; }
.esc-popin .esc-obj-cab__ico { width: 34px; height: 34px; border-radius: 11px; }
.esc-popin .esc-obj-cab__titulo { font-size: 16px; }
.esc-popin .modal__acoes { display: flex; gap: 8px; align-items: center; justify-content: flex-end; flex-wrap: wrap; margin-top: 10px; }
.esc-popin--nota .esc-nota__texto { min-height: 150px; font-size: 15px; }
.esc-popin--quadro .esc-quadro__barra { gap: 8px; margin-bottom: 8px; }
.esc-popin--quadro .esc-quadro__area { width: 100%; }
.esc-popin--quadro .esc-quadro__caneta { width: 22px; height: 22px; }
.esc-popin--quadro .esc-quadro__ferr, .esc-popin--quadro .esc-quadro__tam { width: 26px; height: 26px; }

/* --- popover de objeto longe --- */
.esc-objpop {
  box-sizing: border-box; min-width: 220px; max-width: 320px; padding: 10px; border-radius: 14px;
  background: var(--superficie); color: var(--tinta); border: 1px solid var(--linha);
  box-shadow: 0 18px 40px -20px rgba(3, 12, 49, .55), 0 2px 6px rgba(3, 12, 49, .1);
  display: flex; flex-direction: column; gap: 8px;
}
.esc-objpop__cab { display: flex; flex-direction: column; gap: 1px; padding: 0 2px; }
.esc-objpop__cab strong { font: 600 13.5px var(--texto); }
.esc-objpop__cab span { font-size: 11.5px; color: var(--tinta-2); }
.esc-objpop__acoes { display: flex; flex-wrap: wrap; gap: 6px; }
.esc-objpop__acoes .botao { gap: 6px; }

/* --- cartões ancorados (escala 'mundo', resolução 3: 3 px de autor = 1 px de mundo) --- */
.esc-objcard { box-sizing: border-box; font-family: var(--texto); }
.esc-objcard__nota {
  width: 210px; padding: 12px 14px 14px; border-radius: 4px 4px 14px 4px;
  background: var(--nota, #EFE2B0); color: #030C31; font-size: 17px; line-height: 1.35;
  display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 3px 0 rgba(3, 12, 49, .12), 0 16px 26px -16px rgba(3, 12, 49, .55);
}
.esc-objcard__nota strong { font-size: 18px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-objcard__nota span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .88; }
.esc-objcard__nota em { font-style: normal; opacity: .6; }
.esc-objcard__link, .esc-objcard__tarefas {
  min-width: 150px; max-width: 260px; padding: 10px 14px; border-radius: 12px;
  background: var(--superficie); color: var(--tinta); border: 2px solid var(--linha);
  display: flex; flex-direction: column; gap: 2px; font-size: 17px; line-height: 1.3;
  box-shadow: 0 16px 26px -16px rgba(3, 12, 49, .5);
}
.esc-objcard__link strong { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-objcard__link span { font: 500 15px var(--dados); color: var(--tinta-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-objcard__tarefas { flex-direction: row; align-items: baseline; gap: 8px; }
.esc-objcard__tarefas strong { font: 700 26px var(--display); }
.esc-objcard__tarefas span { color: var(--tinta-2); }

@media (max-width: 720px) {
  .esc-obj__criar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .esc-tv__form { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .esc-obj__novo, .esc-nota__cor, .esc-quadro__caneta { transition: none; }
}