/* The credit and the legal links at the end of every page: an ordinary footer in the page's flow, after
   its last content, so it never covers anything and a reader reaches it by scrolling (operator, 2026-10-19).
   On the film page the tokens are the page's own (--ink-2, --line, --type-body); the fallbacks are its dark
   values. It lines up with the page's content column, and stacks like the film page's .app so the page's
   fixed watermark stays behind it. Narrower than the credit and the links side by side, it wraps to two
   centred lines. */
.legal-links {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0 12px;
  max-width: var(--legal-column, 1240px);
  margin: 48px auto 0;
  padding-top: 8px;
  border-top: 1px solid var(--line, rgb(242 237 227 / 12%));
  color: var(--ink-2, rgb(242 237 227 / 64%));
  font: 500 12px/1.3 var(--type-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
}
.legal-links .legal-credit { padding: 6px 0; }
.legal-links a {
  display: inline-block;
  padding: 6px 8px;
  border-radius: 6px;
  color: var(--ink-2, rgb(242 237 227 / 64%));
  text-decoration: none;
}
.legal-links a:hover, .legal-links a:focus-visible { color: var(--ink, #f2ede3); background: var(--line, rgb(242 237 227 / 12%)); }
@media (max-width: 560px) {
  .legal-links { justify-content: center; text-align: center; font-size: 11px; }
  .legal-links .legal-credit { padding: 4px 0 0; }
  .legal-links a { padding: 4px 8px 5px; }
}

/* Impressum and Datenschutz: the film page's ground and ink, system type, one reading column. */
.legal {
  --ground: #1b1b1b;
  --ink: #f2ede3;
  --ink-2: color-mix(in oklab, var(--ink) 64%, transparent);
  --line: color-mix(in oklab, var(--ink) 12%, transparent);
  --ember: #eca068;
  --legal-column: 680px;
  color-scheme: dark;
  margin: 0;
  padding: 40px 16px;
  background: var(--ground);
  color: var(--ink);
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: light) {
  .legal { --ground: #f2ede3; --ink: #1b1b1b; --ember: #9a5221; color-scheme: light; }
}
.legal main { max-width: 680px; margin: 0 auto; }
.legal h1 { font-size: 30px; line-height: 1.2; margin: 0 0 24px; }
.legal h2 { font-size: 19px; line-height: 1.3; margin: 32px 0 8px; }
.legal p, .legal ul { margin: 0 0 12px; }
.legal main a { color: var(--ember); overflow-wrap: anywhere; }
.legal .back { margin-top: 40px; }