Midnight Editorial（午夜金辉）

Um plugin de deck com estética única: o preset midnight-editorial do nicobailon/visual-explainer upstream com licença MIT (templates/slide-deck.html), fixado e distribuído como um único pacote autônomo — example.html. O slide do diagrama mermaid upstream foi substituído por uma página de pipeline pura em CSS/SVG; o deck tem zero dependências externas de JS (Google Fonts @import é a única referência externa).

Combinação de assinatura (o que torna esta skin única):

1. Azul marinho profundo + dourado quente — página #0f1729, acento #d4a73a, texto em pergaminho #e8e4d8. Cinematográfico, qualidade de revista, dramático.
2. Exibição Serif → Rótulo Mono — Instrument Serif em até 120px (clamp(48px,10vw,120px), peso 400, rastreamento de -2px, altura de linha de 0.95) caindo diretamente para rótulos JetBrains Mono em maiúsculas de 13–14px com espaçamento entre letras de 1.5px. Nenhum sans intermediário em lugar nenhum.
3. Brilho de acento radial dourado — cada slide de conteúdo carrega um radial-gradient(ellipse at X% Y%, var(--accent-dim) 0%, transparent ~40%) inline de fundo, com a âncora da elipse se movendo por slide.
4. Marcas de canto SVG douradas + numerais fantasma — marcas de linha de canto douradas de 2px com opacidade 0.15 no slide de título; divisores carregam um numeral dourado clamp(100px,22vw,260px) fantasma com opacidade 0.06.
5. Transições cinematográficas escalonadas — slides entram com fade + translateY(40px) + scale(0.98) em cubic-bezier(0.16,1,0.3,1); filhos .reveal escalonam em incrementos de 0.1s (máximo 6).
6. Tema duplo SlideEngine — alternância explícita escuro/claro (tecla T + botão de cromo ◐, html[data-theme]), com padrão para a preferência do SO. O modo claro é uma skin fixa creme/dourada, não uma reflexão tardia.

Comece em example.html. Substitua apenas o conteúdo — nunca reescreva o sistema de design ou o script de tempo de execução, e nunca introduza cores ou fontes fora das folhas de tokens abaixo.

Folha de tokens bloqueada — escura (padrão)

:root {
  --font-body: 'Instrument Serif', Georgia, serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;
  --bg: #0f1729;
  --surface: #162040;
  --surface2: #1d2b52;
  --surface-elevated: #243362;
  --border: rgba(200, 180, 140, 0.08);
  --border-bright: rgba(200, 180, 140, 0.16);
  --text: #e8e4d8;
  --text-dim: #9a9484;
  --accent: #d4a73a;
  --accent-dim: rgba(212, 167, 58, 0.1);
  --code-bg: #0a0f1e;
  --code-text: #d4d0c4;
  --green: #4ade80;  --green-dim: rgba(74, 222, 128, 0.1);
  --red: #f87171;    --red-dim: rgba(248, 113, 113, 0.1);
  --blue: #60a5fa;   --blue-dim: rgba(96, 165, 250, 0.1);
}

Folha de tokens bloqueada — clara (html[data-theme="light"])

html[data-theme="light"] {
  --bg: #faf8f2;
  --surface: #ffffff;
  --surface2: #f5f0e6;
  --surface-elevated: #fffdf5;
  --border: rgba(30, 30, 50, 0.08);
  --border-bright: rgba(30, 30, 50, 0.16);
  --text: #1a1814;
  --text-dim: #6e685c;
  --accent: #b8860b;
  --accent-dim: rgba(184, 134, 11, 0.08);
  --code-bg: #2a2520;
  --code-text: #e8e4d8;
  --green: #16a34a;  --green-dim: rgba(22, 163, 74, 0.08);
  --red: #dc2626;    --red-dim: rgba(220, 38, 38, 0.08);
  --blue: #2563eb;   --blue-dim: rgba(37, 99, 235, 0.08);
}

O mesmo bloco claro é espelhado em @media (prefers-color-scheme: light) { html:not([data-theme]) { … } } como um fallback sem JS. Ambos os temas fazem parte do contrato — cada slide que você criar deve ser lido corretamente em ambos. Cores semânticas (--green/--red/--blue) são apenas para status (tendências, rótulos antes/depois, famílias de nós de diagrama) — nunca decorativas.

Fontes (bloqueadas — apenas Google Fonts @import)

Sem terceira fonte. Sem serif negrito — o drama vem do tamanho, não do peso.

Escala tipográfica (bloqueada)

…