/* Langris — acabamento operacional, carregado após a identidade compartilhada.
 * A preferência de tema e os tokens pertencem a operacao-tema/identidade.
 * Só o chrome: não selecionar mídia, arte/paletas de clientes ou iframes.
 * Exceções explícitas: placeholder HTML vazio e desenhos ilustrativos do Início.
 * A geometria da barra, do calendário e da gaveta .rp-* continua soberana
 * nos módulos originais (inclusive os cortes 980/1392/1400 e --rp-barra).
 */

/* Navegação real: todos os itens, seletor de empresa e menus permanecem. */
body.produto-operacional[data-op-tema] .op-sidebar {
  background: var(--panel);
  border-bottom-color: var(--line);
  box-shadow: 0 1px 0 var(--line);
}
body.produto-operacional[data-op-tema] .op-sidebar nav button {
  border-radius: 9px;
  color: var(--muted);
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-weight: 500;
}
body.produto-operacional[data-op-tema] .op-sidebar nav button:hover {
  background: var(--surface-soft);
  color: var(--ink);
}
body.produto-operacional[data-op-tema] .op-sidebar nav button.ativo {
  background: var(--exp-accent-soft);
  color: var(--exp-accent-text);
  border-color: transparent;
  box-shadow: none;
}
body.produto-operacional[data-op-tema] .op-sidebar .op-company-chip {
  background: var(--surface);
  border-color: var(--line);
  border-radius: 10px;
}
body.produto-operacional[data-op-tema] .op-sidebar .op-company-chip :is(strong, select) {
  color: var(--ink);
}
/* Teto único da casca (rebranding de 26/09/2026): 2560px, com o respiro lateral de 28px (20 até 1100px,
 * 16 no celular) de operacao-unificada.css. Os tetos antigos (1500, 1580, 1600) saíram das outras folhas;
 * em 1480 a tela do dono (2268px de CSS com zoom de 67%) ficava com duas faixas vazias nas laterais. */
body.produto-operacional[data-op-tema] .op-main {
  max-width: 2560px;
  padding-top: 28px;
  min-width: 0;
}
body.produto-operacional[data-op-tema] .op-main--montagem { max-width: none; }
/* Editor sem faixa de título duplicada: ele ocupa o viewport operacional
 * inteiro abaixo da barra do Langris. Não é um cartão centralizado dentro de
 * outro aplicativo; a moldura só preserva a fronteira técnica do iframe. */
body.produto-operacional[data-op-tema] .op-main.op-main--editor {
  max-width: none;
  min-height: 0;
  padding: 0;
}
body.produto-operacional[data-op-tema] .op-main--editor .op-editor-embutido {
  margin: 0;
  height: calc(100dvh - var(--rp-barra, 140px));
  min-height: 0;
  border: 0;
  border-radius: 0;
  background: var(--panel);
}
/* A geração da nova versão é tela cheia, inclusive no celular. */
body.produto-operacional[data-op-tema] .op-main.op-main--gerar-ia {
  max-width: none;
  padding: 0;
}
/* Mesma identidade da Montagem, sem banho azul/terracota no fundo escuro.
 * Só tokens e moldura: confirmação, galeria e imagens não são alteradas. */
body.produto-operacional[data-op-tema] .mg {
  --mg-bg: var(--id-bg);
  --mg-surface: var(--id-panel);
  --mg-soft: var(--id-surface-soft);
  --mg-ink: var(--id-ink);
  --mg-muted: var(--id-muted);
  --mg-line: var(--id-line);
  --mg-accent: var(--id-accent);
  --mg-accent-text: var(--id-accent-text);
  --mg-erro: var(--id-danger);
  background: var(--mg-bg);
  color: var(--mg-ink);
  font-family: var(--sans, 'Instrument Sans', sans-serif);
}
body.produto-operacional[data-op-tema] .mg-compositor {
  background: var(--mg-surface);
  border-color: var(--id-input-line);
  box-shadow: var(--id-shadow);
}
body.produto-operacional[data-op-tema] .mg-titulo { font-weight: 600; letter-spacing: -.045em; }
body.produto-operacional[data-op-tema] .mg-titulo strong { font-weight: 600; }
body.produto-operacional[data-op-tema] .mg-gerar { box-shadow: none; }
body.produto-operacional[data-op-tema] .op-sidebar .op-grupo__menu { box-shadow: var(--id-shadow); }
body.produto-operacional[data-op-tema] .op-head {
  gap: 16px 24px;
  margin-bottom: 26px;
}
body.produto-operacional[data-op-tema] :is(.op-head h1, .op-start-head h1) {
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-size: clamp(26px, 2.65vw, 38px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.045em;
  color: var(--ink);
}
body.produto-operacional[data-op-tema] .op-head > div > p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--muted);
}
body.produto-operacional[data-op-tema] .op-start-description {
  margin-top: 10px;
  max-width: 680px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}
body.produto-operacional[data-op-tema] :is(.op-subnav, .op-radar-tabs) { gap: 8px; }
body.produto-operacional[data-op-tema] :is(.op-subnav, .op-radar-tabs) button {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 9px;
  color: var(--muted);
  font-family: var(--sans, 'Instrument Sans', sans-serif);
}
body.produto-operacional[data-op-tema] :is(.op-subnav, .op-radar-tabs) button.ativo {
  background: var(--exp-accent-soft);
  color: var(--exp-accent-text);
  border-color: transparent;
  box-shadow: none;
}

/* Superfícies de operação — nenhuma regra genérica em descendentes. */
body.produto-operacional[data-op-tema] :is(
  .op-panel, .op-stat, .op-agenda, .op-company-context,
  .op-company-context-intro, .op-radar-intro, .op-radar-new,
  .op-radar-count, .op-studio-storage, .op-studio-accounts,
  .op-social-account, .op-network-card, .op-network-fields, .op-networks,
  .op-instagram-profissional, .op-social-slot, .op-social-network,
  .op-demography-card, .op-demography-hero, .op-demography-pending,
  .op-pub-account-hero, .op-pub-kpis, .op-pub-observed,
  .op-voce__cartao, .op-grafico-bloco
) {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 16px;
  box-shadow: none;
  color: var(--ink);
}
body.produto-operacional[data-op-tema] :is(.op-section-title h2, .op-panel > h2, .op-panel > h3) {
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  color: var(--ink);
  font-weight: 600;
  letter-spacing: -.025em;
}
body.produto-operacional[data-op-tema] :is(.op-panel, .op-stat) { min-width: 0; }
body.produto-operacional[data-op-tema] :is(.op-primary, .op-btn-primary) {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
  border-radius: 8px;
  box-shadow: none;
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-weight: 500;
}
body.produto-operacional[data-op-tema] :is(.op-primary, .op-btn-primary):hover:not(:disabled) {
  background: var(--accent-hover, var(--accent));
  border-color: var(--accent);
}
/* 26/09/2026 (tema escuro padrão): o CTA de Criar vídeo é .op-primary com o gradiente
   do Vídeo e tinta quase preta; o hover acima (0,5,1) trocava o gradiente pelo cobalto
   e deixava o texto a 2,75:1. Mesmo desenho do Clip (studio-clip.css): no hover o
   gradiente fica, e o brilho continua vindo de operacao-unificada.css. */
body.produto-operacional[data-op-tema] .op-video .cv-cta:hover:not(:disabled) {
  background: var(--video-cta);
  border-color: transparent;
}
body.produto-operacional[data-op-tema] :is(.op-outline, .op-upload, .op-botao-icone) {
  border-color: var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--panel);
  box-shadow: none;
}
body.produto-operacional[data-op-tema] :is(.op-outline, .op-upload, .op-botao-icone):hover:not(:disabled) {
  background: var(--surface-soft);
  border-color: var(--accent);
}
body.produto-operacional[data-op-tema] :is(
  .op-sidebar button, .op-subnav button, .op-primary, .op-btn-primary,
  .op-outline, .op-upload, .op-botao-icone, .op-library-more,
  .op-library-toolbar input, .op-library-toolbar button, .op-network-card.disponivel
):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}

/* Início: moldura e metadados; as miniaturas continuam com sua arte própria. */
body.produto-operacional[data-op-tema] .op-start {
  --start-card: var(--panel);
  --start-line: var(--line);
  --start-text: var(--ink);
  --start-muted: var(--muted);
}
body.produto-operacional[data-op-tema] .op-start .op-start-grid { gap: 20px; }
body.produto-operacional[data-op-tema] .op-start .op-start-card {
  border-radius: 16px;
  box-shadow: none;
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .op-start .op-start-card:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--accent);
  box-shadow: 0 6px 22px color-mix(in srgb, var(--ink) 7%, transparent);
}
body.produto-operacional[data-op-tema] .op-start .op-start-card__body { padding: 22px; }
body.produto-operacional[data-op-tema] .op-start .op-start-card__action { color: var(--exp-accent-text); }
body.produto-operacional[data-op-tema] .op-start .op-start-card:disabled .op-start-card__action { color: var(--muted); }
body.produto-operacional[data-op-tema] .op-start .op-start-recent-card { border-radius: 12px; }

/* Desenhos estáticos de previaDoInicio(), não peças nem dados de clientes.
 * Toda pintura abaixo exige a miniatura de um dos três atalhos explícitos.
 * O globo, as mídias e as prévias da biblioteca não entram neste escopo. */
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview,
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview,
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview { background: #eaf0fb; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-demo-label,
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-demo-label,
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-demo-label { color: #536078; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-paper--one { background: #ffffff; color: #2357ff; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-paper--two { background: #2357ff; color: #ffffff; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-paper--two i { border-color: #aabdff; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-paper--three { background: #e3e7fc; color: #273763; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--artes .op-start-preview .op-start-paper--three i { color: #7d72c5; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-calendar {
  background: #ffffff;
  border-color: #c6d2ec;
  color: #273763;
}
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-calendar-grid > i { border-color: #e3e8f1; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-event {
  background: #edf2ff;
  border-color: #bdcdff;
  color: #1945da;
}
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-event span { color: #536078; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--agenda .op-start-preview .op-start-event--two { background: #e8e5fb; border-color: #c9c2ee; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart { background: #ffffff; border-color: #d2dcf0; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart b { color: #10182a; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart small { color: #536078; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart-tabs i { background: #edf2ff; border-color: #d2dcf0; color: #465a85; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart svg > path:nth-of-type(1) { stroke: #dce5f4; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart svg > path:nth-of-type(2) { stroke: #2357ff; }
body.produto-operacional[data-op-tema] .op-start .op-start-card--resultados .op-start-preview .op-start-chart svg > path:nth-of-type(3) { stroke: #9d8fdb; }

/* Biblioteca: neutraliza o chrome marrom sem recolorir previews/templates. */
body.produto-operacional[data-op-tema] .op-studio-library-home {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 16px;
  box-shadow: none;
}
body.produto-operacional[data-op-tema] .op-studio-library-home > header {
  padding: 25px 26px;
  background: var(--panel);
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .op-studio-library-home > header h2 {
  color: var(--ink);
  font: 600 clamp(23px, 2.5vw, 32px)/1.15 var(--sans, 'Instrument Sans', sans-serif);
  letter-spacing: -.035em;
}
body.produto-operacional[data-op-tema] .op-studio-library-home > header p {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}
body.produto-operacional[data-op-tema] :is(.op-library-toolbar, .op-studio-library-home > footer) {
  background: var(--panel);
  border-color: var(--line);
  color: var(--muted);
}
body.produto-operacional[data-op-tema] .op-library-toolbar nav button {
  min-height: 50px;
  color: var(--muted);
  font-size: 12px;
}
body.produto-operacional[data-op-tema] .op-library-toolbar nav button.ativo {
  color: var(--exp-accent-text);
  border-bottom-color: var(--accent);
}
body.produto-operacional[data-op-tema] .op-library-toolbar nav b {
  background: var(--surface-soft);
  border-color: var(--line);
  color: var(--muted);
  font: 500 10px/1 var(--sans, 'Instrument Sans', sans-serif);
}
body.produto-operacional[data-op-tema] .op-library-toolbar label {
  background: var(--surface);
  border-color: var(--line);
  border-radius: 8px;
  color: var(--muted);
}
body.produto-operacional[data-op-tema] .op-library-toolbar input {
  background: transparent;
  color: var(--ink);
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-size: 12px;
}
body.produto-operacional[data-op-tema] .op-library-toolbar input::placeholder { color: var(--muted); }
body.produto-operacional[data-op-tema] .op-library-grid { gap: 16px; padding: 24px; }
body.produto-operacional[data-op-tema] .op-library-card {
  border-color: var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: none;
}
body.produto-operacional[data-op-tema] .op-library-card:hover {
  transform: none;
  border-color: var(--accent);
  background: var(--panel);
}
body.produto-operacional[data-op-tema] .op-library-card__body h3 { color: var(--ink); font-size: 14px; font-weight: 600; }
body.produto-operacional[data-op-tema] .op-library-card__body > span { color: var(--exp-accent-text); font-size: 10px; }
body.produto-operacional[data-op-tema] .op-library-card__body :is(p, small) { color: var(--muted); font-size: 11px; }
body.produto-operacional[data-op-tema] .op-library-card__actions :is(.op-primary, .op-outline) { font-size: 11px; }
body.produto-operacional[data-op-tema] .op-library-more {
  border-color: var(--line);
  border-radius: 8px;
  color: var(--muted);
  background: var(--surface);
}
body.produto-operacional[data-op-tema] .op-library-empty h3 {
  color: var(--ink);
  font: 600 24px/1.2 var(--sans, 'Instrument Sans', sans-serif);
  letter-spacing: -.03em;
}
body.produto-operacional[data-op-tema] .op-library-empty p { color: var(--muted); font-size: 13px; }
body.produto-operacional[data-op-tema] .op-library-empty i { border-color: var(--line); color: var(--exp-accent-text); }
body.produto-operacional[data-op-tema] .op-studio-library-home > footer { font-size: 11px; }
body.produto-operacional[data-op-tema] .op-studio-library-home > footer b { color: var(--exp-accent-text); }
body.produto-operacional[data-op-tema] .op-studio-library-home > footer small { color: var(--muted); }

/* Langris Clip: os estados de sucesso/erro e toda geometria de mídia ficam. */
body.produto-operacional[data-op-tema] :is(.clip, .clip-agendar) {
  --clip-laranja: var(--accent);
  --clip-laranja-suave: var(--exp-accent-soft);
  --clip-apoio: var(--muted);
}
body.produto-operacional[data-op-tema] .clip__marca > i { background: var(--accent); box-shadow: none; }
body.produto-operacional[data-op-tema] .clip__marca h2 {
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-size: 24px;
  letter-spacing: -.035em;
}
body.produto-operacional[data-op-tema] :is(.clip__escolhas, .clip-corte) {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 14px;
}
body.produto-operacional[data-op-tema] .clip__escolhas { padding: 22px; }
body.produto-operacional[data-op-tema] .clip__rotulo { font-size: 10px; letter-spacing: .1em; }
body.produto-operacional[data-op-tema] .clip-formato { border-color: var(--line); border-radius: 12px; }
body.produto-operacional[data-op-tema] .clip-formato:is(.ativo, [aria-pressed="true"]) { border-color: var(--accent); }

/* Montagem: chrome explícito. Não remapear --me-text/--me-soft, usados em
 * amostras de conteúdo; não alterar .me-stage, .me-canvas ou suas dimensões. */
body.langris-identidade[data-op-tema] :is(.me-editor, .me-dialog) {
  --me-accent: var(--accent);
  --me-accent-hover: var(--accent-hover, var(--accent));
  --me-accent-soft: var(--exp-accent-soft);
  --me-border: var(--line);
  background: var(--panel);
  border-color: var(--line);
  color: var(--ink);
  color-scheme: inherit;
}
body.langris-identidade[data-op-tema] :is(
  .me-header, .me-toolbar, .me-library, .me-pages, .me-context,
  .me-context-popover, .me-page-menu > div, .me-inspector, .me-panel-close
) {
  background: var(--panel);
  border-color: var(--line);
  color: var(--ink);
}
body.langris-identidade[data-op-tema] .me-rail { background: var(--surface); border-color: var(--line); }
body.langris-identidade[data-op-tema] :is(.me-name, .me-library-content > h2, .me-dialog > h2) { color: var(--ink); }
body.langris-identidade[data-op-tema] :is(
  .me-eyebrow, .me-header small, .me-help, .me-toolbar label, .me-field,
  .me-footer span, .me-gesture-note, .me-local-note p, .me-dialog > p,
  .me-context-page, .me-context-popover > p
) { color: var(--muted); }
body.langris-identidade[data-op-tema] :is(.me-header, .me-toolbar, .me-footer, .me-rail) {
  font-family: var(--sans, 'Instrument Sans', sans-serif);
}
body.langris-identidade[data-op-tema] .me-rail button { color: var(--muted); }
body.langris-identidade[data-op-tema] .me-rail button.ativa {
  background: var(--exp-accent-soft);
  color: var(--exp-accent-text);
}
body.langris-identidade[data-op-tema] :is(.me-header-actions, .me-toolbar, .me-pages, .me-footer, .me-context, .me-dialog, .me-menu-actions, .me-section-head) .me-btn:not(.me-danger):not(.me-primary) {
  background: var(--panel);
  border-color: var(--line);
  color: var(--ink);
}
body.langris-identidade[data-op-tema] :is(.me-header-actions, .me-toolbar, .me-pages, .me-footer, .me-context, .me-dialog, .me-menu-actions, .me-section-head) .me-btn:not(.me-danger):not(.me-primary):hover:not(:disabled) {
  background: var(--surface-soft);
}
body.langris-identidade[data-op-tema] .me-btn.me-primary { background: var(--accent); border-color: var(--accent); color: white; }
body.langris-identidade[data-op-tema] .me-btn.me-primary:hover:not(:disabled) { background: var(--accent-hover, var(--accent)); }
body.langris-identidade[data-op-tema] :is(.me-toolbar select, .me-search, .me-size) {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}
body.langris-identidade[data-op-tema] .me-field :is(input:not([type="color"]):not([type="range"]), textarea, select) {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}
body.langris-identidade[data-op-tema] .me-pages [data-pagina] {
  background: var(--surface);
  border-color: var(--line);
  color: var(--muted);
}
body.langris-identidade[data-op-tema] .me-pages [data-pagina].ativa {
  background: var(--exp-accent-soft);
  border-color: var(--accent);
  color: var(--exp-accent-text);
}
body.langris-identidade[data-op-tema] .me-context .me-btn[aria-pressed="true"] {
  background: var(--exp-accent-soft);
  color: var(--exp-accent-text);
}
body.langris-identidade[data-op-tema] :is(.me-preset > strong, .me-template-card > strong) { color: var(--ink); }
body.langris-identidade[data-op-tema] :is(.me-preset > small, .me-template-card > small, .me-upload-card > small, .me-local-note > p) { color: var(--muted); }

/* Só o placeholder HTML, criado quando pg().elementos está vazio. O canvas
 * e seu documento não recebem cor, filtro, fonte ou alteração geométrica. */
body.langris-identidade[data-op-tema] .me-blank { background: #10182ae8; color: #f4f7ff; }
body.langris-identidade[data-op-tema] .me-blank strong { color: #f4f7ff; }
body.langris-identidade[data-op-tema] .me-blank p { color: #bdc9e1; }
body.langris-identidade[data-op-tema] .me-blank > span { color: #9eb8ff; }

/* Resultados, empresa, redes e pessoas: só superfícies e metadados do app. */
body.produto-operacional[data-op-tema] :is(.op-networks__intro h2, .op-instagram-profissional h3) {
  color: var(--ink);
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-weight: 600;
  letter-spacing: -.035em;
}
body.produto-operacional[data-op-tema] :is(
  .op-network-card strong, .op-social-account__preview strong,
  .op-social-account__details p strong, .op-social-slot strong,
  .op-social-network > strong, .op-social-count strong,
  .op-company-boundary strong, .op-demography-radar-link strong
) { color: var(--ink); }
body.produto-operacional[data-op-tema] :is(
  .op-networks__intro p, .op-network-card small, .op-network-card.em-breve > b,
  .op-network-later, .op-network-back, .op-network-roadmap,
  .op-instagram-profissional p, .op-instagram-profissional ol,
  .op-social-account__preview small, .op-social-account__details p,
  .op-social-account__details small, .op-social-slot small, .op-social-network > small,
  .op-social-company, .op-social-more, .op-social-count small,
  .op-company-context-intro p, .op-company-context-progress span,
  .op-company-context-progress small, .op-company-context__grid small,
  .op-company-context__save span, .op-company-boundary p,
  .op-demography-hero p, .op-demography-source span, .op-demography-source small,
  .op-demography-kpis span, .op-demography-card > div:first-child small,
  .op-demography-empty, .op-demography-pending p, .op-demography-radar-link p
) { color: var(--muted); }
body.produto-operacional[data-op-tema] :is(
  .op-network-card > b, .op-network-fields label span,
  .op-instagram-profissional > span, .op-instagram-profissional__ajuda
) { color: var(--exp-accent-text); }
body.produto-operacional[data-op-tema] .op-network-card.em-breve > b { color: var(--muted); }
body.produto-operacional[data-op-tema] .op-instagram-profissional__link {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
}
body.produto-operacional[data-op-tema] :is(
  .op-network-card.disponivel:hover, .op-network-card.disponivel:focus-visible,
  .op-social-slot:hover, .op-social-network.disponivel:hover, .op-social-network.mais:hover
) {
  background: var(--surface-soft);
  border-color: var(--accent);
  box-shadow: none;
}
body.produto-operacional[data-op-tema] :is(.op-network-later:hover, .op-network-back:hover) { color: var(--exp-accent-text); }
body.produto-operacional[data-op-tema] :is(.op-pub-tabs, .op-pub-filterbar, .op-demography-source) {
  background: var(--surface);
  border-color: var(--line);
  color: var(--muted);
  border-radius: 10px;
}
body.produto-operacional[data-op-tema] :is(.op-pub-account, .op-demography-accounts button) {
  background: var(--panel);
  border-color: var(--line);
  color: var(--muted);
  border-radius: 10px;
}
body.produto-operacional[data-op-tema] :is(.op-pub-account.ativo, .op-demography-accounts button.ativo) {
  background: var(--exp-accent-soft);
  border-color: var(--accent);
  color: var(--exp-accent-text);
}
body.produto-operacional[data-op-tema] :is(.op-demography-kpis article, .op-instagram-observed .op-kpis article) {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 12px;
}
body.produto-operacional[data-op-tema] :is(.op-person, .op-company-context__section) { border-color: var(--line); }
body.produto-operacional[data-op-tema] .op-network-fields label { color: var(--muted); }
body.produto-operacional[data-op-tema] .op-network-fields label > div {
  background: var(--surface);
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .op-network-fields input { color: var(--ink); }
body.produto-operacional[data-op-tema] .op-network-fields label > div:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--exp-accent-soft);
}
body.produto-operacional[data-op-tema] .op-network-fields > p { color: var(--muted); }
body.produto-operacional[data-op-tema] .op-network-fields .op-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}
body.produto-operacional[data-op-tema] .op-network-fields .op-dialog__nota {
  background: var(--surface);
  color: var(--muted);
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .op-network-fields .op-dialog__nota strong { color: var(--ink); }
body.produto-operacional[data-op-tema] .op-voce__icone { background: var(--surface-soft); color: var(--muted); }
body.produto-operacional[data-op-tema] .op-voce__titulo { letter-spacing: .09em; }

/* Radar e pauta: o globo, as fotos e o comportamento da gaveta são intocados. */
body.produto-operacional[data-op-tema] .op-radar-world {
  background: var(--panel);
  border-color: var(--line);
  border-radius: 16px;
}
body.produto-operacional[data-op-tema] :is(.op-radar-worldbar, .op-radar-filters, .op-radar-detail, .op-radar-stream) {
  background: var(--panel);
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .op-radar-detail h3 {
  font-family: var(--sans, 'Instrument Sans', sans-serif);
  font-size: 21px;
  letter-spacing: -.025em;
}
body.produto-operacional[data-op-tema] :is(.rp-lateral, .rp-lateral__topo) {
  background: var(--panel);
  border-color: var(--line);
}
body.produto-operacional[data-op-tema] .rp-item {
  background: var(--surface);
  border-color: var(--line);
  border-radius: 12px;
}
body.produto-operacional[data-op-tema] .rp-lateral__topo h2 { font-size: 16px; letter-spacing: -.02em; }
body.produto-operacional[data-op-tema] .rp-alca {
  background: var(--panel);
  border-color: var(--line);
  box-shadow: 0 4px 18px color-mix(in srgb, var(--ink) 10%, transparent);
}

/* Sete destinos (a aba Radar saiu do ar em 25/09/2026): uma única fileira até no celular. O legado declarava
 * colunas sem trocar display:flex e o menu aberto revelava largura excedente.
 * Apenas os gatilhos ficam compactos; os nomes acessíveis e os itens dos
 * dropdowns permanecem. Não mudar a altura da barra nem --rp-barra. */
@media (max-width: 1100px) {
  body.produto-operacional[data-op-tema] .op-sidebar nav {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 2px;
    min-width: 0;
    overflow: visible;
  }
  body.produto-operacional[data-op-tema] .op-sidebar nav > .op-grupo { min-width: 0; }
  body.produto-operacional[data-op-tema] .op-sidebar nav > button,
  body.produto-operacional[data-op-tema] .op-sidebar nav > .op-grupo > button {
    min-width: 0;
    padding-inline: 0;
    gap: 0;
  }
  body.produto-operacional[data-op-tema] .op-sidebar nav > button > span,
  body.produto-operacional[data-op-tema] .op-sidebar nav > .op-grupo > button > span {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }
  body.produto-operacional[data-op-tema] .op-sidebar nav > .op-grupo > button > .op-grupo__seta { margin-left: 0; }
  body.produto-operacional[data-op-tema] .op-sidebar nav > .op-grupo > button > .op-grupo__seta > .op-icone {
    width: 12px;
    height: 12px;
  }
}

/* Não encolher o calendário: os mínimos e cortes originais ficam intactos.
 * Só os grupos flexíveis e cards ganham respiro em telas pequenas. */
@media (max-width: 900px) {
  body.produto-operacional[data-op-tema] .op-head { flex-wrap: wrap; gap: 14px; }
  body.produto-operacional[data-op-tema] .op-head__actions { flex-wrap: wrap; }
  body.produto-operacional[data-op-tema] .op-studio-library-home > header { padding: 22px; }
  body.produto-operacional[data-op-tema] .op-library-toolbar label { min-width: 0; }
}
@media (max-width: 600px) {
  body.produto-operacional[data-op-tema] .op-main { padding-top: 20px; }
  body.produto-operacional[data-op-tema] .op-head { margin-bottom: 20px; }
  body.produto-operacional[data-op-tema] .op-head__actions { justify-content: flex-start; }
  body.produto-operacional[data-op-tema] .op-start .op-start-card__body { padding: 18px; }
  body.produto-operacional[data-op-tema] .op-start .op-start-notice > div { min-width: 0; }
  body.produto-operacional[data-op-tema] .op-studio-library-home > header { padding: 20px 16px; }
  body.produto-operacional[data-op-tema] .op-library-grid { gap: 14px; padding: 14px; }
  body.produto-operacional[data-op-tema] .op-library-empty { padding: 28px 16px; }
  body.produto-operacional[data-op-tema] .clip__escolhas { padding: 16px; }
  body.produto-operacional[data-op-tema] .clip__marca h2 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  body.produto-operacional[data-op-tema] :is(.op-start-card, .op-library-card) { transition: none; }
}
