/* ===== site chrome — header/menu idêntico ao andrebassi.com.br (HUD) =======
   Componente COMPARTILHADO pelas páginas standalone do artigo (PT + EN).
   Marcação injetada por site-chrome.js. Escondido quando embedado no painel
   (iframe) — ali o próprio site já renderiza o header. Mesmas cores/fontes do
   HUD do site (base.css/hud.css): accent #6fd6ff, bg #03060f, JetBrains Mono. */
html.embedded .site-chrome { display: none; }
.site-chrome {
  position: sticky; top: 0; z-index: 100;
  background: linear-gradient(180deg, rgba(3,6,15,0.96), rgba(3,6,15,0.86));
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-family: "JetBrains Mono", "SF Mono", Menlo, Monaco, monospace;
  color: #f1f4ff;
}
.sc-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: 13px clamp(16px, 1.8vw, 28px);
}
.sc-brand { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; white-space: nowrap; }
.sc-mark { color: #6fd6ff; font-size: 16px; text-shadow: 0 0 12px #6fd6ff; transform: translateY(-1px); }
.sc-name { color: #f1f4ff; font-weight: 600; font-size: 15px; letter-spacing: .10em; }
.sc-sep  { color: #3e4663; }
.sc-role { color: #6fd6ff; font-size: 13.5px; letter-spacing: .10em; }
.sc-meta { display: inline-flex; align-items: center; gap: 12px; color: #8e96b3; font-size: 13.5px; white-space: nowrap; }
.sc-clock { color: #f1f4ff; font-variant-numeric: tabular-nums; }
.sc-langs { display: inline-flex; gap: 6px; }
.sc-lang { padding: 3px 7px; border: 1px solid rgba(255,255,255,0.08); border-radius: 5px; text-decoration: none; font-size: 17px; line-height: 1; opacity: .5; }
.sc-lang:hover { opacity: .85; border-color: rgba(111,214,255,.3); }
.sc-lang.active { opacity: 1; border-color: rgba(111,214,255,.28); background: rgba(255,255,255,.02); }
.sc-nav {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px 18px;
  padding: 8px clamp(16px, 1.8vw, 28px) 11px;
  border-top: 1px solid rgba(255,255,255,0.05);
}
.sc-nav a { display: inline-flex; align-items: center; gap: 6px; color: #8e96b3; text-decoration: none; font-size: 12.5px; letter-spacing: .04em; border-bottom: 1px solid transparent; padding-bottom: 1px; }
.sc-nav a i { color: #6fd6ff; opacity: .6; font-style: normal; font-size: 11px; }
.sc-nav a:hover { color: #f1f4ff; }
.sc-nav a.sc-ext { color: #6fd6ff; }
@media (max-width: 720px) { .sc-role { display: none; } .sc-nav { gap: 5px 12px; } }