/* Compact tiles: caption panel is portaled next to the cursor / long-press point. */

.modula .modula-items .modula-item.modula-item--compact-caption {
	/* Keep normal tile clipping — panel lives on document.body. */
	isolation: isolate;
}

.modula .modula-caption-popover {
	position: absolute;
	inset: 0;
	z-index: 8;
	pointer-events: none;
	box-sizing: border-box;
	overflow: visible;
}

/* Fixed tooltip next to the pointer (rendered via portal on body). */
.modula-caption-popover__panel {
	position: fixed;
	z-index: 100000;
	width: max-content;
	max-width: min(280px, calc(100vw - 16px));
	max-height: min(200px, 40vh);
	overflow: auto;
	padding: 8px 10px;
	border-radius: 6px;
	background: #1d2327;
	color: #fff;
	box-shadow:
		0 6px 20px rgba(0, 0, 0, 0.28),
		0 0 0 1px rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	pointer-events: none;
}

/* Touch long-press: allow reading / scrolling without clicking through to the tile. */
.modula-caption-popover__panel--touch {
	pointer-events: auto;
}

.modula-caption-popover__title {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.25;
	word-break: break-word;
}

.modula-caption-popover__description {
	margin: 0;
	font-size: 11px;
	font-weight: 400;
	line-height: 1.35;
	word-break: break-word;

	&:not(:first-child) {
		margin-top: 4px;
	}

	p {
		margin: 0 0 0.35em;

		&:last-child {
			margin-bottom: 0;
		}
	}
}