/* v1.4.2: Illustrations on actual pages, not just Appearance previews.
   Image layers are local SVGs; dark/light overlays protect readable text. */
html[data-theme="manga"] body{
 background-image:linear-gradient(90deg,#f8f5e9f2 0%,#f8f5e9e0 62%,#f8f5e9aa 100%),url('theme-art/manga-panel.svg'),radial-gradient(#1112 1px,transparent 1px);
 background-size:cover,min(46vw,560px) auto,8px 8px;
 background-repeat:no-repeat,no-repeat,repeat;
 background-position:center,right 2rem top 7rem,center;
 background-attachment:fixed,fixed,scroll;
}
html[data-theme="grunge"] body{
 background-image:linear-gradient(90deg,#211f1ef5 0%,#211f1edc 62%,#211f1e88 100%),url('theme-art/grunge-flyer.svg'),repeating-linear-gradient(0deg,#fff1 0 1px,transparent 1px 7px);
 background-size:cover,min(48vw,580px) auto,auto;
 background-repeat:no-repeat,no-repeat,repeat;
 background-position:center,right 1.5rem top 7rem,center;
 background-attachment:fixed,fixed,scroll;
}
html[data-theme="bristol"] body{
 background-image:linear-gradient(90deg,#102a35f5 0%,#102a35da 60%,#102a3588 100%),url('theme-art/bristol-harbour.svg'),radial-gradient(ellipse at 100% 0%,#de69402c,transparent 55%);
 background-size:cover,min(55vw,720px) auto,cover;
 background-repeat:no-repeat,no-repeat,no-repeat;
 background-position:center,right 0 top 7rem,center;
 background-attachment:fixed,fixed,scroll;
}
/* Hero illustration appears on pages that have a hero block. */
html[data-theme="manga"] .hero::before{
 background-image:url('theme-art/manga-panel.svg');
 width:min(43%,430px);transform:rotate(-3deg);
 filter:drop-shadow(9px 9px 0 #151515);
}
html[data-theme="grunge"] .hero::before{
 background-image:url('theme-art/grunge-flyer.svg');
 width:min(43%,430px);transform:rotate(4deg);
 filter:drop-shadow(8px 12px 0 #0009);
}
html[data-theme="bristol"] .hero::before{
 background-image:url('theme-art/bristol-harbour.svg');
 width:min(52%,560px);opacity:.96;
 filter:drop-shadow(0 14px 24px #0007);
}
/* Image artwork also appears in section mastheads where a hero is absent. */
html[data-theme="manga"] :is(.top,.page-header)::after,
html[data-theme="grunge"] :is(.top,.page-header)::after,
html[data-theme="bristol"] :is(.top,.page-header)::after{pointer-events:none}
/* Keep all content cards opaque so page art cannot reduce text contrast. */
html[data-theme="manga"] :is(.panel,.stat,.record-card,.gig,.admin-panel){background-color:#fffdf6}
html[data-theme="grunge"] :is(.panel,.stat,.record-card,.gig,.admin-panel){background-color:#302b29}
html[data-theme="bristol"] :is(.panel,.stat,.record-card,.gig,.admin-panel){background-color:#173b46}
@media(max-width:800px){
 html[data-theme="manga"] body,html[data-theme="grunge"] body,html[data-theme="bristol"] body{
  background-size:cover,85vw auto,auto;
  background-position:center,right -15vw top 6rem,center;
  background-attachment:scroll;
 }
 html[data-theme="manga"] .hero::before,html[data-theme="grunge"] .hero::before,html[data-theme="bristol"] .hero::before{
  opacity:.22;width:55%;right:-6%;
 }
}
@media(prefers-reduced-motion:reduce){
 html[data-theme="manga"] .hero::before,html[data-theme="grunge"] .hero::before,html[data-theme="bristol"] .hero::before{animation:none!important}
}