body { margin: 8px; background: #222; color: white; font-family: Arial, sans-serif; }
.site-header, .article, footer { background: #333; border: 1px solid #555; border-radius: 5px; margin-bottom: 10px; }
.site-header { display: flex; align-items: center; gap: clamp(12px, 8vw, 120px); padding: 2px; background-image: url('/transparent-header.png'); }
.site-header img { width: auto; height: 100px; max-width: 100%; object-fit: contain; }
.site-header a { max-width: 45%; }
.article { padding: 10px 16px; font-family: Tahoma, Geneva, sans-serif; line-height: 1.5; }
.article h1 { font-family: Arial, sans-serif; font-size: clamp(1.4rem, 3vw, 2rem); }
.article h2 { font-size: 1.25rem; }
.archive-notice { padding: 10px; background: #222; border: 1px solid #777; border-radius: 5px; }
figure { margin: 1em 0; }
figure img { max-width: 100%; height: auto; }
figcaption { font-size: .9em; color: #ddd; }
pre { overflow-x: auto; padding: 12px; background: #222; border: 1px solid #555; font-size: .9em; line-height: 1.4; }
footer { padding: 10px; text-align: center; }
a:focus-visible { outline: 3px solid #ffe368; outline-offset: 3px; }
@media (max-width: 560px) { .site-header { justify-content: space-around; gap: 8px; } .site-header img { height: auto; max-height: 85px; } .article { padding: 10px; } }