.operus-logo { position: relative; line-height: 1; overflow: hidden; }
.series-entry { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; max-width: 650px; margin: 22px 0 0; padding: 0; color: #aab7b1; font-size: .78rem; line-height: 1.8; }
.series-entry > strong { color: #b8aa89; font: 500 .62rem/1.8 var(--mono); letter-spacing: .065em; white-space: nowrap; }
.series-entry a { color: #bac5bf; text-underline-offset: 4px; text-decoration-color: #bac5bf59; text-decoration-thickness: 1px; transition: color .2s ease, text-decoration-color .2s ease; }
.series-entry a:hover { color: #f2eee4; text-decoration-color: var(--brass); }
.series-entry a:focus-visible { outline: 2px solid var(--brass); outline-offset: 5px; border-radius: 1px; }
.article-head .article-head-copy > .series-entry { animation: editorial-rise .7s cubic-bezier(.2,.7,.2,1) .24s both; }
@media (prefers-reduced-motion: reduce) {
  .article-head .article-head-copy > .series-entry { animation: none; }
  .series-entry a { transition: none; }
}
.operus-logo img { display: block; width: clamp(167px, 20vw, 234px); height: auto; }
.site-head > .operus-logo img { width: 168px; clip-path: inset(0 0 0 17.25%); }
.site-head > .operus-logo::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 17.25%;
  height: 100%;
  background: url("operus-wordmark.svg") left top / 168px auto no-repeat;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  pointer-events: none;
  animation: operus-o-turn 18s cubic-bezier(.4, 0, .2, 1) 4s infinite;
}
.site-head > .operus-logo { overflow: visible; animation: operus-arrive .5s ease-out both; }
.site-head .nav-more { display: flex; gap: clamp(24px, 3vw, 46px); align-items: center; }
.site-head { border-bottom: 1px solid var(--brass); }
.site-head nav > a, .site-head .nav-more > a { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 12px 0; color: #b9c2be; font: 600 12px/1.2 var(--mono); letter-spacing: .11em; text-transform: uppercase; text-decoration: none; transition: color .2s ease; }
.site-head nav > a::after, .site-head .nav-more > a::after { content: ""; position: absolute; left: 0; right: auto; bottom: 5px; width: 100%; height: 1px; background: var(--brass); transform: scaleX(0); transform-origin: left; transition: transform .2s ease; }
.site-head nav > a:is(:hover, :focus-visible, [aria-current]), .site-head .nav-more > a:is(:hover, :focus-visible, [aria-current]) { color: #f2f0e9; }
.site-head nav > a:is(:hover, :focus-visible, [aria-current])::after, .site-head .nav-more > a:is(:hover, :focus-visible, [aria-current])::after { transform: scaleX(1); }
.site-head nav a:focus-visible, .site-head .nav-toggle:focus-visible { outline: 2px solid var(--brass); outline-offset: 5px; }
.nav-toggle { display: none; }
@keyframes operus-arrive { from { opacity: 0; } to { opacity: 1; } }
@keyframes operus-o-turn {
  0%, 3% { transform: rotate(0deg); }
  10%, 100% { transform: rotate(360deg); }
}
@media (max-width: 700px) {
  .site-head { flex-wrap: wrap; gap: 12px; }
  .site-head > .operus-logo img { width: 145px; }
  .site-head > .operus-logo::before { background-size: 145px auto; }
  .site-head nav { flex-wrap: wrap; justify-content: flex-end; }
  .site-head .nav-more { flex-wrap: wrap; gap: 15px; padding-block: 12px; }
  .site-head.nav-ready { flex-wrap: nowrap; }
  .site-head.nav-ready nav { position: static; flex-wrap: nowrap; }
  .nav-ready .nav-toggle { display: flex; gap: 10px; align-items: center; padding: 9px 12px; border: 1px solid #536058; border-radius: 3px; color: #f2f0e9; background: transparent; font: 11px var(--mono); cursor: pointer; }
  .site-head.nav-ready .nav-more { display: none; position: absolute; top: 100%; right: 0; width: min(310px, calc(100vw - 24px)); padding: 12px 22px 22px; background: #14211d; border: 1px solid #536058; box-shadow: 0 16px 30px #0003; }
  .site-head.nav-ready.nav-open .nav-more { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .site-head .nav-more > a { align-self: flex-start; padding: 17px 0; font-size: 12px; border-bottom: 1px solid #ffffff18; }
  .site-head .nav-more .language-switch { margin-top: 16px; align-self: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .site-head > .operus-logo { animation: none !important; }
  .site-head > .operus-logo::before { animation: none; }
  .site-head nav > a, .site-head .nav-more > a,
  .site-head nav > a::after, .site-head .nav-more > a::after { transition: none; }
}

.article-card-preview { position: relative; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid rgba(17, 27, 24, .12); border-radius: 10px; background: var(--graphite); box-shadow: var(--media-shadow); }
.article-card-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Keep the wide Signatur wordmark clear of the card's three metadata lines. */
.article-card-preview:is([href$="/signatur-chrom-techno-amiga-demozeit"], [href$="/signatur-an-amiga-tribute"]) { background: #010304; }
.article-card-preview:is([href$="/signatur-chrom-techno-amiga-demozeit"], [href$="/signatur-an-amiga-tribute"]) img { height: 75%; object-fit: contain; object-position: center top; }
.article-card-preview .article-card-meta { position: absolute; inset: auto 0 0; padding: 28px 14px 12px; gap: 5px; background: linear-gradient(transparent, #101918e8); }
.article-card-preview .article-card-meta span { color: #dfbb88; }
.article-card-preview .article-card-meta b, .article-card-preview .article-card-meta time { color: #fff8ec; }
.article-card-preview--empty { background: linear-gradient(135deg, #293732, #17201e); }
@media (max-width: 700px) {
  .article-card { grid-template-columns: 100px minmax(0, 1fr); gap: 16px; }
  .article-card-preview { aspect-ratio: 4 / 5; }
  .article-card-preview .article-card-meta { padding: 24px 9px 10px; }
  .article-card h2 { font-size: clamp(1.2rem, 4.5vw, 1.6rem); margin-bottom: 0; }
  .article-card > .arrow { display: none; }
}
.article-head .series-entry { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; max-width: 770px; margin-top: 36px; padding: 16px 0 26px; border-bottom: 1px solid #ffffff27; font-size: .82rem; line-height: 1.65; }
.article-head .series-entry > strong { flex: 0 0 auto; padding: 4px 22px 4px 0; border-right: 1px solid #b58a5540; color: #d0ae7f; font-size: .66rem; letter-spacing: .1em; }
.article-head .series-entry > span { color: #93a19a; }
.article-head .series-entry > a:first-of-type { margin-left: auto; }
.article-head .series-entry > a { white-space: nowrap; }
.article-head .series-entry a { color: #d8dfd8; text-decoration-color: #b58a5566; text-underline-offset: 7px; }
.article-head .series-entry a:hover { color: #e2bf8f; text-decoration-color: #e2bf8f; }
.article-head .series-entry > a > span { display: inline-block; margin-left: 8px; color: #d0ae7f; }
.article-head .series-entry + .article-credentials { margin-top: 28px; border-top: 0; padding-top: 0; }
.article-head--split .series-entry { max-width: 650px; }
.article-head--minimal .series-entry { max-width: 720px; }
@media (max-width: 560px) {
  .article-head .series-entry { flex-direction: column; align-items: flex-start; gap: 4px; padding-top: 8px; padding-bottom: 24px; }
  .article-head .series-entry > strong { padding: 0; margin-bottom: 8px; border-right: 0; }
  .article-head .series-entry > a,
  .article-head .series-entry > a:first-of-type { display: inline-flex; align-items: center; min-height: 44px; margin-left: 0; }
}

.article-head .series-start-link::before { content: '←'; display: inline-block; margin-right: 8px; color: #d0ae7f; }

.article-card-preview { display: block; text-decoration: none; }
.article-card-preview img { transition: transform .35s ease; }
@media (hover: hover) {
  .article-card-preview:hover img { transform: scale(1.05); }
}
.article-card-preview:focus-visible { outline: 2px solid var(--brass); outline-offset: 4px; }
.article-card-preview:focus-visible img { transform: scale(1.05); }
@media (prefers-reduced-motion: reduce) {
  .article-card-preview img { transition: none; }
  .article-card-preview:hover img, .article-card-preview:focus-visible img { transform: none; }
}


/* Hide retired artwork in pages still held in the output cache. */
.footer-art { display:none !important; }
/* Shared header/footer surface and personal editorial footer. */
:root { --site-frame-background:#11191b; }
.site-head { background:var(--site-frame-background); }
.site-foot.footer-personal { background:var(--site-frame-background); color:#ecebe3; padding:0 var(--content-edge); }
.site-foot.footer-personal::before { content:''; position:static; display:block; width:52px; height:2px; background:#bb9661; transform:none; }
.footer-personal-grid { display:grid; grid-template-columns:minmax(220px,.95fr) minmax(0,1.7fr) minmax(180px,.85fr); gap:64px; padding:34px 0 22px; }
.footer-brand .operus-logo img { width:168px; height:auto; }
.footer-brand p { font:12px/1.65 var(--sans); color:#9ba5a2; margin:17px 0 0; max-width:260px; }
.footer-brand strong { white-space:nowrap; }
.footer-brand p span { display:block; color:#c8cec8; margin-top:10px; }
.footer-eyebrow, .footer-explore small { font:9px/1.5 var(--mono); letter-spacing:.14em; color:#c3a171; }
.footer-message h2 { font:400 clamp(30px,3vw,42px)/1.1 var(--serif); letter-spacing:-.025em; margin:12px 0 15px; max-width:590px; text-wrap:pretty; }
.footer-message-accent { color:#c5a573; font-style:italic; }
.footer-message h2 em { font-family:inherit; font-weight:400; color:inherit; }
.footer-message p { font:13px/1.6 var(--sans); color:#a8b1ad; max-width:480px; margin:0; }
.footer-explore { display:flex; flex-direction:column; }
.footer-explore small { color:#97a29e; margin-bottom:12px; }
.footer-explore a { display:flex; justify-content:space-between; align-items:center; text-decoration:none; font:16px/1.5 var(--sans); color:#e0e1d8; padding:8px 0; border-bottom:1px solid #d5dfcf18; }
.footer-explore a span { display:inline-block; margin-left:12px; font:500 1rem/1 var(--mono); color:#ba9969; }
.footer-explore a:hover { color:#d1af7d; }
.footer-personal-middle { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; padding:0 0 10px; }
.footer-made { font:10px/1.5 var(--mono); color:#9ba6a1; letter-spacing:.015em; margin:0; }
.footer-made { white-space:nowrap; }
.footer-made span { color:#c5a573; }
.footer-personal-middle:empty { display:none; }
.footer-social { display:flex; justify-content:flex-end; margin:0 0 7px auto; }
.footer-social-label { display:none; }
.footer-social-icons { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.footer-brand .footer-social { justify-content:flex-start; margin:14px 0 0; }
.footer-brand .footer-social-icons { justify-content:flex-start; }
.footer-social-link { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border:1px solid #bc9b6333; border-radius:50%; background:transparent; color:#c6ac85; transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease; }
.footer-social-link svg { width:16px; height:16px; }
a.footer-social-link:hover { color:#11191b; background:#c7a575; border-color:#c7a575; transform:translateY(-2px); }
.footer-personal-bottom { border-top:1px solid #d1d8cb22; display:flex; gap:25px; align-items:center; padding:17px 0 19px; font:10px/1.5 var(--sans); color:#9ba6a1; }
.footer-copyright { white-space:nowrap; font:9px/1.5 var(--mono); letter-spacing:.035em; }
.footer-legal { display:flex; flex-wrap:wrap; gap:22px; flex:1; }
.footer-legal a, .footer-legal button { font:inherit; color:inherit; text-decoration:none; background:none; border:0; padding:0; cursor:pointer; }
.footer-legal a:hover, .footer-legal button:hover { color:#ecebe3; }
.footer-top { color:#d6d9d0; text-decoration:none; display:flex; align-items:center; gap:13px; font:9px var(--mono); letter-spacing:.06em; white-space:nowrap; border:1px solid #d1d8cb22; border-radius:24px; padding:8px 13px; }
.footer-top span { position:relative; top:-2px; font:18px var(--sans); color:#c3a171; }
.footer-personal a:focus-visible, .footer-personal button:focus-visible { outline:2px solid #d7b685; outline-offset:4px; }
@media(max-width:1050px) {
 .footer-personal-grid { grid-template-columns:160px minmax(0,1fr) 160px; gap:28px; }
 .footer-brand .operus-logo img, .site-head > .operus-logo img { width:145px; }
 .footer-message h2 { font-size:34px; }
}
@media(max-width:700px) {
 .site-foot.footer-personal { padding:0 20px; }
 .footer-personal-grid { grid-template-columns:1fr 1fr; gap:28px; padding-top:28px; }
 .footer-brand { grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; }
 .footer-brand p { margin:0; font-size:11px; }
 .footer-brand p span { margin-top:3px; }
 .footer-message { grid-column:1/-1; }
 .footer-message h2 { font-size:36px; max-width:420px; }
 .footer-explore { grid-column:1/-1; flex-direction:row; flex-wrap:wrap; gap:0 22px; }
 .footer-explore small { width:100%; margin-bottom:4px; }
 .footer-explore a { font-size:13px; gap:18px; flex:1; }
 .footer-personal-middle { flex-wrap:wrap; align-items:flex-end; gap:16px; }
 .footer-made { order:4; white-space:normal; }
 .footer-social-link { width:40px; height:40px; }
 .footer-brand .footer-social { margin:0; }
 .footer-personal-bottom { flex-wrap:wrap; gap:16px; }
 .footer-legal { order:3; flex-basis:100%; gap:16px; }
 .footer-top { margin-left:auto; }
}
@media(max-width:700px) and (orientation:portrait) {
 .footer-brand { display:grid; grid-template-columns:minmax(0,1fr); justify-items:start; align-items:start; gap:14px; }
 .footer-brand .operus-logo { margin-bottom:2px; }
 .footer-brand p { max-width:290px; }
 .footer-brand .footer-social { margin-top:-2px; }
 .footer-explore { flex-direction:column; flex-wrap:nowrap; gap:0; }
 .footer-explore small { margin-bottom:6px; }
 .footer-explore a { width:100%; flex:0 0 auto; }
}
@media (hover:none) and (pointer:coarse) and (orientation:landscape) {
 .site-foot.footer-personal { padding-bottom:max(12px, env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:reduce) { .footer-social-link { transition:none; } .footer-made .footer-heart { animation:none; } }

/* Subtle directional feedback for footer links. */
.footer-explore a span, .footer-top span { transition:transform .2s ease; }
.footer-explore a:is(:hover,:focus-visible) span { transform:translateX(3px); }

.footer-top:is(:hover,:focus-visible) span { transform:translateY(-3px); }
@media(prefers-reduced-motion:reduce) {
 .footer-explore a span, .footer-top span { transition:none; }
 .footer-explore a:is(:hover,:focus-visible) span, .footer-explore a:not([href*="feed-"]):is(:hover,:focus-visible) span, .footer-top:is(:hover,:focus-visible) span { transform:none; }
}

/* The page-top control floats over the light reading surface and leaves the footer uncluttered. */
.footer-top {
 position:fixed; z-index:20; right:clamp(18px,2.2vw,32px); bottom:28px;
 display:grid; place-items:center; width:54px; height:54px; margin:0; padding:0;
 border:1px solid #ead6b5; border-radius:50%; background:#c5a573; color:transparent;
 font-size:0; box-shadow:0 10px 28px #6d471f38; backdrop-filter:blur(8px);
 opacity:0; visibility:hidden; pointer-events:none; transform:translateY(10px);
 transition:opacity .2s ease,transform .2s ease,visibility .2s ease,background .2s ease,border-color .2s ease;
}
.footer-top span { position:absolute; left:50%; top:50%; width:1px; height:17px; color:#111917; background:currentColor; font-size:0; transform:translate(-50%,-50%); }
.footer-top span::before, .footer-top span::after { position:absolute; top:0; width:8px; height:1px; content:""; background:currentColor; }
.footer-top span::before { right:0; transform:rotate(-45deg); transform-origin:right center; }
.footer-top span::after { left:0; transform:rotate(45deg); transform-origin:left center; }
.footer-top.is-visible { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
.footer-top:is(:hover,:focus-visible) { background:#d1b583; border-color:#f4dfbdb3; }
.footer-top:is(:hover,:focus-visible) span { transform:translate(-50%,-50%); }
.footer-personal a.footer-top:focus-visible { outline:2px solid #9a6a32; outline-offset:4px; }
@media(max-width:700px) { .footer-top { right:20px; bottom:24px; width:42px; height:42px; } .footer-top span { height:15px; } }
@media(prefers-reduced-motion:reduce) { .footer-top { transition:none; } }

.article-title-subline { font-size: .68em; letter-spacing: -.035em; }
.article-hero-media--whole { background: #080705; }
.article-hero-media--whole img { object-fit: cover; object-position: left center; animation: none; transform: none; }