/* =========================================================================
   Single report page wrapper.
   The article body itself ships its own scoped (prefixed) CSS — this
   file only styles the surrounding container, the thumbnail frame, and
   the page-level mobile responsiveness.
   ========================================================================= */

body:has(.wrc-single) {
	background: #06090f;
}
.wrc-single {
	max-width: 1180px;
	margin: 0 auto;
	padding: 36px 24px 80px;
	color: #e8eef5;
	overflow-wrap: break-word;
	word-wrap: break-word;
}
.wrc-single__thumb {
	margin: 0 0 28px;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 18px 60px rgba(0,0,0,0.55);
	border: 1px solid rgba(255,255,255,0.08);
}
.wrc-single__thumb img { display: block; width: 100%; height: auto; }
.wrc-single__body { padding-top: 4px; }

.wrc-tone-danger  .wrc-single__thumb { box-shadow: 0 18px 60px rgba(220,38,38,0.22); }
.wrc-tone-warning .wrc-single__thumb { box-shadow: 0 18px 60px rgba(245,158,11,0.22); }
.wrc-tone-safe    .wrc-single__thumb { box-shadow: 0 18px 60px rgba(13,177,227,0.22); }
.wrc-tone-ok      .wrc-single__thumb { box-shadow: 0 18px 60px rgba(87,197,127,0.22); }
.wrc-tone-caution .wrc-single__thumb { box-shadow: 0 18px 60px rgba(234,179,8,0.22); }

/* Defensive resets so wide images / pre / table inside the article body
   never push the layout sideways on mobile. */
.wrc-single img,
.wrc-single video,
.wrc-single iframe,
.wrc-single svg { max-width: 100%; height: auto; }
.wrc-single pre,
.wrc-single table { max-width: 100%; overflow-x: auto; }

/* Mobile pass */
@media (max-width: 760px) {
	.wrc-single { padding: 18px 0 60px; }
	.wrc-single__thumb { border-radius: 0; margin: 0 0 18px; border-left: 0; border-right: 0; }
}

/* Page-level — guarantee no horizontal overflow on the post template */
html, body { overflow-x: hidden; }
