/* NFLS-CLAW · Mission Control OS visual vocabulary. Presentation only; runtime and original selectors preserved. */
/*
  Fontes locais (Inter, JetBrains Mono e Newsreader), sem chamada a terceiros.

  Os WOFF2 são os binários oficiais do Google Fonts, sem alteração, sob a SIL Open
  Font License 1.1: origem, hash e licenças em src/assets/fonts/ (SOURCES.json e
  licenses/). São fontes variáveis, então um arquivo cobre toda a faixa de peso.

  O url() é RELATIVO a este CSS de propósito: o Vite empacota o arquivo em
  assets/ com caminho relativo ao CSS gerado, e isso resolve tanto na raiz do Mac
  quanto sob /fabiano-missioncontrol/ na VPS. Um caminho absoluto (/fonts/...)
  escaparia do prefixo da VPS.

  Latin e latin-ext são arquivos separados, com unicode-range: o navegador só
  baixa o latin-ext quando a página usa um caractere dele.
*/

/* Inter — latin-ext */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/mission-control/inter-latin-ext-variable.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Inter — latin */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/mission-control/inter-latin-variable.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* JetBrains Mono — latin-ext */
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("assets/fonts/mission-control/jetbrains-mono-latin-ext-variable.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* JetBrains Mono — latin */
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("assets/fonts/mission-control/jetbrains-mono-latin-variable.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Newsreader — latin-ext */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/mission-control/newsreader-latin-ext-variable.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Newsreader — latin */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/mission-control/newsreader-latin-variable.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
  Tokens do Mission Control OS: "sala de controle à noite, tipografia de revista".

  Duas camadas, nesta ordem de leitura:
  1. Sementes --rgb-*: canais RGB sem alfa, para compor `rgb(var(--rgb-x) / .3)`.
     Trocar a paleta inteira é mexer só aqui.
  2. Tokens semânticos --mc-*, --sp-*, --r-*, --fs-*: o que o sistema (system.css)
     e os primitivos (components/ui) consomem. Nenhum componente novo deve usar
     literal de cor.

  Este arquivo é importado ANTES de styles.css. O @theme do Tailwind (--color-*,
  --font-*, --radius-*) continua em styles.css e não é redefinido aqui.
*/

:root {
  /* ---- 1. Sementes (tema A, valores do tokenizador) ---- */
  --rgb-deep: 4 11 22;
  --rgb-on-accent: 6 21 28;
  --rgb-shadow: 0 0 0;
  --rgb-highlight: 255 255 255;
  --rgb-slate: 155 180 212;
  --rgb-fg: 255 248 242;
  --rgb-muted: 174 197 223;
  --rgb-accent: 125 242 218;
  --rgb-accent-2: 79 214 255;
  --rgb-violet: 217 180 255;
  --rgb-warm: 247 217 139;
  --rgb-warn: 246 166 25;
  --rgb-ok: 52 211 153;
  --rgb-danger: 251 113 133;
  --rgb-ice: 185 220 255;

  /* ---- 2a. Superfícies ----
     s1/s2/s3 são camadas de vidro (gelo sobre o navy), cada uma mais opaca que
     a anterior: s1 = painel, s2 = linha dentro do painel, s3 = hover/ativo. */
  --mc-bg: #080d18;
  --mc-s1: rgb(var(--rgb-ice) / 0.05);
  --mc-s2: rgb(var(--rgb-ice) / 0.08);
  --mc-s3: rgb(var(--rgb-ice) / 0.12);
  --mc-line: rgb(var(--rgb-ice) / 0.12);
  --mc-line-strong: rgb(var(--rgb-ice) / 0.24);
  /* Realce de 1 px no topo e sombra de elevação das superfícies N2. */
  --mc-hl: inset 0 1px 0 rgb(var(--rgb-highlight) / 0.06);
  --mc-shadow: 0 18px 48px rgb(var(--rgb-shadow) / 0.36);

  /* ---- 2b. Texto ----
     tx-3 é o tom mais fraco que ainda passa 4,5:1 sobre --mc-s2 composto sobre
     --mc-bg (medido 5,85:1), e também sobre s2 sobre a luz ambiente mais clara do
     fundo, com ciano a 10% (4,58:1). Mistura de --rgb-muted com o fundo; não clarear nem escurecer
     sem reconferir o contraste. */
  --mc-tx-1: rgb(var(--rgb-fg));
  --mc-tx-2: rgb(var(--rgb-muted));
  --mc-tx-3: rgb(133 155 176);
  /* Texto sobre preenchimento sólido de acento (botão primário, aba ativa). */
  --mc-on-accent: rgb(var(--rgb-on-accent));

  /* ---- 2c. Acentos ----
     Cada um em quatro peças: cor cheia, -soft (fundo a 10%), -line (borda a 30%)
     e -glow (sombra de brilho, pronta para box-shadow). */
  --mc-op: rgb(var(--rgb-accent));
  --mc-op-soft: rgb(var(--rgb-accent) / 0.1);
  --mc-op-line: rgb(var(--rgb-accent) / 0.3);
  --mc-op-glow: 0 0 24px -6px rgb(var(--rgb-accent) / 0.45);

  --mc-attn: rgb(var(--rgb-warm));
  --mc-attn-soft: rgb(var(--rgb-warm) / 0.1);
  --mc-attn-line: rgb(var(--rgb-warm) / 0.3);
  --mc-attn-glow: 0 0 24px -6px rgb(var(--rgb-warm) / 0.45);

  --mc-life: rgb(var(--rgb-violet));
  --mc-life-soft: rgb(var(--rgb-violet) / 0.1);
  --mc-life-line: rgb(var(--rgb-violet) / 0.3);
  --mc-life-glow: 0 0 24px -6px rgb(var(--rgb-violet) / 0.45);

  --mc-risk: rgb(var(--rgb-danger));
  --mc-risk-soft: rgb(var(--rgb-danger) / 0.1);
  --mc-risk-line: rgb(var(--rgb-danger) / 0.3);
  --mc-risk-glow: 0 0 24px -6px rgb(var(--rgb-danger) / 0.45);

  --mc-ok: rgb(var(--rgb-ok));
  --mc-ok-soft: rgb(var(--rgb-ok) / 0.1);
  --mc-ok-line: rgb(var(--rgb-ok) / 0.3);
  --mc-ok-glow: 0 0 24px -6px rgb(var(--rgb-ok) / 0.45);

  /* ---- 2d. Espaço (px) ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-14: 56px;

  /* ---- 2e. Raio ---- */
  --r-ctl: 10px;
  --r-row: 14px;
  --r-card: 18px;
  --r-surface: 22px;
  --r-hero: 28px;

  /* ---- 2f. Tipo ----
     Piso de 12 px, sem exceção: não existe token abaixo de --fs-meta. */
  --fs-meta: 12px;
  --fs-ui: 13px;
  --fs-body: 14px;
  --fs-lead: 16px;
  --fs-h3: 18px;
  --fs-h2: 22px;
  --fs-h1: 30px;
  --fs-hero: clamp(28px, 3.2vw, 44px);

  /* ---- 2g. Movimento ----
     Só transform e opacity, de 160 a 240 ms. */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 160ms;
  --t-med: 240ms;

  /* Alvo mínimo de toque/clique: 32 px no desktop, 44 px no celular. */
  --mc-hit: 32px;
}

@media (min-width: 1280px) {
  :root {
    --fs-h1: 36px;
  }
}

@media (max-width: 760px) {
  :root {
    --mc-hit: 44px;
  }
}

/* Quem pede menos movimento não recebe nenhum: os tokens zeram e o system.css
   cuida de animações e transições declaradas com valores fixos. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 0ms;
    --t-med: 0ms;
  }
}

:root,html[data-tema="escuro"],html:not([data-tema="claro"]){
 --arena-navy:#080d18;--arena-blue:#121c2c;--arena-ink:#06151c;--arena-cyan:#7df2da;--arena-red:#7df2da;--arena-lime:#34d399;
 --arena-rule:rgb(185 220 255 / .12);--arena-copy:#fff8f2;--arena-muted:#aec5df;--arena-field:#040b16;
 --bg:var(--arena-navy);--fundo:var(--arena-navy);--painel:var(--arena-blue);--cartao:var(--arena-blue);--fundo2:#182536;--suave:#182536;--header:#080d18;
 --texto:var(--arena-copy);--txt:var(--arena-copy);--fraco:var(--arena-muted);--muted:var(--arena-muted);--time:#859bb0;--linha:var(--arena-rule);--line:var(--arena-rule);
 --accent:#7df2da!important;--acento1:#7df2da;--acento2:#7df2da;--ok:#34d399;--erro:#fb7185;--espera:#f7d98b;--neutro:#859bb0;
 --fonte:"Inter",sans-serif;--arena-display:"Newsreader",Georgia,serif;--bub-in:#121c2c;--bub-out:#183731;--raio:18px;--header-h:76px;
 --sombra:0 8px 30px rgba(0,0,0,.08);--c-esperando:#f7d98b;--b-esperando:#3b331e;--c-travada:#fb7185;--b-travada:#411d32;--c-parada:#f7d98b;--b-parada:#3b331e;--c-fazendo:#34d399;--b-fazendo:#25361f;--c-fechada:#aec5df;--b-fechada:#1a324d;
 color-scheme:dark;
}
html[data-tema="claro"]{--arena-navy:#eef3f8;--arena-blue:#fff;--arena-field:#e4edf5;--arena-rule:#b8c8d9;--arena-copy:#080d18;--arena-muted:#455b73;--arena-cyan:#006b60;--bg:#eef3f8;--fundo:#eef3f8;--painel:#fff;--cartao:#fff;--header:#fff;--texto:#080d18;--txt:#080d18;--fraco:#455b73;--muted:#455b73;--linha:#b8c8d9;--line:#b8c8d9;--fundo2:#e7eff7;--suave:#e7eff7;--bub-in:#fff;--bub-out:#d7edf5;--time:#455b73;--acento1:#006b60;--acento2:#00554e;--ok:#385a00;--erro:#a71d39;--espera:#715100;color-scheme:light}
html{background:var(--bg);scrollbar-color:#40526b var(--arena-navy)}
body:not(.nfls-auth),html.casca body{background:var(--bg);color:var(--texto);font-family:var(--fonte);-webkit-font-smoothing:antialiased}
body :is(button,input,textarea,select){font-family:var(--fonte)}
body :is(button,[role="button"],a.btn,a.ml-tab,a.lp-voltar,a.mz-volta,.link-aba,.mz-links a,.lf-ver){min-height:44px;min-width:44px}
body :is(button,[role="button"]){cursor:pointer}
body :is(button,[role="button"]):disabled{cursor:not-allowed}
body :is(input,select,textarea):not([type="hidden"],[type="checkbox"],[type="radio"]){min-height:44px;font-size:16px}
body input[type="checkbox"],body input[type="radio"]{accent-color:#7df2da}
body :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible{outline:3px solid #7df2da!important;outline-offset:3px!important}
body a:not(.auth-arena){text-underline-offset:4px}
body :is(h1,h2,h3,h4){text-wrap:balance}
body :is(.section-title,.header-titulo,.mz-bloco-cab h3,.lp-sec h2,.av-sec h2){font-family:var(--arena-display);font-size:24px;line-height:1.1;letter-spacing:-.02em;text-transform:none;color:var(--texto)}
body :is(.num,.val,.meta,.mz-pnum,.mz-conta,.av-dia-t,.section-updated,.header-status,.topo){font-variant-numeric:tabular-nums}
body :is(.mz-main,.lp-main,.content,.av-raiz){min-width:0}
body :is(.mz-main,.lp-main,.content){padding:28px clamp(16px,2.5vw,36px) 56px}
body :is(.mz-main,.lp-main,.av-raiz)::before{content:"NFLS-CLAW / CENTRO DE COMANDO";display:block;margin:0 0 22px;font:600 10px var(--fonte);letter-spacing:.14em;color:var(--muted)}
body :is(.mz-main,.av-raiz){max-width:1440px}
body .lp-main{max-width:1120px}
body :is(.mz-cartao,.lp-sec,.av-sec,.cartao,.destaque,.modal-box,.memory-item,.rotina,.op-card){background:var(--painel);border-color:var(--linha);border-radius:18px;box-shadow:var(--sombra)}
body :is(.lp-sec,.av-sec,.cartao){padding:24px}
body :is(.mz-cartao,.mz-form){padding:18px}
body :is(.lp-sec,.av-sec){margin:0 0 16px}
body :is(.mz-erro,.erroconfig,.vazio-util,.mz-vazio.grande,.lp-vazio,.av-vazio){padding:22px;border:1px solid var(--linha);border-left:3px solid #7df2da;border-radius:10px;background:var(--fundo2);color:var(--muted);line-height:1.6}
body .erroconfig{max-width:660px;margin:10vh auto;padding:32px;color:var(--texto)}
body .erroconfig h1{font:700 40px/1 var(--arena-display);margin-top:0}
body .erroconfig a{display:inline-flex;align-items:center;min-height:44px;color:var(--acento1)}
body .mz-erro,body .lp-msg.erro,body .av-erro{color:var(--erro)}
body :is(.lp-msg.ok,.av-ok,.av-status.av-ok){color:var(--ok)}
body :is(.btn,.mz-btn,.mz-chip,.mz-data,.lp-btn,.av-btn,.av-ajuda,.lp-ajuda,.mz-ajuda,.mini,.btn-leve,.btn-tutorial-aba,.btn-tema,.gm-tut){border:1px solid var(--linha);border-radius:10px;background:var(--fundo2);color:var(--texto)}
body :is(.mz-btn.pri,.mz-chip.on,.lp-btn.pri,.av-primario,.btn.on,.mini.on,.vispede-ok){background:#7df2da;color:#06151c;border-color:#7df2da}
body :is(.btn,.mz-btn,.mz-chip,.lp-btn,.av-btn,.tab,.ml-tab):hover{border-color:#7df2da;background:var(--fundo2);color:var(--texto)}
body :is(.mz-btn.pri,.mz-chip.on,.lp-btn.pri,.av-primario,.btn.on):hover{background:#a7f8e7;color:#06151c}
body :is(.mz-form input,.mz-form textarea,.mz-form select,.lp-form input,.lp-form select,.lp-form textarea,.av-raiz input,.av-raiz select,.av-raiz textarea){background:var(--arena-field);color:var(--texto);border:1px solid #40526b;border-radius:10px}
body :is(.lp-fraco,.av-fraco,.lp-agendador,.mz-dica,.mz-vazio,.av-cont,.ajuda-secao){color:var(--muted);line-height:1.6}
body :is(.mz-selo,.mz-cont){border-radius:10px}
body .mz-cartao.fechada{opacity:.8}
body :is(.mz-abas,.mz-topo,.lp-topo){background:var(--header);border-color:var(--linha)}
body .mz-abas{padding:0 24px;gap:12px}
body .mz-aba{font:700 20px var(--arena-display);letter-spacing:.04em;min-height:56px;text-transform:none}
body .mz-aba.ativa{border-bottom-color:#7df2da}
/* Shared agent shell: brand first, then the actual agent identity. */
.nfls-menu-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;width:100%;padding:0 0 18px;border-bottom:1px solid var(--linha);margin-bottom:4px;color:var(--texto);text-decoration:none}
.nfls-menu-brand img{width:88px;height:44px;object-fit:contain}
.nfls-menu-brand span{display:flex;flex-direction:column;gap:3px;font:700 20px/1 var(--arena-display);letter-spacing:.03em}
.nfls-menu-brand small{color:var(--muted);font:600 8px/1.4 var(--fonte);letter-spacing:.08em}
body aside#menu{--ml-painel:var(--arena-navy);--ml-fundo2:var(--fundo2);--ml-linha:var(--arena-rule);--ml-texto:var(--arena-copy);--ml-fraco:var(--arena-muted);--ml-a1:#7df2da;--ml-a2:#7df2da;background:var(--arena-navy);color:var(--texto);padding:22px 16px 14px;gap:18px;border-right:1px solid var(--linha)}
body :is(.ml-moldura,.lado .moldura){width:80px;height:80px;margin:4px auto 12px}
body :is(.ml-foto,.lado .sprite-gif){width:68px;height:68px;font-size:27px}
body .ml-moldura::before,body .lado .moldura::before{background:conic-gradient(from 210deg,#7df2da,#21344a,#7df2da,#7df2da)}
body :is(.ml-nome,.char-name){font:700 24px/1.1 var(--arena-display);letter-spacing:.015em}
body aside#menu :is(.gm-tut,.pe .sair){border-radius:10px;background:var(--fundo2);color:var(--texto);border-color:var(--linha)}
body aside#menu :is(.ml-tab,.ml-troca>button){min-height:48px;border-radius:10px;font-size:15px}
body aside#menu .ml-tab.ativo,body .tab.active{background:var(--fundo2);color:var(--texto);border-left:3px solid #7df2da;box-shadow:none}
body aside#menu .ml-config h3{color:var(--muted);font:600 10px var(--fonte);letter-spacing:.1em}
body aside#menu .fechar{color:var(--muted);background:var(--arena-navy)}
body #cabecalho,html.casca body #cabecalho{background:var(--header);color:var(--texto);border-bottom:1px solid var(--linha);box-shadow:none;gap:12px;padding-inline:20px;min-height:76px}
body #cabecalho :is(.av){width:44px;height:44px;flex-basis:44px;border-radius:18px}
body #cabecalho .av img{border-radius:10px}
body #cabecalho .who::before{content:"NFLS-CLAW";display:block;color:var(--muted);font:600 9px/1.2 var(--fonte);letter-spacing:.12em;margin-bottom:3px}
body #cabecalho .who b{font:700 21px/1.1 var(--arena-display);letter-spacing:-.02em;color:var(--texto)}
body #cabecalho .who span{font-size:12px;color:var(--muted);margin-top:3px}
body #cabecalho .btn{background:var(--fundo2);border-color:var(--linha);color:var(--texto);min-height:44px;border-radius:10px;font-family:var(--fonte)}
body #overlayMenu{background:rgba(3,10,23,.8)}
/* Conversation has the geometry of a playbook, without decoration per message. */
body #chat{background:linear-gradient(90deg,rgba(33,212,253,.025) 1px,transparent 1px),var(--arena-field);background-size:96px 100%;padding:28px 28px 22px}
body .wrap{max-width:980px}
body .bub{padding:16px 18px 12px;border:1px solid var(--linha);border-radius:18px;box-shadow:none;line-height:1.6}
body .row.her .bub{background:var(--bub-in);border-left:3px solid #7df2da;border-bottom-left-radius:4px}
body .row.me .bub{background:var(--bub-out);border-bottom-right-radius:4px}
body .bub a{color:var(--acento1)}
body .dia span{background:var(--arena-navy);color:var(--muted);border:1px solid var(--linha);border-radius:10px;box-shadow:none;font-size:11px;letter-spacing:.06em}
body .topo{color:var(--muted)}
body .barra{background:var(--header);border-color:var(--linha);padding:12px 20px}
body #entrada,body #entrada:focus{background:var(--arena-field);color:var(--texto);border-radius:18px;border-color:#40526b}
body #entrada:focus{border-color:#7df2da}
body #entrada::placeholder{color:var(--muted)}
body #btnAnexo,body #btnMic{background:var(--fundo2);border:1px solid var(--linha);color:var(--texto);border-radius:18px}
body #btnEnviar{border-radius:18px;background:#7df2da;color:#06151c}
body #btnMic{width:46px;height:46px;flex-basis:46px;font-size:20px}
body #micTxt{background:var(--arena-field);color:var(--muted)}
body :is(.visq,.vispede,.vispede-cheia){background:var(--fundo2);color:var(--texto)}
body :is(.vist,.vispede-rot){color:var(--texto)}
body #tourCaixa,html.casca body #tourCaixa{background:var(--painel);color:var(--texto);border:1px solid var(--linha);border-top:3px solid #7df2da;border-radius:18px;font-family:var(--fonte)}
body #tourCaixa .tour-acoes,html.casca body #tourCaixa .tour-acoes{background:var(--painel)}
body #tourCaixa :is(.tour-n,p b){color:var(--muted)}
body #tourCaixa button,html.casca body #tourCaixa button{background:var(--fundo2);border-color:var(--linha);color:var(--texto);border-radius:10px;min-height:44px}
body #tourCaixa button.pri,html.casca body #tourCaixa button.pri{background:#7df2da;color:#06151c;border-color:#7df2da}
/* Panel: scoreboard scale and sober operational states. */
body .lado{background:var(--arena-navy);padding:22px 16px;border-color:var(--linha)}
body .lado>.marca{width:100%}
body .content{max-width:1440px}
body .header{background:var(--arena-navy);padding:26px 32px;border-color:var(--linha)}
body .header-titulo{font-size:34px}
body .section-title{font-size:23px;margin-bottom:16px}
body .destaque{border-top:2px solid #7df2da;border-radius:10px;padding:20px}
body .destaque .num{font:700 42px/1 var(--arena-display)}
body .pixel-table th{font-size:11px;letter-spacing:.06em;color:var(--muted)}
body .pixel-table td{font-size:14px}
body :is(.selo,.mood-badge){border-radius:10px;box-shadow:none}
body .faixa-estado{padding-bottom:18px;border-bottom:1px solid var(--linha)}
body .bolha.de-voce{background:#183731;color:#fff8f2}
body .av-raiz{--av-linha:var(--linha);--av-texto:var(--texto);--av-fraco:var(--muted);--av-fundo2:var(--fundo2);--av-acento:#7df2da;padding:28px clamp(16px,2.5vw,36px) 56px}
body.lp{--lp-txt:var(--texto);--lp-fraco:var(--muted);--lp-linha:var(--linha);--lp-acento:#7df2da;--lp-fundo:var(--bg);background:var(--bg);color:var(--texto);font-family:var(--fonte)}
@media(min-width:1100px){body #cabecalho{padding-inline:28px}body .mz-main{padding-top:32px}}
@media(max-width:700px){body #cabecalho,html.casca body #cabecalho{padding-inline:8px;gap:8px}body #chat{padding:20px 12px}body .bub{max-width:94%;padding:12px 14px}body .barra{padding:10px 8px}body :is(.lp-sec,.av-sec,.cartao){padding:18px}body .mz-abas{padding:0 12px;gap:0}body #cabecalho .who b{font-size:19px}body #btnTutorial{font-size:12px;padding-inline:9px}body .nfls-menu-brand{margin-top:22px}body .lp-main{gap:4px}body .lp-form{grid-template-columns:1fr}body .lp-form .larga{grid-column:auto}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Secondary states: all are the app's real states, never fabricated activity. */
body .vazio{max-width:580px;margin:clamp(40px,10vh,120px) auto 36px;padding:36px;border:1px solid var(--linha);border-top:3px solid #7df2da;background:var(--painel);color:var(--texto);border-radius:18px;text-align:left}
body .vazio .vz-ico{color:#7df2da;font-size:32px;text-align:left;margin:0 0 22px}
body .nfls-empty-kicker{display:block;color:var(--muted);font-size:10px;letter-spacing:.12em;margin-bottom:10px}
body .vazio b{display:block;font:700 38px/1 var(--arena-display);text-transform:none;margin-bottom:16px}
body .vazio small{font:400 15px/1.6 var(--fonte);color:var(--muted)}
body :is(.btn-principal,.btn-enviar,.btn-reativar,.sx-btn.prim,.sx-chip[aria-selected="true"],.prov-btn,.dgc-salvar,.dgl-btn.principal){background:#7df2da;color:#06151c;border-color:#7df2da;border-radius:10px}
body :is(.foco,.foco-faixa .foco-corpo,.dgcofre,.cartaoarq,.vispede,.dgc-valor,.cita,.cod pre,.codcopia,.midoff,.vispede-nao,.vish .visfull,.vish .midbx,.vtcfecha){background:var(--painel);color:var(--texto);border-color:var(--linha);border-radius:10px}
body :is(.foco-caixa){background:var(--arena-field);color:#06151c}
body .foco-faixa{height:44px}body .foco-faixa .foco-cab{height:44px}body .foco-faixa .foco-corpo{top:44px}
body :is(.foco-aviso,.dgc-msg,.nas-erro,.lc-erro,.pc-erro){color:var(--erro);background:var(--b-travada)}
body #loginCartao.lc,body #permCartao.pc{background:var(--painel);color:var(--texto);border-color:var(--linha);border-top:3px solid #7df2da;border-radius:18px}
body #loginCartao .lc-btn,body #permCartao .pc-nega{background:var(--fundo2);color:var(--texto);border-color:var(--linha);border-radius:10px}
body #loginCartao :is(.lc-principal,.lc-link),body #permCartao .pc-aprova{background:#7df2da;color:#06151c;border-color:#7df2da;border-radius:10px}
body #loginCartao :is(.lc-campo,.lc-disp-cod){background:var(--arena-field);color:var(--texto);border-color:var(--linha)}
body .nascimento{--nas-verde:#7df2da;background:var(--painel);border-color:var(--linha);border-top:3px solid #7df2da;border-radius:18px;color:var(--texto);box-shadow:var(--sombra)}
body .nascimento :is(input:not([type=file]),textarea,select){background:var(--arena-field);color:var(--texto);border-color:#40526b;border-radius:10px}
body .nascimento button{background:var(--fundo2);color:var(--texto);border-color:var(--linha);border-radius:10px}
body .nascimento .nas-principal{background:#7df2da;color:#06151c;border-radius:10px}
body :is(.nas-nota,.nas-foto small,.nas-marca,.nas-etapa){color:var(--muted)}
body :is(.nas-badge,.nas-avatar,.nas-retrato){background:var(--fundo2);color:var(--texto);border-color:var(--linha);border-radius:18px;box-shadow:none}
body .nas-aura{background:#7df2da;opacity:.12}
body .nas-face{background:var(--arena-blue);border-color:#7df2da;box-shadow:inset 0 0 25px #080d18}
body .nas-frente::after{color:#7df2da}body .nas-tampa{background:#21344a}
body :is(.lp-tabela tr,.av-aviso){background:var(--painel);color:var(--texto);border-color:var(--linha)}
body :is(.av-tipo,.av-link,.av-e-recado){color:var(--acento1)}
body .av-resposta{background:var(--b-fazendo);color:var(--ok)}
body :is(.av-perigo,.lp-btn.perigo){background:#90243a;color:#fff;border-color:#d87586}
body :is(.lf,.barra-aviso){background:var(--b-esperando);color:var(--c-esperando);border-color:#766237}
body .lf :is(button,.lf-ver,.lf-txt small){background:transparent;color:var(--c-esperando);border-color:#766237}
body .lf .lf-feito{background:#34d399!important;border-color:#34d399!important;color:#06151c!important}
body :is(.lp-chip,.lp-chip.encerrado,.lp-chip.feito,.lp-chip.cancelada,.lp-chip.perdida){background:var(--fundo2);color:var(--texto)}
body :is(.lc,.pc,.nascimento,.foco) :is(a,button){min-height:44px;min-width:44px}
body :is(.btn-enviar,.btn-principal,.sx-btn,.prov-btn):hover{filter:brightness(1.12)}
@media(max-width:700px){body .vazio{padding:26px;margin-block:40px}body .vazio b{font-size:32px}}

/* Contrast corrections for compact telemetry and recording states. */
body :is(#btnContinua.on,#btnSigilo.on,.codcopia.ok,.fimnovas){background:#7df2da;color:#06151c}
body :is(.op-resumo-icone,.home-operacoes .hop-icone){color:#06151c}
body .btn-microfone.gravando,body #btnMic.gravando{background:#a4223b;border-color:#d87586;color:#fff}
body .av-tipo{background:var(--fundo2);color:var(--texto);border-left:2px solid var(--av-cor,#7df2da);border-radius:2px}
body #lightbox,body #visTela{background:var(--arena-field);color:var(--texto)}
body :is(.lbtopo,.lbtopo a,.lbtopo button){background:var(--header);color:var(--texto);border-color:var(--linha)}
body .lbcorpo .vcard{background:var(--painel);color:var(--texto);border-color:var(--linha)}
body .lbcorpo .vcard small{color:var(--muted)}

/* Readback mobile: privacy and sign-out targets must remain touch-sized. */
body #cabecalho #btnSigilo{min-width:44px;min-height:44px;flex-shrink:0}
body aside#menu :is(.gm-tut,.pe .sair){min-width:44px;min-height:44px}

/* Marca em elementos decorativos: dados e retratos dos agentes permanecem originais. */
body #cabecalho .who::before{padding-left:46px;background:url("assets/brand/arena-football.svg") left center/38px 20px no-repeat;min-height:20px;line-height:20px}
body .lado::before{content:"NFLS-CLAW";display:block;background:url("assets/brand/arena-football.svg") left top/100px 48px no-repeat;padding-top:56px;margin-bottom:16px;font:700 22px/1 "Newsreader",Georgia,serif;letter-spacing:.05em;color:var(--texto)}

/* Revisão independente: filtros, histórico e estados em ambos os temas. */
body .lp-filtros select{background:var(--arena-field);color:var(--texto);border-color:#40526b}
body .lp-hist td{background:var(--painel);color:var(--texto);border-color:var(--linha)}
body :is(.av-erro-bloco,.av-e-falha){color:var(--erro);background:var(--fundo2);border-color:var(--linha)}
body .av-situacao{color:var(--espera);background:var(--fundo2)}
html[data-tema="claro"]{--c-esperando:#715100;--b-esperando:#fff1c8;--c-travada:#a71d39;--b-travada:#ffe4e9;--c-parada:#715100;--b-parada:#fff1c8;--c-fazendo:#385a00;--b-fazendo:#e5f2c7;--c-fechada:#455b73;--b-fechada:#e7eff7}

body :is(.av-status.av-erro,.av-cont.av-passou){color:var(--erro)}
html[data-tema="claro"] body :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible{outline-color:#006b60!important}

html.casca body #tourCaixa :is(.tour-n,p b){color:var(--muted)}

/* Em largura extrema, mantenha todos os controles da casca alcançáveis. */
@media(max-width:420px){
 html.casca body #cabecalho{flex-wrap:wrap}
 html.casca body #cabecalho .who{flex:1 1 90px}
 html.casca body #cabecalho .btn{flex-shrink:0}
}

/* Títulos de erro mantêm o contraste do tema em texto compacto. */
body .app-erro strong{color:var(--erro)}

/* Adaptação da cascata final Mission Control. Tokens locais, sem shell React. */
:root,html[data-tema="escuro"],html:not([data-tema="claro"]){
 --arena-navy:var(--mc-bg);--arena-blue:#121c2c;--arena-field:#040b16;--arena-rule:var(--mc-line);--arena-copy:var(--mc-tx-1);--arena-muted:var(--mc-tx-2);
 --bg:var(--mc-bg);--fundo:var(--mc-bg);--painel:var(--mc-s1);--cartao:var(--mc-s1);--fundo2:var(--mc-s2);--suave:var(--mc-s2);--header:#0b1322;
 --texto:var(--mc-tx-1);--txt:var(--mc-tx-1);--fraco:var(--mc-tx-2);--muted:var(--mc-tx-2);--linha:var(--mc-line);--line:var(--mc-line);--time:var(--mc-tx-2);
 --fonte:"Inter",sans-serif;--arena-display:"Newsreader",Georgia,serif;--accent:var(--mc-op)!important;--acento1:var(--mc-op);--acento2:var(--mc-op);--ok:var(--mc-ok);--erro:var(--mc-risk);--espera:var(--mc-attn);
 --sombra:var(--mc-hl),var(--mc-shadow);--bub-in:#142031;--bub-out:#163a35;
 --c-esperando:var(--mc-attn);--b-esperando:#342c1e;--c-travada:var(--mc-risk);--b-travada:#351b2c;--c-fazendo:var(--mc-ok);--b-fazendo:#10352d;--c-parada:var(--mc-attn);--c-fechada:var(--mc-tx-2);
}
html[data-tema="claro"]{--mc-bg:#eef3f8;--mc-tx-1:#102337;--mc-tx-2:#435b72;--mc-tx-3:#526980;--mc-op:#006b60;--mc-attn:#705000;--mc-life:#734798;--mc-risk:#a92243;--mc-ok:#146c4c;--mc-s1:rgb(255 255 255 / .9);--mc-s2:rgb(18 44 70 / .055);--mc-s3:rgb(18 44 70 / .09);--mc-line:rgb(18 44 70 / .16);--mc-line-strong:rgb(18 44 70 / .3);--mc-shadow:0 18px 48px rgb(18 44 70 / .08);--arena-navy:#eef3f8;--arena-blue:#fff;--arena-field:#e6eef5;--arena-rule:var(--mc-line);--arena-copy:var(--mc-tx-1);--arena-muted:var(--mc-tx-2);--bg:var(--mc-bg);--fundo:var(--mc-bg);--painel:var(--mc-s1);--cartao:var(--mc-s1);--header:#f5f8fc;--texto:var(--mc-tx-1);--txt:var(--mc-tx-1);--muted:var(--mc-tx-2);--fraco:var(--mc-tx-2);--linha:var(--mc-line);--line:var(--mc-line);--fundo2:var(--mc-s2);--suave:var(--mc-s2);--bub-in:#fff;--bub-out:#d7eeea;--acento1:var(--mc-op);--acento2:var(--mc-op);--ok:var(--mc-ok);--erro:var(--mc-risk);--espera:var(--mc-attn);--time:var(--mc-tx-2)}
body:not(.nfls-auth),html.casca body{background:radial-gradient(ellipse at 8% 0%,rgb(125 242 218 / .09),transparent 48%),radial-gradient(ellipse at 95% 100%,rgb(247 217 139 / .04),transparent 45%),linear-gradient(160deg,#0b1322,#0a1020 55%,#0a1a26);background-attachment:fixed}
html[data-tema="claro"] body{background:linear-gradient(160deg,#f4f7fc,#edf3f8 55%,#e7f1f1)}
body :is(h1,h2,h3,h4,.header-titulo,.section-title,.mz-bloco-cab h3,.lp-sec h2,.av-sec h2){font-family:var(--arena-display);font-weight:500;letter-spacing:-.02em;text-transform:none;line-height:1.12}
body :is(.section-title,.mz-bloco-cab h3,.lp-sec h2,.av-sec h2){font-size:26px}
body .header-titulo{font-size:36px}
body :is(.num,.val,.meta,.mz-pnum,.mz-conta,.av-dia-t,.section-updated,.header-status,.topo,.nfls-empty-kicker){font-family:"JetBrains Mono",monospace;font-variant-numeric:tabular-nums}
body :is(.meta,.section-updated,.header-status,.topo,.nfls-empty-kicker){font-size:12px}
body :is(.mz-main,.lp-main,.av-raiz)::before{font:500 12px/1.5 "JetBrains Mono",monospace;letter-spacing:.14em;color:var(--mc-tx-3);margin-bottom:24px}
body :is(.mz-cartao,.lp-sec,.av-sec,.cartao,.destaque,.modal-box,.memory-item,.rotina,.op-card){border:1px solid var(--mc-line);border-radius:var(--r-card);box-shadow:var(--mc-hl),0 12px 32px rgb(0 0 0 / .12)}
body :is(.lp-sec,.av-sec,.modal-box){border-radius:var(--r-surface)}
body :is(.mz-cartao,.mz-form){padding:20px}
body :is(.vazio,.erroconfig){border:1px dashed var(--mc-line-strong);border-radius:var(--r-surface);box-shadow:var(--mc-hl)}
body .vazio b{font:500 38px/1.1 var(--arena-display);text-transform:none}
body :is(.btn,.mz-btn,.mz-chip,.lp-btn,.av-btn,.av-ajuda,.mini,.btn-tema,.gm-tut){border-radius:var(--r-ctl);transition:background 160ms cubic-bezier(.2,.7,.2,1),border-color 160ms cubic-bezier(.2,.7,.2,1)}
body :is(.mz-btn.pri,.mz-chip.on,.lp-btn.pri,.av-primario,.btn.on,.mini.on,.vispede-ok,.btn-principal,.btn-enviar,.btn-reativar,.sx-btn.prim,.prov-btn,.dgc-salvar){background:#7df2da;color:#06151c;border-color:#7df2da}
body aside#menu{background:var(--header);--ml-painel:var(--header);gap:12px;padding:24px 16px 14px}
body aside#menu :is(.ml-tab,.ml-troca>button){border-radius:var(--r-ctl);font-size:13px;font-weight:500;min-height:44px}
body aside#menu .ml-tab{color:var(--mc-tx-2);padding:9px 12px}
body aside#menu .ml-tab.ativo,body .tab.active{background:var(--mc-s3);border-left:0;box-shadow:inset 2px 0 0 var(--mc-op),var(--mc-hl);color:var(--mc-tx-1)}
body aside#menu .ml-tab:hover{background:var(--mc-s2);color:var(--mc-tx-1)}
body :is(.ml-nome,.char-name){font:500 25px/1.12 var(--arena-display);letter-spacing:-.02em}
body :is(.ml-moldura,.lado .moldura){width:68px;height:68px;margin:0 auto 8px}
body :is(.ml-foto,.lado .sprite-gif){width:56px;height:56px;font-size:24px;box-shadow:none}
body .ml-moldura::before,body .lado .moldura::before{background:linear-gradient(140deg,#7df2da66,#4fd6ff22,#f7d98b33)}
.nfls-menu-brand{gap:12px;padding-bottom:20px}.nfls-menu-brand img{width:58px;height:32px}.nfls-menu-brand span{font:500 23px/1 var(--arena-display);letter-spacing:-.02em}.nfls-menu-brand small{font:500 10px/1.5 "JetBrains Mono",monospace;letter-spacing:.08em}
body #cabecalho,html.casca body #cabecalho{min-height:80px;background:var(--header);box-shadow:var(--mc-hl);padding-block:10px;border-color:var(--mc-line)}
body #cabecalho .who::before{color:var(--mc-tx-3);font:500 11px/20px "JetBrains Mono",monospace;letter-spacing:.12em}
body #cabecalho .who b{font:500 25px/1.1 var(--arena-display);letter-spacing:-.02em}
body #cabecalho .who span{color:var(--mc-tx-2);font-size:12px}
body #cabecalho .av,body #cabecalho .av img{border-radius:var(--r-row)}
body .mz-abas{gap:20px;background:transparent;padding-inline:28px}
body .mz-aba{font:500 14px/1.4 var(--fonte);letter-spacing:0;text-transform:none;min-height:56px}
body .mz-aba.ativa{color:var(--mc-op);border-bottom-color:var(--mc-op)}
body #chat{background:transparent;padding-top:32px}
body .bub{border-radius:var(--r-card);box-shadow:var(--mc-hl);line-height:1.65}
body .row.her .bub{border-left:1px solid var(--mc-line);border-bottom-left-radius:6px}
body .row.me .bub{border-bottom-right-radius:6px}
body .dia span{border-radius:999px;font:11px/1.6 "JetBrains Mono",monospace;background:var(--header)}
body .barra{background:var(--header)}body #entrada{border-radius:var(--r-row)}
body :is(#btnAnexo,#btnMic,#btnEnviar){border-radius:var(--r-ctl)}
body .destaque .num{font:500 38px/1.1 "JetBrains Mono",monospace}
body :is(.selo,.mood-badge,.mz-selo,.mz-cont){border-radius:999px}
body #tourCaixa,html.casca body #tourCaixa{background:var(--header);border:1px solid var(--mc-line-strong);border-radius:var(--r-surface);box-shadow:var(--mc-shadow)}
body :is(.foco,.dgcofre,.cartaoarq,.dgc-valor,.cita,.cod pre,.codcopia){border-radius:var(--r-row)}
body #loginCartao.lc,body #permCartao.pc,body .nascimento{background:var(--header);border:1px solid var(--mc-line-strong);border-radius:var(--r-surface)}
body :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible{outline:2px solid var(--mc-op)!important;outline-offset:2px!important}
@media(min-width:1101px){body{padding-left:268px}body aside#menu{width:268px}body .faixa{left:276px}}
@media(min-width:901px) and (max-width:1100px){body{padding-left:232px}body aside#menu{width:232px;transform:none;transition:none;box-shadow:none}body #btnMenu,body #btnFechaMenu,body #overlayMenu,body #overlayMenu.abre{display:none}body .faixa{left:240px}}
@media(max-width:900px){body{padding-left:0}body aside#menu{width:min(88vw,310px)}body #cabecalho,html.casca body #cabecalho{min-height:66px;padding-inline:11px}body :is(.mz-main,.lp-main,.av-raiz){padding:20px 11px 40px}body :is(.mz-main,.lp-main,.av-raiz)::before{font-size:10px;margin-bottom:18px}body .mz-abas{padding-inline:11px;gap:8px}body :is(.lp-sec,.av-sec,.cartao){padding:18px}body #cabecalho .who b{font-size:22px}}
@media(max-width:370px){body #cabecalho .who b{font-size:20px}body .vazio{padding:22px}body .vazio b{font-size:30px}}
@media(prefers-reduced-transparency:reduce){body :is(.mz-cartao,.lp-sec,.av-sec,.cartao,.modal-box,.memory-item,.op-card){background:var(--header);backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Casca CSS has local legacy tokens and more specific selectors. Resolve explicitly. */
body #cabecalho,html.casca body #cabecalho{--muted:var(--mc-tx-2);--txt:var(--mc-tx-1);--line:var(--mc-line)}
body #cabecalho .btn,html.casca body #cabecalho .btn{background:var(--mc-s2);color:var(--mc-tx-1);border:1px solid var(--mc-line);border-radius:var(--r-ctl);font:500 12px/1.4 var(--fonte);min-height:44px;min-width:44px}
body #cabecalho .btn.ghost,html.casca body #cabecalho .btn.ghost{background:transparent;color:var(--mc-tx-2);border-color:transparent;font-size:20px}
body #cabecalho .btn:hover,html.casca body #cabecalho .btn:hover{border-color:var(--mc-op);background:var(--mc-s3)}
body .mz-vazio.grande{border:1px dashed var(--mc-line-strong);border-radius:var(--r-surface);box-shadow:var(--mc-hl);background:var(--mc-s1)}
body :is(.btn-tema,.tab,.btn-leve,.btn-tutorial-aba,.btn-principal,.btn-enviar,.btn-reativar,.dgl-btn,.dgc-salvar,.sx-btn,.prov-btn){font-family:var(--fonte)}

/* Metadata floor from Mission Control final cascade. Keep compact text readable. */
.nfls-menu-brand small,body #cabecalho .who::before,body :is(.mz-main,.lp-main,.av-raiz)::before,body .dia span,body aside#menu .ml-config h3{font-size:12px}

/* ---- Capricho: revisão das telas com dados reais (19/10/2026) ----
   Cada regra abaixo corrige um achado medido nas capturas: contraste, alvo de toque,
   resto de tema claro e coluna vazia. Só apresentação; nenhum seletor de comportamento. */

/* 1. Coluna lateral só existe onde há menu lateral. Mesa, Avisos e Lembretes não têm
      aside#menu e ficavam com 268 px vazios à esquerda no desktop. */
@media(min-width:901px){body:not(:has(aside#menu)){padding-left:0}}
body .mz-main,body .av-raiz{margin-inline:auto}
body .lp-main{margin-inline:auto}

/* 2. Barra do Quadro de avisos: era branca com link verde (3,4:1), resto do tema claro. */
body .av-barra{background:var(--header);border-bottom:1px solid var(--mc-line);box-shadow:var(--mc-hl);min-height:56px;padding-inline:clamp(11px,2.5vw,28px)}
body .av-barra a{color:var(--mc-op);font:500 14px/1.4 var(--fonte);min-height:44px}
body .av-barra a:hover{color:var(--mc-tx-1)}

/* 3. Campos de texto e link do Quadro ficavam brancos: .av-raiz input[type=url] vencia
      a regra da camada por especificidade. */
body .av-raiz :is(input[type=text],input[type=url],input[type=search],input[type=number],select,textarea){min-height:44px;background:var(--arena-field);color:var(--mc-tx-1);border:1px solid var(--mc-line-strong);border-radius:var(--r-ctl)}
body .av-raiz :is(input,textarea)::placeholder{color:var(--mc-tx-3)}
body .av-raiz :is(input,select,textarea):focus{border-color:var(--mc-op)}

/* 4. Faixas flutuantes da conversa (erro, aviso, áudio): eram cartões pastel de tema claro
      sobre o navy. Viram vidro escuro com a cor do estado na borda; o ✕ ganha 44 px. */
body .faixa{background:#101a2a;color:var(--mc-tx-1);border:1px solid var(--mc-line-strong);border-left:3px solid var(--mc-attn);border-radius:var(--r-row);box-shadow:var(--mc-hl),var(--mc-shadow);padding:10px 8px 10px 14px;line-height:1.5}
body #faixaErro{background:#1d1626;color:#ffd9df;border-color:var(--mc-risk-line);border-left-color:var(--mc-risk)}
body :is(#faixaAviso,#faixaAudio){background:#1b1a1c;color:#fbecc4;border-color:var(--mc-attn-line);border-left-color:var(--mc-attn)}
body .faixa .x{min-width:44px;min-height:44px;margin:-10px -4px -10px 0;border-radius:var(--r-ctl);color:inherit}
body .faixa .x:hover{background:var(--mc-s3)}
body .faixa .acoes .mini{min-height:44px}

/* 5. Faixa de lembretes: bloco marrom opaco vira vidro âmbar; a linha de erro era
      #a01818 sobre marrom (1,7:1). */
body .lf{background:linear-gradient(0deg,rgb(var(--rgb-warm) / .07),rgb(var(--rgb-warm) / .07)),var(--header);color:var(--mc-attn);border-bottom:1px solid var(--mc-attn-line);box-shadow:inset 3px 0 0 var(--mc-attn)}
body .lf :is(button,.lf-ver,.lf-txt small){border-color:var(--mc-attn-line)}
body .lf .lf-tit{color:var(--mc-attn)}
body .lf .lf-item{border-top-color:var(--mc-attn-line)}
body .lf .lf-txt{color:var(--mc-tx-1)}
body .lf .lf-txt b,body .lf .lf-txt strong{color:var(--mc-attn)}
body .lf .lf-erro{color:#ffc2cc;background:var(--mc-risk-soft);border:1px solid var(--mc-risk-line);border-radius:var(--r-ctl);padding:8px 12px;margin:8px 0 4px;line-height:1.5}
body .lf .lf-erro[hidden]{display:none}
html[data-tema="claro"] body .lf .lf-erro{color:#8f1732}

/* 6. Estado no cabeçalho: o JS pinta erro com #c0392b inline (3,4:1 no navy). */
body #cabecalho .who #estado[style*="192, 57, 43"],body #cabecalho .who #estado[style*="#c0392b"]{color:var(--mc-risk)!important}

/* 7. Indicador de atividade: faixa verde-clara de tema claro com texto cinza (3,3:1). */
body #atividade{background:var(--header);color:var(--mc-tx-1);border-top:1px solid var(--mc-line);font:500 13px/1.5 var(--fonte);min-height:36px}
body #atividade .atv-nome{color:var(--mc-tx-1);font-weight:600}
body #atividade .atv-sep,body #atividade .atv-acao{color:var(--mc-tx-2)}
body #atividade .atv-ponto{background:var(--mc-ok);box-shadow:0 0 10px rgb(var(--rgb-ok) / .6)}
body #atividade.atv-alerta .atv-ponto{background:var(--mc-attn);box-shadow:none}
body #atividade.atv-alerta .atv-txt,body #atividade.atv-alerta .atv-txt *{color:var(--mc-attn)}
body #atividade.atv-cinza .atv-ponto{background:var(--mc-tx-3);box-shadow:none}
body #atividade.atv-cinza .atv-txt,body #atividade.atv-cinza .atv-txt *{color:var(--mc-tx-2)}

/* 8. Rótulo NFLS-CLAW do cabeçalho quebrava em duas linhas a 320 px. */
body #cabecalho .who::before{white-space:nowrap;overflow:hidden;text-overflow:clip}

/* 9. Mensagem geral de erro dos Lembretes: texto rosa solto, sem superfície. */
body .lp-msg.erro{color:#ffc2cc;background:var(--mc-risk-soft);border:1px solid var(--mc-risk-line);border-left:3px solid var(--mc-risk);border-radius:var(--r-row);padding:12px 16px;margin:0 0 16px;line-height:1.55}
body .lp-msg.ok{color:var(--mc-ok);background:var(--mc-ok-soft);border:1px solid var(--mc-ok-line);border-radius:var(--r-row);padding:12px 16px}
html[data-tema="claro"] body .lp-msg.erro{color:#8f1732}
body .lp-msg[hidden]{display:none}

/* 10. Erros em linha do Quadro e do formulário de Lembretes: tokens do tema, não #c0392b. */
body .av-raiz :is(.av-erro,.av-cont.av-passou){color:var(--mc-risk)}

/* 11. Alvos de toque no celular: caixas de marcar, rádios e links soltos. */
@media(max-width:760px){
 body :is(.av-check,.lp label.marca){min-height:44px;display:inline-flex;align-items:center;gap:10px}
 body :is(.av-check input,.lp label.marca input){width:20px;height:20px;min-width:20px;flex:0 0 auto}
 body .av-raiz .av-link{display:inline-flex;align-items:center;min-height:44px}
 body .av-barra a{min-height:44px}
}
/* Tema claro das faixas acima: mesma estrutura, superfície clara. */
html[data-tema="claro"] body .faixa{background:#fff;color:var(--mc-tx-1)}
html[data-tema="claro"] body #faixaErro{background:#ffe4e9;color:#8f1732}
html[data-tema="claro"] body :is(#faixaAviso,#faixaAudio){background:#fff1c8;color:#5a4100}

/* 12. Quadro de avisos no desktop: o formulário esticava a 1.370 px e empurrava a lista
       para baixo da dobra. Layout de Mission Control: coluna de comando à esquerda
       (postar e filtros), feed à direita. Só no desktop; no celular segue em pilha. */
@media(min-width:1100px){
 body .av-raiz .av-tela{display:grid;grid-template-columns:minmax(340px,420px) minmax(0,1fr);column-gap:24px;align-items:start}
 body .av-tela>*{grid-column:1/-1}
 body .av-tela>.av-cab{grid-row:1}
 body .av-tela>.av-status{grid-row:2}
 body .av-tela>[data-av-tour="postar"]{grid-column:1;grid-row:3;margin-top:0}
 body .av-tela>[data-av-tour="filtros"]{grid-column:1;grid-row:4}
 body .av-tela>[data-av-tour="lista"]{grid-column:2;grid-row:3/span 3;margin-top:0}
 body .av-tela>[data-av-tour="filtros"] .av-filtros{flex-direction:column;align-items:stretch}
}
/* 13. Status de erro do Quadro: mesma superfície de erro dos Lembretes. */
body .av-raiz .av-status.av-erro:not(:empty){color:#ffc2cc;background:var(--mc-risk-soft);border:1px solid var(--mc-risk-line);border-left:3px solid var(--mc-risk);border-radius:var(--r-row);padding:12px 16px;margin:12px 0;line-height:1.55}
html[data-tema="claro"] body .av-raiz .av-status.av-erro:not(:empty){color:#8f1732}
/* 14. Blocos de erro com "Tentar de novo": borda de acento menta dizia "tudo certo" e o
       botão quebrava no meio da frase. Erro usa a cor de risco; texto e botão em fila. */
body :is(.av-vazio.av-erro-bloco,.lp-vazio:has(button),.mz-erro){display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;text-align:left;color:var(--mc-tx-1);background:linear-gradient(0deg,var(--mc-risk-soft),var(--mc-risk-soft)),var(--mc-s1);border:1px solid var(--mc-risk-line);border-left:3px solid var(--mc-risk);border-radius:var(--r-row)}
body :is(.av-vazio.av-erro-bloco,.lp-vazio:has(button),.mz-erro) button{flex:0 0 auto}

/* 15. Rótulo do dia no feed de avisos: serif de 13 px parecia erro de fonte. Vira o
       metadado mono do Mission Control. */
body .av-dia-t{font:500 12px/1.5 "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mc-tx-2);margin:4px 0 10px}

/* ======================================================================
   Correções da vistoria 19/10
   Só apresentação. Cada bloco diz o defeito que corrige.
   ====================================================================== */

/* V1. Aparelho em modo CLARO do sistema (sem data-tema): as regras antigas de
       tema claro do conversa.css/barra.css passavam por cima da pele escura.
       Balões de entrega e pedido perdiam o verde/amarelo, o tamanho do cartão de
       arquivo ficava em 3,8:1 e as linhas de erro da trilha em 2,5:1. A pele
       escura vale com qualquer preferência do sistema; o tema claro explícito
       (data-tema="claro") tem sua própria versão logo abaixo. */
html:not([data-tema="claro"]) body .row.alerta-entrega .bub{border:2px solid #34d399;background:#11342b;color:#e2f5e8}
html:not([data-tema="claro"]) body .row.alerta-pedido .bub{border:2px solid #f7d98b;background:#352d1b;color:#fff3c8}
html[data-tema="claro"] body .row.alerta-entrega .bub{border:2px solid #146c4c;background:#e3f4ec;color:#0d2a1e}
html[data-tema="claro"] body .row.alerta-pedido .bub{border:2px solid #8a6400;background:#fff4d1;color:#3b2f00}
body .row:is(.alerta-entrega,.alerta-pedido) .bub{border-bottom-left-radius:6px}
body .cartaoarq .cartaoarq-info{color:var(--mc-tx-2)}
html:not([data-tema="claro"]) body :is(.tl-saida.erro,.tl-cmd.erro>summary,.tl-grupo.erro>summary,.cmd-saida.erro,.barra-motivo,.barra-msg.erro){color:#ffb3aa}
html[data-tema="claro"] body :is(.tl-saida.erro,.tl-cmd.erro>summary,.tl-grupo.erro>summary,.cmd-saida.erro,.barra-motivo,.barra-msg.erro){color:#a8281c}
html:not([data-tema="claro"]) body .meta.fila{color:var(--mc-attn)}
html:not([data-tema="claro"]) body .barra-item.ativo{background:var(--mc-op-soft)}

/* V2. Tema claro forçado (html[data-tema="claro"]).
       a) Entrada e primeiro acesso: o nfls-login.css pinta título, "SEU TIME..." e
          rótulos de #fff8f2 sem olhar o tema, e o fundo claro da camada vencia: branco
          sobre branco. No claro, a tela inteira vira a versão clara. */
html[data-tema="claro"] body:has(> main.cartao){background:radial-gradient(ellipse at 8% 0%,rgb(0 107 96 / .08),transparent 55%),linear-gradient(160deg,#f4f7fc,#edf3f8 55%,#e7f1f1);color:#102337}
html[data-tema="claro"] body:has(> main.cartao)::before{color:#102337;border-bottom-color:rgb(18 44 70 / .16)}
html[data-tema="claro"] body:has(> main.cartao) .cartao{background:#fff;border-color:rgb(18 44 70 / .16);box-shadow:0 18px 48px rgb(18 44 70 / .1);color:#102337}
html[data-tema="claro"] body:has(> main.cartao) .cartao h1{color:#102337}
html[data-tema="claro"] body:has(> main.cartao) .cartao :is(.sub,label){color:#435b72}
html[data-tema="claro"] body:has(> main.cartao) .cartao input{background:#f4f8fc;color:#102337;border-color:rgb(18 44 70 / .3)}
html[data-tema="claro"] body:has(> main.cartao) .cartao input:focus{border-color:#006b60;background:#fff}
html[data-tema="claro"] body:has(> main.cartao) .cartao input::placeholder{color:#526980}
html[data-tema="claro"] body:has(> main.cartao) .cartao button{background:#006b60;border-color:#006b60;color:#fff}
html[data-tema="claro"] body:has(> main.cartao) .cartao button:hover{background:#00554e}
html[data-tema="claro"] body:has(> main.cartao) .cartao button:disabled{background:#c7d3df;border-color:#c7d3df;color:#102337}
html[data-tema="claro"] body:has(> main.cartao) .cartao :is(.erro,.trancado){background:#ffe4e9;color:#8f1732;border-color:#a9224366}
html[data-tema="claro"] body:has(> main.cartao) .cartao .erro.aviso{background:#e3f4ef;color:#00554e;border-color:#006b604d}
html[data-tema="claro"] body:has(> main.cartao) .cartao .rodape{color:#526980}
html[data-tema="claro"] body:has(> main.cartao) .marca .emoji{color:#006b60}
/*     b) Ciano fixo (#7df2da) como cor de TEXTO some no branco (1,3:1): "← Conversa"
          dos Lembretes, ícones de estado vazio, links de acento. No claro, o acento
          de texto é o verde-petróleo do tema. Preenchimentos ciano com texto escuro
          continuam como estão (contraste alto nos dois temas). */
html[data-tema="claro"] body.lp{--lp-acento:#006b60}
html[data-tema="claro"] body :is(.lp-voltar,.mz-volta,.av-barra a,.vazio .vz-ico){color:#006b60}
html[data-tema="claro"] body .nas-frente::after{color:#006b60}
html[data-tema="claro"] body input:is([type="checkbox"],[type="radio"]){accent-color:#006b60}
html[data-tema="claro"] body :is(.mz-cartao,.lp-sec,.av-sec,.cartao,.destaque,.modal-box,.memory-item,.rotina,.op-card){box-shadow:0 1px 0 rgb(255 255 255 / .8) inset,0 12px 32px rgb(18 44 70 / .07)}
html[data-tema="claro"] body .lp-msg.erro,html[data-tema="claro"] body .av-raiz .av-status.av-erro:not(:empty){color:#8f1732}
html[data-tema="claro"] body .faixa{background:#fff}
html[data-tema="claro"] body .lf{color:#5a4100}
html[data-tema="claro"] body .lf .lf-txt b,html[data-tema="claro"] body .lf .lf-txt strong,html[data-tema="claro"] body .lf .lf-tit{color:#5a4100}
html[data-tema="claro"] body #chat{background:transparent}
html[data-tema="claro"] body .row.me .bub{color:var(--mc-tx-1)}
/* botão de baixar sobre a miniatura: fundo escuro translúcido, então ícone branco */
html[data-tema="claro"] body .bub a.midbx:not(.vish .midbx,.combx .midbx){color:#fff}

/* V3. Cabeçalho da conversa no celular: o 👁 descia para uma segunda linha, o nome
       quebrava e a marca espremia (155 a 179 px de altura). Uma linha só: ☰, foto,
       nome com reticências, Tutorial e a faixa de ferramentas (que continua rolando
       para o lado se houver mais botões). Todos os alvos seguem com 44 px. */
@media(max-width:700px){
 body #cabecalho,html.casca body #cabecalho{flex-wrap:nowrap;align-items:center;gap:6px;min-height:0;padding-block:6px;padding-inline:8px}
 body #cabecalho .who{flex:1 1 0;min-width:0;overflow:hidden}
 body #cabecalho .who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:20px;line-height:1.15}
 body #cabecalho .who span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
 body #cabecalho .who::before{margin-bottom:1px;padding-left:36px;background-size:30px 16px}
 body #cabecalho .ferr{order:0;flex:0 1 auto;min-width:44px;max-width:40vw;margin:0}
 body #cabecalho .ferr .tools{padding:0;gap:4px}
 body #cabecalho .ferr .tools .btn{min-width:44px;min-height:44px;padding:4px 8px}
 body #cabecalho #btnTutorial{flex:0 0 auto;padding-inline:8px}
 body #cabecalho :is(#btnMenu,.av){flex-shrink:0}
}
@media(max-width:360px){
 body #cabecalho #btnTutorial{font-size:12px;padding-inline:6px}
 body #cabecalho .who b{font-size:18px}
}

/* V4. Emenda no fundo: o body tinha o degradê fixo e o html um navy chapado; em
       página curta (Mesa vazia) aparecia uma faixa mais escura embaixo. O html leva
       o mesmo degradê fixo e ocupa no mínimo a janela inteira. */
html{min-height:100%}
html:not([data-tema="claro"]){background:radial-gradient(ellipse at 8% 0%,rgb(125 242 218 / .09),transparent 48%),radial-gradient(ellipse at 95% 100%,rgb(247 217 139 / .04),transparent 45%),linear-gradient(160deg,#0b1322,#0a1020 55%,#0a1a26);background-color:#0a1020;background-attachment:fixed}
html[data-tema="claro"]{background:linear-gradient(160deg,#f4f7fc,#edf3f8 55%,#e7f1f1);background-color:#edf3f8;background-attachment:fixed}
html[data-tema="claro"] body{background-attachment:fixed}

/* V5. Pilha de ícones de alerta (✅/⚠️) no celular: coluna fixa à direita que cobria
       o texto dos balões. Enquanto houver ícone na pilha, a coluna das mensagens
       reserva a largura dela à direita; a pilha encosta mais na borda. Botões
       continuam com 44 px. Sem ícone, a conversa usa a largura toda. */
@media(max-width:700px){
 body #alertasMensagem{right:6px;gap:4px}
 body #alertasPilha{gap:4px}
 body #alertasMensagem button{width:44px;height:44px;font-size:17px;background:rgb(11 19 34 / .94);color:var(--mc-tx-1);border-color:var(--mc-line-strong);box-shadow:0 4px 14px rgb(0 0 0 / .35)}
 html[data-tema="claro"] body #alertasMensagem button{background:rgb(245 248 252 / .96);box-shadow:0 4px 14px rgb(18 44 70 / .18)}
 body:has(#alertasMensagem:not([hidden])) #chat{padding-right:56px}
}

/* V6. Rádios e caixas de marcar no celular: o controle em si tem 20 px, mas o rótulo
       que o envolve é o alvo. Rótulo com 48 px de altura e controle de 22 px; os dias
       da semana dos Lembretes (eram 36 px) também chegam a 44 px. */
@media(max-width:760px){
 body :is(.av-check,.lp label.marca){min-height:48px;padding-block:2px;gap:12px}
 body :is(.av-check input,.lp label.marca input){width:22px;height:22px;min-width:22px;margin:0}
 body .lp-form .dias{gap:8px}
 body .lp-form .dias label{min-height:44px;min-width:44px;padding:0 12px;gap:8px}
 body .lp-form .dias input{width:20px;height:20px}
}

/* V7. Faixa vazia acima da conversa: o foco-tela.css (carregado depois do conversa.css)
       devolve ao #chat o top:calc(var(--header-h) + var(--foco-h)). Com o #chat em
       position:relative, isso só desloca a thread 76 px para baixo: faixa vazia no alto
       e o fim da conversa escondido atrás da barra de escrever. A reserva da faixa de
       foco vira margem (entra no fluxo da coluna) e o deslocamento some. */
body #chat{top:auto;margin-top:var(--foco-h,0px)}

/* V8. iPhone com o app instalado (Tela de Início): com viewport-fit=cover a página vai até
       o alto da tela, e o conversa.css guarda a folga do relógio e da ilha com
       padding-top:env(safe-area-inset-top). O padding-block do #cabecalho e o padding do
       menu lateral, acima, apagavam essa folga: o topo ficava escondido e não dava para
       tocar no menu nem trocar de agente. A folga volta somada ao respiro de cada um. */
body #cabecalho,html.casca body #cabecalho{padding-top:calc(10px + env(safe-area-inset-top))}
body aside#menu{padding-top:calc(24px + env(safe-area-inset-top));padding-bottom:calc(14px + env(safe-area-inset-bottom))}
body .av-barra{padding-top:env(safe-area-inset-top)}
@media(max-width:700px){
 body #cabecalho,html.casca body #cabecalho{padding-top:calc(6px + env(safe-area-inset-top))}
}