/* DEVIL Season22: exact reference frames, single-layer rendering, 2026-11-11.
   Loaded LAST. Only the main page is affected. Live ranking and board text remains HTML. */
body:has(.dr-page) .dr-canvas{
 background:#090204 url('../assets/season22_header_clean_v13.jpg') 0 0 / 1535px 1024px no-repeat!important;
}
body:has(.dr-page) .dr-canvas::before,body:has(.dr-page) .dr-canvas::after,
body:has(.dr-page) .dr-hero-link::before,body:has(.dr-page) .dr-hero-link::after{content:none!important;display:none!important}
body:has(.dr-page) .dr-hero-link{background:none!important}
/* One transparent logo, not a logo printed twice into the header. */
body:has(.dr-page) .dr-logo{background:transparent url('../assets/season22_logo_transparent_v13.png') center top / 293px 91px no-repeat!important;box-shadow:none!important;border:0!important;outline:0!important}
body:has(.dr-page) .dr-logo::before,body:has(.dr-page) .dr-logo::after{content:none!important;display:none!important}
/* Existing blank frame PNGs contain the exact shaped edges, without duplicated lettering. */
body:has(.dr-page) .dr-rank,
body:has(.dr-page) .dr-online,
body:has(.dr-page) .s22-status,
body:has(.dr-page) .s22-gallery,
body:has(.dr-page) .dr-boards>.dr-board{
 border:0!important;border-radius:0!important;outline:0!important;
 box-shadow:none!important;background-color:transparent!important;
 background-repeat:no-repeat!important;background-position:center!important;background-size:100% 100%!important;
}
body:has(.dr-page) .dr-rank{background-image:url('../assets/s22_frame_rank_v10.png')!important;padding:0!important;overflow:hidden!important}
body:has(.dr-page) .dr-online{background-image:url('../assets/s22_frame_online_v10.png')!important;padding:0!important;overflow:hidden!important}
body:has(.dr-page) .s22-status{background-image:url('../assets/s22_frame_status_v10.png')!important;padding:10px!important;overflow:hidden!important}
body:has(.dr-page) .s22-gallery{background-image:url('../assets/s22_frame_gallery_v10.png')!important;overflow:hidden!important}
body:has(.dr-page) .dr-boards>.dr-board{background-image:url('../assets/s22_frame_board_v10.png')!important;overflow:hidden!important}
body:has(.dr-page) .dr-rank::before,body:has(.dr-page) .dr-rank::after,
body:has(.dr-page) .dr-online::before,body:has(.dr-page) .dr-online::after,
body:has(.dr-page) .s22-status::before,body:has(.dr-page) .s22-status::after,
body:has(.dr-page) .s22-gallery::before,body:has(.dr-page) .s22-gallery::after,
body:has(.dr-page) .dr-boards>.dr-board::before,body:has(.dr-page) .dr-boards>.dr-board::after{content:none!important;display:none!important}
/* Headings remain live, but do not paint a second rectangular frame over the PNG. */
body:has(.dr-page) .dr-rank h3,body:has(.dr-page) .dr-online h3,
body:has(.dr-page) .s22-status h3,body:has(.dr-page) .dr-board h3,
body:has(.dr-page) .s22-section-head{box-shadow:none!important;border-radius:0!important}
body:has(.dr-page) .dr-rank .dr-more{left:50%!important;right:auto!important;transform:translateX(-50%)!important;display:flex!important;align-items:center!important;justify-content:center!important;max-width:220px!important;box-sizing:border-box!important}
/* Five feature panels are rasterized from the supplied reference so the icon, font,
   box bevel, and internal spacing exactly match; existing anchors remain clickable. */
body:has(.dr-page) .dr-features{left:310px!important;top:360px!important;width:878px!important;height:137px!important;gap:0!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;background:url('../assets/s22_feature_reference_exact.png') center / 100% 100% no-repeat!important}
body:has(.dr-page) .dr-features>a{border:0!important;outline:0!important;border-radius:0!important;box-shadow:none!important;background:none!important;background-image:none!important;min-width:0!important;overflow:hidden!important;padding:0!important;color:transparent!important;text-shadow:none!important;font-size:0!important}
body:has(.dr-page) .dr-features>a span,body:has(.dr-page) .dr-features>a b,body:has(.dr-page) .dr-features>a small{visibility:hidden!important}
body:has(.dr-page) .dr-features>a::before,body:has(.dr-page) .dr-features>a::after{content:none!important;display:none!important}
/* Footer: original five-segment artwork and original icons, not duplicated glyphs. */
body:has(.dr-page) .s22-footer-links{left:108px!important;top:885px!important;width:1322px!important;height:87px!important;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;overflow:hidden!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;background:transparent url('../assets/s22_footer_reference_exact.png') center / 100% 100% no-repeat!important}
body:has(.dr-page) .s22-footer-links>a{border:0!important;background:none!important;box-shadow:none!important;color:transparent!important;font-size:0!important;text-shadow:none!important;opacity:1!important}
body:has(.dr-page) .s22-footer-links>a b,body:has(.dr-page) .s22-footer-links>a small{visibility:hidden!important}
body:has(.dr-page) .s22-footer-links::before,body:has(.dr-page) .s22-footer-links::after{content:none!important;display:none!important}
/* Gallery arrows and interactive dots stay above the frame. */
body:has(.dr-page) .s22-gallery-arrow{z-index:30!important;opacity:1!important;visibility:visible!important}
/* Right-side original artwork is intentionally not overridden. */

/* v19: render the scenery exactly once. Do not layer decorative full-page
   artwork on the canvas, its wrappers, or the hero link. */
html body:has(.dr-page) .dr-page{
 background:#090204!important;
 background-image:none!important;
}
html body:has(.dr-page) .dr-canvas{
 background-color:#090204!important;
 background-image:url('../assets/season22_header_clean_v13.jpg')!important;
 background-repeat:no-repeat!important;
 background-position:0 0!important;
 background-size:1535px 1024px!important;
}
html body:has(.dr-page) .dr-page::before,
html body:has(.dr-page) .dr-page::after,
html body:has(.dr-page) .dr-canvas::before,
html body:has(.dr-page) .dr-canvas::after,
html body:has(.dr-page) .dr-hero-link::before,
html body:has(.dr-page) .dr-hero-link::after{
 content:none!important;display:none!important;
 background:none!important;
}
html body:has(.dr-page) .dr-hero-link{
 background:none!important;background-image:none!important;
 box-shadow:none!important;border:0!important;
}
/* The canvas already contains the central DEVIL SERVER lettering.
   Only the small transparent navigation logo is drawn separately. */
html body:has(.dr-page) .dr-logo{
 background-color:transparent!important;
 background-image:url('../assets/season22_logo_transparent_v13.png')!important;
 background-repeat:no-repeat!important;
 background-position:center top!important;
 background-size:293px 91px!important;
}
