/* 50rem is a practical reading width, not a legally prescribed pixel size.
 * Keep the complete artwork proportional; narrow viewers scroll instead of
 * shrinking it into a thumbnail. Controls and the information link stay outside. */
.wslc-lg-dialog {
	box-sizing: border-box;
	width: calc(100vw - 2rem);
	max-width: 54rem;
	max-height: calc(100vh - 2rem);
	max-height: calc(100dvh - 2rem);
	padding: 1rem;
	border: 1px solid #444;
	border-radius: .25rem;
	background: #fff;
	color: #222;
}

.wslc-lg-dialog:not([open]) { display: none; }
.wslc-lg-dialog[open] { display: flex; flex-direction: column; gap: .75rem; }
.wslc-lg-dialog::backdrop { background: rgb(0 0 0 / 65%); }
.wslc-lg-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; flex: 0 0 auto; }
.wslc-lg-heading h2 { margin: 0; font-size: 1.25rem; }
.wslc-lg-close { flex: 0 0 auto; }
.wslc-lg-viewer { overflow: auto; max-width: 100%; min-height: 0; }
.wslc-lg-dialog .wslc-lg-viewer { flex: 1 1 auto; }
.wslc-lg-viewer .wslc-lg-notice { display: block; width: 50rem; min-width: 50rem; max-width: none; height: auto; margin: 0; }
.wslc-lg-information { flex: 0 0 auto; margin: 0; }
.wslc-lg-inline .wslc-lg-information { margin-top: .75rem; }
.wslc-lg-trigger, .wslc-lg-close { cursor: pointer; }
.wslc-lg-trigger {
	display: inline-flex;
	align-items: center;
	padding: .5em .85em;
	border: 1px solid currentColor;
	border-radius: .25rem;
	background: transparent;
	color: inherit;
	font-weight: 600;
	line-height: 1.4;
}
.wslc-lg-trigger:focus-visible, .wslc-lg-close:focus-visible,
.wslc-lg-viewer:focus-visible, .wslc-lg-information a:focus-visible { outline: 3px solid #005fcc; outline-offset: 3px; }