/* Custom Distribution Maps gallery for the BaseV2 skin. */

body.dm-viewer-open {
	overflow:hidden;
}

.dm-page-header .headln h1 {
	margin-top:0;
}

.dm-content {
	width:min(1180px, calc(100% - 28px));
	margin:0 auto;
	padding:4px 0 64px;
	box-sizing:border-box;
}

.dm-controls {
	display:grid;
	grid-template-columns:minmax(180px, 260px) minmax(260px, 1fr) auto;
	align-items:end;
	gap:12px;
	margin:0 0 15px;
	padding:15px;
	border:1px solid rgba(255,255,255,.12);
	border-radius:16px;
	background:rgba(255,255,255,.045);
	box-shadow:0 18px 55px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.035);
}

.dm-search label,
.dm-group label {
	display:block;
	margin:0 0 6px;
	color:rgba(255,255,255,.68);
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
}

.dm-search__control {
	display:flex;
	align-items:center;
	gap:9px;
	min-height:48px;
	padding:0 12px;
	border:1px solid rgba(255,255,255,.17);
	border-radius:11px;
	background:rgba(0,0,0,.24);
	box-sizing:border-box;
}

.dm-search__control:focus-within,
.dm-group select:focus {
	border-color:#72dff2;
	box-shadow:0 0 0 3px rgba(114,223,242,.14);
}

.dm-search__control > span {
	opacity:.58;
	font-size:17px;
}

.dm-search input,
.dm-group select {
	width:100%;
	min-width:0;
	border:0;
	outline:0;
	color:#fff;
	background:transparent;
	font:inherit;
	box-sizing:border-box;
}

.dm-search input {
	height:46px;
}

.dm-search input::placeholder {
	color:rgba(255,255,255,.42);
}

.dm-search input::-webkit-search-cancel-button {
	display:none;
}

.dm-search button {
	flex:0 0 auto;
	width:32px;
	height:32px;
	padding:0;
	border:0;
	border-radius:50%;
	color:#fff;
	background:rgba(255,255,255,.13);
	font-size:22px;
	line-height:30px;
	cursor:pointer;
}

.dm-group select {
	height:48px;
	padding:0 40px 0 12px;
	border:1px solid rgba(255,255,255,.17);
	border-radius:11px;
	background-color:rgba(0,0,0,.24);
	background-image:linear-gradient(45deg, transparent 50%, rgba(255,255,255,.7) 50%), linear-gradient(135deg, rgba(255,255,255,.7) 50%, transparent 50%);
	background-position:calc(100% - 18px) 21px, calc(100% - 13px) 21px;
	background-size:5px 5px, 5px 5px;
	background-repeat:no-repeat;
	appearance:none;
}

.dm-group option {
	color:#111;
	background:#fff;
}

.dm-results {
	align-self:center;
	min-width:105px;
	padding:18px 2px 0;
	color:rgba(255,255,255,.62);
	font-size:13px;
	text-align:right;
	white-space:nowrap;
}

.dm-results strong {
	color:#fff;
	font-size:19px;
}

.dm-grid {
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:18px;
}

.dm-card[hidden] {
	display:none;
}

.dm-card {
	min-width:0;
	overflow:hidden;
	border:1px solid rgba(255,255,255,.11);
	border-radius:16px;
	background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
	box-shadow:0 15px 38px rgba(0,0,0,.17);
	transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dm-card:hover,
.dm-card:focus-within {
	border-color:rgba(114,223,242,.38);
	box-shadow:0 22px 48px rgba(0,0,0,.28);
	transform:translateY(-3px);
}

.dm-card__link {
	display:flex;
	height:100%;
	flex-direction:column;
	color:inherit;
	text-decoration:none;
}

.dm-card__link:hover,
.dm-card__link:focus {
	color:inherit;
	text-decoration:none;
}

.dm-card__image-wrap {
	position:relative;
	display:grid;
	place-items:center;
	aspect-ratio:1.18;
	overflow:hidden;
	padding:15px;
	background:
		radial-gradient(circle at 50% 35%, rgba(114,223,242,.08), transparent 58%),
		#0a0d0f;
	box-sizing:border-box;
}

#content .dm-card__image-wrap img {
	display:block;
	width:100%;
	height:100%;
	margin:0;
	object-fit:contain;
	filter:saturate(.94) contrast(1.02);
	transition:transform .25s ease;
}

.dm-card:hover .dm-card__image-wrap img,
.dm-card:focus-within .dm-card__image-wrap img {
	transform:scale(1.018);
}

.dm-card__open {
	position:absolute;
	right:12px;
	bottom:12px;
	padding:6px 9px;
	border:1px solid rgba(255,255,255,.16);
	border-radius:999px;
	color:#fff;
	background:rgba(0,0,0,.72);
	backdrop-filter:blur(8px);
	font-size:10px;
	font-weight:700;
	letter-spacing:.05em;
	text-transform:uppercase;
	opacity:0;
	transform:translateY(5px);
	transition:opacity .18s ease, transform .18s ease;
}

.dm-card:hover .dm-card__open,
.dm-card:focus-within .dm-card__open {
	opacity:1;
	transform:none;
}

.dm-card__body {
	display:block;
	flex:1;
	padding:15px 16px 17px;
}

.dm-card__taxonomy {
	display:flex;
	flex-wrap:wrap;
	gap:6px;
	color:#72dff2;
	font-size:10px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
}

.dm-card__subgroup::before {
	content:"/";
	margin-right:6px;
	color:rgba(255,255,255,.36);
}

#content .dm-card h2 {
	margin:8px 0 0;
	color:#fff;
	font-size:17px;
	font-weight:650;
	line-height:1.28;
}

.dm-card__subtitle {
	margin:6px 0 0;
	color:rgba(255,255,255,.6);
	font-size:12px;
	line-height:1.45;
}

.dm-empty {
	max-width:520px;
	margin:30px auto 0;
	padding:38px 22px;
	border:1px dashed rgba(255,255,255,.2);
	border-radius:16px;
	text-align:center;
}

.dm-empty[hidden] {
	display:none;
}

.dm-empty h2 {
	margin-top:0;
}

.dm-empty p {
	color:rgba(255,255,255,.62);
}

.dm-empty button,
.dm-detail__actions button,
.dm-detail__actions a {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:42px;
	padding:9px 14px;
	border:1px solid rgba(114,223,242,.45);
	border-radius:10px;
	color:#fff;
	background:rgba(114,223,242,.13);
	font:inherit;
	text-decoration:none;
	cursor:pointer;
	box-sizing:border-box;
}

.dm-content--detail {
	max-width:1060px;
}

.dm-detail {
	margin-top:6px;
}

.dm-detail__topline {
	display:flex;
	justify-content:space-between;
	gap:18px;
	margin-bottom:20px;
	color:rgba(255,255,255,.55);
	font-size:12px;
}

.dm-back-link {
	color:#72dff2;
	text-decoration:none;
}

.dm-detail__heading {
	max-width:800px;
	margin:0 auto 22px;
	text-align:center;
}

.dm-detail__heading > p {
	margin:0 0 8px;
	color:#72dff2;
	font-size:11px;
	font-weight:700;
	letter-spacing:.09em;
	text-transform:uppercase;
}

#content .dm-detail__heading h2 {
	margin:0;
	color:#fff;
	font-size:clamp(25px, 4vw, 39px);
	line-height:1.15;
}

.dm-detail__subtitle {
	margin:9px 0 0;
	color:rgba(255,255,255,.64);
	font-size:15px;
}

.dm-detail__image-link {
	position:relative;
	display:grid;
	place-items:center;
	min-height:420px;
	padding:20px;
	overflow:hidden;
	border:1px solid rgba(255,255,255,.13);
	border-radius:18px;
	background:
		radial-gradient(circle at 50% 40%, rgba(114,223,242,.06), transparent 60%),
		#080a0c;
	box-shadow:0 25px 70px rgba(0,0,0,.35);
	box-sizing:border-box;
}

#content .dm-detail__image-link img {
	display:block;
	width:auto;
	max-width:100%;
	max-height:78vh;
	margin:0;
	object-fit:contain;
}

.dm-detail__image-link > span {
	position:absolute;
	right:15px;
	bottom:15px;
	padding:8px 11px;
	border:1px solid rgba(255,255,255,.17);
	border-radius:999px;
	color:#fff;
	background:rgba(0,0,0,.76);
	font-size:11px;
	font-weight:700;
}

.dm-detail__actions {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:9px;
	margin:16px 0 25px;
}

.dm-detail__pager {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px;
}

.dm-detail__pager a {
	display:flex;
	flex-direction:column;
	gap:4px;
	padding:15px;
	border:1px solid rgba(255,255,255,.11);
	border-radius:13px;
	color:#fff;
	background:rgba(255,255,255,.04);
	text-decoration:none;
}

.dm-detail__pager a:last-child {
	text-align:right;
}

.dm-detail__pager span {
	color:rgba(255,255,255,.5);
	font-size:10px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
}

.dm-detail__pager strong {
	font-size:13px;
}

.dm-detail__context {
	margin:22px 0 0;
	color:rgba(255,255,255,.42);
	font-size:11px;
	text-align:center;
}

.dm-viewer[hidden] {
	display:none;
}

.dm-viewer {
	position:fixed;
	inset:0;
	z-index:100000;
	display:grid;
	place-items:center;
	padding:12px;
	box-sizing:border-box;
}

.dm-viewer__backdrop {
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.9);
	backdrop-filter:blur(8px);
}

.dm-viewer__panel {
	position:relative;
	display:grid;
	grid-template-rows:auto minmax(0, 1fr) auto;
	width:min(1500px, 100%);
	height:min(960px, calc(100vh - 24px));
	overflow:hidden;
	border:1px solid rgba(255,255,255,.16);
	border-radius:18px;
	color:#fff;
	background:#080a0c;
	box-shadow:0 30px 100px rgba(0,0,0,.65);
}

.dm-viewer__header {
	z-index:3;
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:18px;
	min-height:56px;
	padding:12px 14px 10px 18px;
	border-bottom:1px solid rgba(255,255,255,.1);
	background:rgba(10,12,14,.96);
	box-sizing:border-box;
}

.dm-viewer__heading {
	min-width:0;
}

.dm-viewer__count {
	display:block;
	margin-bottom:2px;
	color:#72dff2;
	font-size:9px;
	font-weight:700;
	letter-spacing:.09em;
	text-transform:uppercase;
}

.dm-viewer__heading h2 {
	margin:0;
	overflow:hidden;
	color:#fff;
	font-size:17px;
	line-height:1.22;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.dm-viewer__heading p {
	margin:3px 0 0;
	overflow:hidden;
	color:rgba(255,255,255,.58);
	font-size:11px;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.dm-viewer__close {
	flex:0 0 auto;
	width:40px;
	height:40px;
	padding:0;
	border:1px solid rgba(255,255,255,.13);
	border-radius:50%;
	color:#fff;
	background:rgba(255,255,255,.07);
	font-size:27px;
	line-height:36px;
	cursor:pointer;
}

.dm-viewer__stage {
	position:relative;
	display:grid;
	grid-template-columns:auto minmax(0, 1fr) auto;
	min-height:0;
	background:
		linear-gradient(45deg, rgba(255,255,255,.018) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.018) 75%),
		linear-gradient(45deg, rgba(255,255,255,.018) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.018) 75%),
		#050607;
	background-position:0 0, 16px 16px;
	background-size:32px 32px;
}

.dm-viewer__canvas {
	position:relative;
	min-width:0;
	min-height:0;
	overflow:hidden;
	touch-action:none;
	cursor:grab;
}

.dm-viewer__canvas.is-dragging {
	cursor:grabbing;
}

#content .dm-viewer__image,
.dm-viewer__image {
	position:absolute;
	top:50%;
	left:50%;
	display:block;
	width:auto;
	height:auto;
	max-width:min(92%, 1240px);
	max-height:92%;
	margin:0;
	user-select:none;
	transform:translate(-50%, -50%);
	transform-origin:center center;
	will-change:transform;
}

.dm-viewer__nav {
	z-index:2;
	align-self:center;
	width:46px;
	height:62px;
	margin:8px;
	padding:0;
	border:1px solid rgba(255,255,255,.11);
	border-radius:13px;
	color:#fff;
	background:rgba(0,0,0,.5);
	font-size:38px;
	line-height:54px;
	cursor:pointer;
}

.dm-viewer__nav:hover,
.dm-viewer__nav:focus-visible,
.dm-viewer__close:hover,
.dm-viewer__close:focus-visible {
	border-color:rgba(114,223,242,.5);
	background:rgba(114,223,242,.13);
}

.dm-viewer__toolbar {
	z-index:3;
	display:grid;
	grid-template-columns:auto 1fr auto;
	align-items:center;
	gap:14px;
	min-height:54px;
	padding:9px 14px;
	border-top:1px solid rgba(255,255,255,.1);
	background:rgba(10,12,14,.97);
	box-sizing:border-box;
}

.dm-viewer__zoom,
.dm-viewer__actions {
	display:flex;
	align-items:center;
	gap:6px;
}

.dm-viewer__zoom button,
.dm-viewer__actions button,
.dm-viewer__actions a {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:38px;
	min-height:36px;
	padding:6px 10px;
	border:1px solid rgba(255,255,255,.13);
	border-radius:9px;
	color:#fff;
	background:rgba(255,255,255,.06);
	font:inherit;
	font-size:11px;
	text-decoration:none;
	cursor:pointer;
	box-sizing:border-box;
}

.dm-viewer__zoom [data-dm-reset] {
	min-width:58px;
}

.dm-viewer__taxonomy {
	margin:0;
	overflow:hidden;
	color:rgba(255,255,255,.54);
	font-size:11px;
	text-align:center;
	text-overflow:ellipsis;
	white-space:nowrap;
}

@media (max-width:900px) {
	.dm-grid {
		grid-template-columns:repeat(2, minmax(0, 1fr));
	}

	.dm-controls {
		grid-template-columns:minmax(180px, 230px) minmax(0, 1fr);
	}

	.dm-results {
		grid-column:1 / -1;
		padding:0;
		text-align:left;
	}

	.dm-viewer__toolbar {
		grid-template-columns:auto 1fr;
	}

	.dm-viewer__taxonomy {
		display:none;
	}
}

@media (max-width:620px) {
	.dm-page-header .headln {
		margin-right:12px;
		margin-left:12px;
	}

	.dm-page-header .headln h1 {
		min-height:0;
		font-size:clamp(26px, 7.7vw, 31px);
		line-height:1.12;
	}

	.dm-content {
		width:min(100% - 20px, 1180px);
		padding-bottom:45px;
	}

	.dm-controls {
		display:block;
		padding:12px;
		border-radius:14px;
	}

	.dm-search {
		margin-top:11px;
	}

	.dm-results {
		padding-top:10px;
	}

	.dm-grid {
		grid-template-columns:1fr;
		gap:13px;
	}

	.dm-card {
		border-radius:14px;
	}

	.dm-card__image-wrap {
		aspect-ratio:1.25;
	}

	.dm-card__open {
		opacity:1;
		transform:none;
	}

	.dm-detail__image-link {
		min-height:300px;
		padding:10px;
	}

	.dm-detail__pager {
		grid-template-columns:1fr;
	}

	.dm-detail__pager a:last-child {
		text-align:left;
	}

	.dm-viewer {
		padding:0;
	}

	.dm-viewer__panel {
		width:100%;
		height:100vh;
		border:0;
		border-radius:0;
	}

	.dm-viewer__header {
		padding-left:12px;
	}

	.dm-viewer__heading h2 {
		font-size:15px;
	}

	.dm-viewer__stage {
		grid-template-columns:1fr;
	}

	.dm-viewer__canvas {
		grid-area:1 / 1;
	}

	.dm-viewer__nav {
		position:absolute;
		z-index:4;
		top:50%;
		width:40px;
		height:56px;
		margin:0;
		transform:translateY(-50%);
	}

	.dm-viewer__nav--prev {
		left:7px;
	}

	.dm-viewer__nav--next {
		right:7px;
	}

	.dm-viewer__toolbar {
		grid-template-columns:1fr auto;
		gap:8px;
		padding:8px;
	}

	.dm-viewer__actions button,
	.dm-viewer__actions a {
		padding:6px 8px;
		font-size:10px;
	}

	.dm-viewer__actions [data-dm-copy] {
		display:none;
	}
}

@media (prefers-reduced-motion:reduce) {
	.dm-card,
	.dm-card__image-wrap img,
	.dm-card__open {
		transition:none;
	}
}
