.hero:after { content: "S-4"; font-size: clamp(12rem, 35vw, 34rem); }
.hero { background-image: linear-gradient(90deg, rgba(10, 11, 9, .92), rgba(10, 11, 9, .4)), linear-gradient(0deg, rgba(10, 11, 9, .65), transparent 60%), url('https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=2400&q=88'); }
.panel { min-width: 0; padding: 24px; background: #11120f; border: 1px solid var(--line); }
.panel h3 { color: var(--paper, #e9e9dd); font: 500 23px/1.12 var(--display); }
.panel p, .prose p, .prose li, .timelineitem p, .tablewrap td { color: #bfc0b5; font-size: 16px; line-height: 1.75; }
.panel p:last-child { margin-bottom: 0; }
.panel.video > a, .prose a { color: var(--acid); }
.video-frame { margin-bottom: 18px; border-color: var(--line); }
.note { color: #a0a195; font-size: 14px; line-height: 1.7; border-color: var(--acid); }
.tag { color: var(--acid); border-color: var(--line); font: 14px var(--mono); letter-spacing: .07em; }
.tablewrap { border-color: var(--line); }
.tablewrap th { color: var(--acid); background: #171812; font: 14px var(--mono); }
.tablewrap td, .tablewrap th { border-color: var(--line); }
.timelineitem { border-color: var(--line); }
.timelineitem .stamp { color: var(--acid); font: 14px var(--mono); }
.footer { padding: 32px 0; background: #0a0b09; color: #a0a195; font: 14px var(--mono); }
.footer .wrap { align-items: center; }
.footer .brand { color: var(--paper, #e9e9dd); }
.footer .brand > span:last-child { color: var(--paper, #e9e9dd); }
.backtop { color: var(--acid); font: 14px var(--mono); }

@media (max-width: 760px) {
  .panel { padding: 20px; }
  .nav a { font-size: 14px; }
  .tablewrap { max-width: 100%; margin-right: 0; }
  .hero:after { right: -.1em; bottom: -.1em; }
}