/* Newsletter sign-up dialog. Self-contained so it also works on the
   Macro Twin report pages, which carry their own stylesheet. */
dialog.newsletter {
  --nl-bg: #141b2a; --nl-field: #0b0f17; --nl-line: #243049; --nl-text: #e6e9ef;
  --nl-muted: #98a2b8; --nl-gold: #e3b341; --nl-red: #ef6461;
  width: min(460px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--nl-line); border-radius: 16px;
  background: var(--nl-bg); color: var(--nl-text); box-shadow: 0 24px 80px rgba(0,0,0,0.5);
  font: 16px/1.6 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; text-align: left;
}
dialog.newsletter::backdrop { background: rgba(5, 8, 14, 0.7); backdrop-filter: blur(3px); }
dialog.newsletter .nl-body { padding: 32px 28px 28px; position: relative; }
dialog.newsletter .nl-eyebrow { font: 500 0.78rem "IBM Plex Mono", ui-monospace, monospace; letter-spacing: 0.14em; text-transform: uppercase; color: var(--nl-gold); margin: 0 0 14px; }
dialog.newsletter h2 { font: 600 1.6rem/1.2 "Fraunces", Georgia, serif; margin: 0 0 0.3em; color: var(--nl-text); letter-spacing: 0; }
dialog.newsletter p { color: var(--nl-muted); margin: 0 0 1em; }
dialog.newsletter .nl-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: var(--nl-muted); font-size: 1.4rem; line-height: 1; cursor: pointer; padding: 0; }
dialog.newsletter .nl-close:hover { background: var(--nl-field); color: var(--nl-text); }
dialog.newsletter .nl-form { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
dialog.newsletter input[type="email"] { flex: 1 1 220px; min-width: 0; background: var(--nl-field); color: var(--nl-text); border: 1px solid var(--nl-line); border-radius: 8px; padding: 11px 14px; font: inherit; }
dialog.newsletter input[type="email"]:focus { outline: 2px solid var(--nl-gold); outline-offset: 1px; border-color: transparent; }
dialog.newsletter .nl-submit { flex: 0 0 auto; border: 0; cursor: pointer; font-family: inherit; font-size: 1rem; font-weight: 700; background: var(--nl-gold); color: #1a1405; padding: 10px 18px; border-radius: 8px; }
dialog.newsletter .nl-submit:hover { filter: brightness(1.08); }
dialog.newsletter .nl-submit:disabled { opacity: 0.6; cursor: wait; }
dialog.newsletter .nl-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
dialog.newsletter .nl-msg { min-height: 1.4em; margin: 10px 0 0; font-size: 0.9rem; color: var(--nl-muted); }
dialog.newsletter .nl-msg.err { color: var(--nl-red); }
dialog.newsletter .nl-fine { font-size: 0.8rem; margin: 14px 0 0; }