:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; background: #0a1514; color: #f9e8c8; }
* { box-sizing: border-box; }
body { margin: 0; }
main { min-height: 100vh; min-height: 100svh; position: relative; isolation: isolate; display: grid; grid-template-rows: minmax(0, 1fr) auto; }
.backdrop { position: fixed; inset: -40px; z-index: -1; background: linear-gradient(#07100bc9, #07100bc9), url("rick-dangerous.png") center / cover; filter: blur(22px); }
.artwork { display: block; width: 100%; height: calc(100vh - 92px); height: calc(100svh - 92px); min-height: 280px; object-fit: contain; }
footer { padding: 14px 24px max(14px, env(safe-area-inset-bottom)); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px 36px; background: #071210de; font-size: 12px; text-align: center; }
p { margin: 0; line-height: 1.7; color: #b4bdb2; }
a { color: #f8d196; text-decoration-color: #f8d19655; text-underline-offset: 4px; }
a:hover { color: #fff0cb; }
a:focus-visible { outline: 2px solid #f8d196; outline-offset: 5px; }
.visitors { display: flex; gap: 10px; align-items: center; }
.visitors strong { font: 18px ui-monospace, "Courier New", monospace; letter-spacing: .1em; color: #fff0cb; }
.wiki { font-size: 11px; }
@media (max-width: 540px) {
  .artwork { height: auto; min-height: 0; align-self: center; }
  footer { gap: 12px 24px; padding: 16px 12px max(16px, env(safe-area-inset-bottom)); }
  .wiki { flex-basis: 100%; }
}