:root {
	--bg-0:#0e1013;
	--bg-1:#121418;
	--surface:#1e222a;
	--text:#e6e6e6;
	--muted:#a9b0bb;
	--primary:#10a37f;
	--primary-700:#0d7f63;
	--ring:0 0 0 .25rem rgba(16,163,127,.35)
}
html,body{height:100%}
body {
	background:linear-gradient(180deg,var(--bg-0),var(--bg-1));
	color:var(--text);
	font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
	overflow-x: hidden;
}
main {
	margin-top:44px;
}
a{color:var(--primary)}
.navbar {
	background:rgba(18,20,24,.8);
	backdrop-filter:saturate(140%) blur(10px);
	border-bottom:1px solid #262b36;
	padding-top: 0;
	padding-bottom: 0;
}
.navbar-brand img{height: 32px; width: auto;}
.grid-card {
	background:linear-gradient(180deg,#1a1f27,#161a21);
	border:1px solid #2a303b;
}
.thumb {
	position:relative;
	aspect-ratio:16/10;
	overflow:hidden;
	background-color: var(--surface);
	display: flex;
	justify-content: center;
	align-items: center;
}
.thumb img {
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:0;
	transition: opacity .4s ease;
}
.thumb img.loaded {
	opacity:1;
}
.thumb:hover img.loaded {
	opacity:0.8;
}
.modal-content{
	background:rgba(10,12,16,.95);
	border:1px solid #2a303b;
	overflow-y: auto;
}
.modal-body {overflow-y: auto;}
.spinner-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background-color: var(--surface);
	position: absolute;
	inset: 0;
	transition: opacity 0.5s ease;
	z-index: 1;
}
.video-container {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.detail-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	gap: 0.5rem;
	margin-top: 1rem;
}
.detail-thumb {
	position: relative;
	width: 100%;
	padding-bottom: 100%;
	overflow: hidden;
}
.detail-thumb img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.thumb-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(0,0,0,0.2);
	color: #fff;
	font-size: 0.75rem;
	padding: 0.4rem 0.6rem;
	text-align: center;
}