.status-page {
  max-width: 480px; margin: var(--gap-xl) auto; text-align: center;
}
.status-page .status-code {
  font-family: var(--font-mono); font-size: 15px; font-weight: 700;
  color: var(--color-accent); letter-spacing: .08em; margin-bottom: var(--gap-sm);
}
.status-page .status-actions { display: flex; gap: var(--gap-sm); justify-content: center; margin-top: var(--gap-md); flex-wrap: wrap; }

.status-page-photo {
  max-width: 900px;
  min-height: 60vh;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  padding: var(--gap-32) var(--gap-lg) var(--gap-xl);
  clip-path: var(--fo-shape-panel);
  background:
    linear-gradient(180deg, var(--color-photo-tint-05) 0%, rgba(8, 9, 11, .15) 55%, rgba(8, 9, 11, .75) 100%),
    url('/static/img/404-hero.png') center / cover no-repeat;
  color: var(--color-photo-text);
}
.status-page-photo .status-code, .status-page-photo h1, .status-page-photo .muted { text-shadow: 0 1px 4px rgba(0, 0, 0, .8); }
.status-page-photo .status-code { color: var(--color-accent); }
.status-page-photo h1 { color: var(--color-photo-text); }
.status-page-photo .muted { color: var(--color-photo-text-muted); }