/* ============================================================================ N1 Magazine — Shell Protection Layer (shared across all Article_XX/index.html) ---------------------------------------------------------------------------- Loaded by every Article_XX/index.html via: Per-article variable set on : body { --n1-page-stamp: "A07·2026·n1labph"; } The .page::after rule reads that variable and renders the corner stamp on every page. No per-page markup needed. Page-level overrides: .page.no-stamp::after { display: none; } .page.stamp-light → ink-on-light page background .page.stamp-dark → off-white-on-dark page background (default) ============================================================================ */ /* Bottom-right of every page, ABOVE the centered nav dots (bottom:28px) so they never share a horizontal band. On screenshots, this stamps every page with brand + article + URL for attribution. */ .page::after { content: var(--n1-page-stamp, ""); position: absolute; bottom: 58px; right: 22px; font-family: 'Space Grotesk', sans-serif; font-size: 8.5px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; white-space: nowrap; color: rgba(245, 245, 245, 0.38); /* default: dark-page legible */ pointer-events: none; user-select: none; z-index: 5; /* above page content, below nav (z 900+) */ font-variant-numeric: tabular-nums lining-nums; } /* Phones <420px: drop one notch lower-right so the stamp sits in the bottom margin without crowding hero text. Dots stay centered. */ @media (max-width: 420px) { .page::after { bottom: 54px; font-size: 8px; letter-spacing: 0.12em; } } /* Cover (first) + back-cover (last) already carry full brand attribution in their layout. Suppress the corner stamp on those pages so it doesn't collide with hero meta blocks. The stamp still appears on every interior page — which is the screenshot surface that matters most. */ .page:first-child::after, .page:last-child::after { display: none; } /* Light-page variant — ink on warm/white backgrounds */ .page.page-light::after, .page.stamp-light::after { color: rgba(26, 26, 26, 0.34); } /* Suppress on pages where the stamp would collide with content */ .page.no-stamp::after { display: none; }