/* Inkling renderer — glow theme */

.inkrender {}
.inkrender p {
	margin: 0 0 1em 0;
}
.inkrender p:last-child { margin-bottom: 0; }
.inkrender strong { color: #fff; font-weight: 600; }
.inkrender a {
	color: #8feaff; text-decoration: none;
	border-bottom: 1px solid rgba(143, 234, 255, 0.35);
}
.inkrender a:hover { color: #fff; border-bottom-color: #fff; }

.inkrender .component {
	display: block; position: relative;
	margin-top: 12px;
	background: rgba(143, 234, 255, 0.04);
	border: 1px solid rgba(143, 234, 255, 0.15);
	border-radius: 12px;
	overflow: hidden;
}
.inkrender .component.solo,
.inkrender .component.text {
	background: none;
	border: none;
	border-radius: 0;
	margin-top: 0;
	overflow: visible;
}

.inkrender .component .items {
	display: block; position: relative;
	padding: 12px;
}
.inkrender .component .item {
	background: rgba(5, 8, 16, 0.35);
	border: 1px solid rgba(143, 234, 255, 0.1);
	border-radius: 10px;
}

/* Quote */
.inkrender .component.quote {
	padding: 14px 16px;
	background: rgba(5, 8, 16, 0.4);
	border-left: 3px solid #8feaff;
	border-top: 1px solid rgba(143, 234, 255, 0.18);
	border-right: 1px solid rgba(143, 234, 255, 0.18);
	border-bottom: 1px solid rgba(143, 234, 255, 0.18);
	border-radius: 0 12px 12px 0;
}
.inkrender .component.quote .label {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 0.8125rem;
	color: #8feaff;
	margin-bottom: 6px;
}
.inkrender .component.quote .text {
	font-size: 0.9375rem; line-height: 1.55;
	color: rgba(216, 240, 255, 0.78);
}

/* Links */
.inkrender .component.links .items { padding-top: 0; }
.inkrender .component.links .item.link {
	display: flex; position: relative; align-items: center;
	margin-top: 12px; padding: 12px;
	background: rgba(5, 8, 16, 0.35);
	border: 1px solid rgba(143, 234, 255, 0.12);
	border-radius: 10px;
}
.inkrender .component.links .item.link .thumbnail {
	flex: 0 0 7rem; position: relative;
	width: 7rem; height: 5.25rem; margin-right: 1rem;
	background: rgba(5, 8, 16, 0.6);
	border: 1px solid rgba(143, 234, 255, 0.12);
	border-radius: 8px;
	overflow: hidden;
	font-size: 1.75rem; color: rgba(216, 240, 255, 0.4);
}
.inkrender .component.links.q2 .item.link .thumbnail {
	width: 9rem; height: 6.75rem;
}
.inkrender .component.links .item.link .thumbnail i,
.inkrender .component.links .item.link .thumbnail img {
	display: block; position: absolute;
	left: 50%; top: 50%; width: auto; height: auto; max-width: 100%; max-height: 100%; transform: translate(-50%, -50%);
}
.inkrender .component.links .item.link .info {
	flex: 1 1 auto; position: relative; min-width: 0;
	white-space: normal;
}
.inkrender .component.links .item.link .title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; color: #fff;
}
.inkrender .component.links .item.link .url {
	margin-top: 0.4rem;
}
.inkrender .component.links .item.link .url a {
	color: #8feaff; text-decoration: none;
	border-bottom: 1px solid rgba(143, 234, 255, 0.3);
	font-size: 0.8125rem;
	word-break: break-all;
}
.inkrender .component.links .item.link .url a:hover {
	color: #fff; border-bottom-color: #fff;
}
.inkrender .component.links .item.link .description {
	margin-top: 0.5rem;
	font-size: 0.8125rem; line-height: 1.5;
	color: rgba(216, 240, 255, 0.7);
}

/* YouTube embed */
.inkrender .component.links .item.youtube {
	display: block;
	width: auto; max-width: 100%; margin: 12px 0 0 0;
}
.inkrender .component.links .item.youtube .video {
	display: block; position: relative; overflow: hidden; clear: both;
	height: 0; padding: 0 0 56.25% 0;
	background: rgba(5, 8, 16, 0.5);
	border: 1px solid rgba(143, 234, 255, 0.18);
	border-radius: 10px;
}
.inkrender .component.links .item.youtube .video iframe {
	position: absolute;
	left: 0; top: 0; width: 100%; height: 100%;
	border: 0;
}

/* Media — image/video gallery with thumbs */
.inkrender .component.media .inkviewer { display: flex; }
.inkrender .component.media .full {
	flex: 1 1 auto; position: relative;
	border-right: 1px solid rgba(143, 234, 255, 0.15);
}
.inkrender .component.media.qty1 .full { margin: 0 auto; border-right: none; }
.inkrender .component.media .full .zoom {
	display: flex; align-items: center; justify-content: center;
	box-sizing: border-box;
	position: absolute; z-index: 999;
	right: 12px; top: 12px; width: 32px; height: 32px;
	background: rgba(5, 8, 16, 0.7);
	border: 1px solid rgba(143, 234, 255, 0.4);
	border-radius: 8px;
	color: #8feaff;
	cursor: pointer;
	transition: all 0.15s;
}
.inkrender .component.media .full .zoom:hover {
	background: rgba(143, 234, 255, 0.18); color: #fff;
}
.inkrender .component.media .full .wrap {
	display: block; position: relative;
	width: 100%; padding: 0 0 75% 0; height: 100%;
}
.inkrender .component.media .full .wrap img,
.inkrender .component.media .full .wrap video {
	position: absolute;
	left: 0; top: 0; width: 100%; height: 100%;
	object-fit: contain;
}
/* Single item — show at natural size, capped to container width */
.inkrender .component.media.qty1 .full .wrap {
	padding: 0; height: auto;
}
.inkrender .component.media.qty1 .full .wrap img,
.inkrender .component.media.qty1 .full .wrap video {
	position: static;
	display: block;
	width: auto; height: auto;
	max-width: 100%; max-height: 500px;
	margin: 0 auto;
}
.inkrender .component.media .thumbs {
	flex: 0 0 6.5rem;
	background: rgba(5, 8, 16, 0.4);
	overflow-y: auto;
}
.inkrender .component.media.qty1 .thumbs { display: none; }
.inkrender .component.media.qty5 .thumbs,
.inkrender .component.media.qty6 .thumbs,
.inkrender .component.media.qty7 .thumbs,
.inkrender .component.media.qty8 .thumbs { flex-basis: 12.25rem; }
.inkrender .component.media.qty9 .thumbs,
.inkrender .component.media.qty10 .thumbs,
.inkrender .component.media.qty11 .thumbs,
.inkrender .component.media.qty12 .thumbs { flex-basis: 18rem; }

.inkrender .component.media .items {
	display: flex; flex-wrap: wrap; align-content: flex-start;
	padding: 12px;
	gap: 8px;
}
.inkrender .component.media .item {
	display: block; position: relative;
	width: 5rem; height: 5rem;
	background: rgba(5, 8, 16, 0.5);
	border: 1px solid rgba(143, 234, 255, 0.15);
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	transition: all 0.15s;
}
.inkrender .component.media .item:hover {
	border-color: rgba(143, 234, 255, 0.4);
}
.inkrender .component.media .item.current {
	border-color: #8feaff;
	box-shadow: 0 0 10px rgba(143, 234, 255, 0.4);
}
.inkrender .component.media .item img {
	display: block;
	position: absolute;
	left: 50%; top: 50%; width: auto; height: 100%; max-width: 100%;
	transform: translate(-50%, -50%);
}
.inkrender .component.media .item.current img { opacity: 0.55; }
.inkrender .component.media .item.image::after,
.inkrender .component.media .item.video::after {
	content: "\f03e";
	display: flex; align-items: center; justify-content: center; position: absolute;
	right: 4px; bottom: 4px; width: 20px; height: 20px;
	background: rgba(5, 8, 16, 0.78);
	border: 1px solid rgba(143, 234, 255, 0.35);
	border-radius: 5px;
	font-family: "Font Awesome 7 Pro"; font-weight: 300;
	font-size: 0.6875rem; color: #8feaff;
}
.inkrender .component.media .item.video::after { content: "\f008"; }

/* Files */
.inkrender .component.files .items {
	padding-top: 0;
	display: flex; flex-wrap: wrap; gap: 12px;
}
.inkrender .component.files .item {
	display: flex; align-items: center; position: relative;
	margin: 12px 0 0 0;
	padding: 12px 14px 12px 56px;
	background: rgba(5, 8, 16, 0.35);
	border: 1px solid rgba(143, 234, 255, 0.15);
	border-radius: 10px;
	color: rgba(216, 240, 255, 0.85); text-decoration: none;
}
.inkrender .component.files .item:hover {
	border-color: rgba(143, 234, 255, 0.4);
	background: rgba(143, 234, 255, 0.05);
}
.inkrender .component.files .item .icon {
	display: flex; align-items: center; justify-content: center;
	position: absolute;
	left: 12px; top: 50%; transform: translateY(-50%);
	width: 32px; height: 32px;
	margin-right: 0;
	font-size: 1.25rem; line-height: 1;
	color: #8feaff;
	filter: drop-shadow(0 0 6px rgba(143, 234, 255, 0.4));
}
.inkrender .component.files .item .info { flex: 1 1 auto; min-width: 0; }
.inkrender .component.files .item .info .name {
	display: block;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; color: #fff;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.inkrender .component.files .item .info .details {
	display: block;
	margin-top: 0.25rem;
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem; letter-spacing: 0.1em;
	color: rgba(216, 240, 255, 0.55);
}

/* Banner image */
.inkrender .banner {
	display: block; position: relative;
	width: 100%; padding: 0 0 33.3333% 0;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid rgba(143, 234, 255, 0.2);
}
.inkrender .banner img {
	display: block; position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
	object-fit: cover;
}

/* Zoomer modal */
#zoomer {
	display: none; position: fixed; z-index: 9999;
	left: 0; top: 0; right: 0; bottom: 0;
	background: rgba(5, 8, 16, 0.92);
	backdrop-filter: blur(6px);
}
#zoomer .media {
	display: block; position: absolute;
	left: 0; top: 0;
}
#zoomer .media img,
#zoomer .media video {
	position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
	object-fit: contain;
}
#zoomer .close {
	display: flex; align-items: center; justify-content: center;
	box-sizing: border-box;
	position: absolute;
	right: 16px; top: 16px;
	width: 36px; height: 36px;
	background: rgba(5, 8, 16, 0.7);
	border: 1px solid rgba(143, 234, 255, 0.4);
	border-radius: 10px;
	font-size: 1rem; color: #8feaff;
	cursor: pointer;
}
#zoomer .close:hover {
	background: rgba(143, 234, 255, 0.18); color: #fff;
}