@charset "utf-8";

/* Startup CSS */
body { height:100%; min-height:100%; font-size:14px; background:#FFF; color:#222; font-family:'Open Sans', Arial, Helvetica, sans-serif; overflow-x:hidden; }
pre { color:#CCC; }
.hide { display:none !important; }
p { margin-bottom:10px; }
img { max-width:100%; height:auto; }
.clear { clear:both; }

.font-Montserrat { font-family:'Montserrat', Arial, Helvetica, sans-serif; }
.fw-400 { font-weight:400 !important; }
.fw-700 { font-weight:700 !important; }
h1, h2, h3, h4, h5, h6 { font-family:'Montserrat', Arial, Helvetica, sans-serif; font-weight:700; }
input[type="submit"],
input[type="button"],
button, a.btn, .navbar { font-family:'Montserrat', Arial, Helvetica, sans-serif; }

a, .btn, input[type="submit"], input[type="button"], button, .item .item-thumb img, .item a.item-link .item-overlay { -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; }

.main-container { padding-left:0; padding-right:0; float:left; width:100%; }

/* native CSS masonry engine */
.grid { 
    display: block; 
    column-gap: 15px; 
    width: 100%; 
}
/* Responsive columns matching Bootstrap breakpoints */
.grid { column-count: 2; }
@media (min-width: 992px) { .grid { column-count: 3; } }
@media (min-width: 1200px) { .grid { column-count: 6; } }

.grid-item {
    display: inline-block;
    width: 100% !important;
    max-width: 100% !important; /* override bootstrap col-* max-width */
    flex: none !important;      /* override bootstrap col-* flex */
    break-inside: avoid;
    margin-bottom: 15px;
    padding: 0 !important;
}

/* Neutral placeholder so users see blocks instantly */
.grid-item .item-thumb {
    display: block;
    position: relative;
    overflow: hidden;
    background-color: #2c3237; /* sleek dark placeholder */
    aspect-ratio: 3 / 4; /* Standard thumbnail portrait ratio */
    contain: layout style;
}
.darkmode .grid-item .item-thumb { background-color: #1a1e22; }

/* Image expands instantly within the 3:4 thumbnail bounding box */
.grid-item .item-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.grid-item img { width:100%; height:auto; }
.grid-item video { width:100%; height:auto; }

/* Main Color: #eb008b PINK // #35adf2 BLUE // Secondary: #b1086c // #006faf BLUE */
.highlight { color:#35adf2 !important; }
a { color:#35adf2; }
a:hover { color:#006faf; }
.btn-primary, .btn-primary.disabled, .btn-primary:disabled { background:#35adf2; border:1px solid #35adf2; }
.btn-primary.disabled, .btn-primary:disabled, .form-control:disabled, .form-control[readonly] { cursor:not-allowed; }
.btn-primary:hover { background:#006faf; border:1px solid #006faf; }
.dropdown-item.active, .dropdown-item:active { background-color:#35adf2; }

.wrapper { width:1000px; position:relative; margin:0 auto; }

/* Bootstrap overrides */
.btn-outline-secondary { border-color:#ced4da; }
.navbar-dark .navbar-nav .nav-link { color:#FFF; }
#loginModal .input-group-text,
#forgotPasswordModal .input-group-text,
#signUpModal .input-group-text { display:inline-block; min-width:42px; text-align:center; }

/* Auth modals */
#loginModal .modal-footer,
#signUpModal .modal-footer,
#forgotPasswordModal .modal-footer { flex-wrap: wrap; gap: 8px; }
#loginModal .form-group,
#signUpModal .form-group,
#forgotPasswordModal .form-group { margin-bottom: 12px; }

/* Password strength indicator */
.password-strength .progress { border-radius: 2px; }
.password-strength .form-text { font-size: 11px; font-weight: 600; margin-top: 2px; }

/* Button loading spinner */
.btn .fa-spinner { vertical-align: middle; }

/* Generic Paddings */
.padding-zero { padding: 0; }
.padding-left-zero { padding-left:0; }
.padding-right-zero { padding-left:0; }
.padding-left-100 { padding-left:100px; }
.padding-left-75 { padding-left:75px; }
.padding-left-50 { padding-left:50px; }
.padding-right-100 { padding-right:100px; }
.padding-right-75 { padding-right:75px; }
.padding-right-50 { padding-right:50px; }
.padding-top-100 { padding-top:100px; }
.padding-top-75 { padding-top:75px; }
.padding-top-50 { padding-top:50px; }
.padding-top-25 { padding-top:25px; }
.padding-bottom-100 { padding-bottom:100px; }
.padding-bottom-75 { padding-bottom:75px; }
.padding-bottom-50 { padding-bottom:50px; }
.padding-bottom-25 { padding-bottom:25px; }

/* Bootstrap Overrides */
.tooltip { font-size:10px !important; }

/* Custom Styles */

@media (min-width: 1200px){
	.container-xl {	max-width:1600px; }
}
@media (min-width: 992px){
	.container-xl {	max-width:100%; }
}
@media (min-width: 768px){
	.container-xl { max-width: 100%; }
}
@media (max-width: 767px){
	.hidden-sm, .hidden-xs { display:none !important; }
}
.wrapper {
	display: table;
	width: 100%;
	height: 100%;
	table-layout: fixed;
	overflow: hidden;
	transition: opacity .6s;
}

.flex-wrap { display:flex; flex-wrap:nowrap; }

.logo {
	font-size: 28px;
	font-weight: 700;
	-ms-flex-positive: 0;
	    flex-grow: 0;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	    align-items: center;
}

.logo h1, .logo h2 { font-size:28px; margin:0; }
.logo img { max-width:250px; }

.logo a {
	display: block;
	color: #35adf2;
}

.logo span {
	color: #1d2022;
}

.search {
	-ms-flex-positive: 1;
	    flex-grow: 1;
	-ms-flex-negative: 1;
	    flex-shrink: 1;
	min-width: 1px;
	padding: 20px;
	max-width:600px;
}

.search .input-group .input-group-append .btn.dropdown-toggle { border-radius:0; border-right:0; }

.header-buttons {
	-ms-flex-positive: 1;
	    flex-grow: 0;
	-ms-flex-negative: 1;
	    flex-shrink: 1;
	min-width: 1px;
	padding: 20px;
	margin-left:auto;
}

.navbar-mobile-buttons { display:none; margin-bottom:15px; }
.mobile-buttons { display:none; padding:20px 5px; }
.mobile-buttons .search-toggler { display:none; }
.mobile-buttons button { min-height:38px; }
@media screen and (max-width: 992px) {
	.logo img { max-width:160px; }
	.header-buttons { display:none; }
	.mobile-buttons { display:inline-block; }
	header .flex-wrap { justify-content:space-between; position:relative; }
	.navbar .navbar-nav .nav-item { margin-left:15px !important; border-bottom:1px solid #555d65; }
	.navbar .navbar-nav .nav-item:last-child { margin-right:15px !important; border-bottom:0; }
}
@media screen and (max-width: 740px) {
	.search { display:none; min-width:100%; position:absolute; top:100%; left:0; border:1px solid #CCC; border-radius:5px; background:#f1f1f1; z-index:10; }
	.mobile-buttons { padding:10px 5px; }
	.mobile-buttons .search-toggler { display:inline-block; }
}
@media screen and (max-width: 479px) {
	.logo, .logo h1, .logo h2 { font-size:18px; }
	.logo img { max-width:160px; }
	.search { padding:4px; }
	.mobile-buttons .trigger_darkmode { display:none; }
	.mobile-buttons .trigger_login { display:none; }
	.navbar-mobile-buttons { display:inline-block; width:100%; text-align:center; }
}

.navbar { padding:0; margin-bottom:15px; }
.navbar .navbar-nav { font-size:1.1em; }
.navbar .navbar-nav .nav-item { position:relative; margin-right:15px; }
.navbar .navbar-nav .nav-item:last-child { margin-right:0; }
.navbar .navbar-nav .nav-item .nav-link { position:relative; padding:1em .5rem; }
.navbar .navbar-nav .nav-item.active>.nav-link,
.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .nav-link.show,
.navbar .navbar-nav .show>.nav-link {
	color:#FFF; position:relative;
}
.navbar .navbar-nav .active, .navbar .navbar-nav .nav-item.active .nav-link { position:relative; }
.navbar .navbar-nav .nav-item.active .nav-link::before,
.navbar .navbar-nav .nav-item:focus .nav-link::before, .navbar .navbar-nav .nav-item:hover .nav-link::before {
	content:'';
	position:absolute; bottom:0; left:0; width:100%; height:4px; background-color:#35adf2; border-radius:4px;
}
.navbar .navbar-nav .nav-item.outgoing-link .nav-link::after {
	content:"\f105";
	font:normal normal normal 14px/1 FontAwesome;
	position:absolute; top:8px; right:0;
	transform: rotate(-45deg);
}
.dropdown-toggle::after {
	border:0;
	vertical-align:0;
	content:"\f105";
	font:normal normal normal 14px/1 FontAwesome;
	transform: rotate(90deg);
}




section.title h1, section.title h2, section.title h3, section.title h4 { display:inline-block; font-size:18px; vertical-align:middle; }
section.title h1 span, section.title h2 span, section.title h3 span, section.title h4 span { color:#35adf2; }

ul.title-additional-tags { display:inline-block; width:100%; list-style:none; margin:0; padding:0; margin-bottom:15px; }
ul.title-additional-tags li { display:inline-block; margin-bottom:4px; }
ul.title-additional-tags li .btn { font-size:1em; }
ul.title-additional-tags li .dropdown-menu.max-height { max-height:200px; overflow-y:auto; }

.filter-options { display:inline-block; width:auto; margin-left:15px; vertical-align:middle; margin-bottom:15px; font-size:0; }
.filter-options a.btn { font-size:14px; }

/* Item Hover */
.item { position:relative; border-radius:5px; }
.item a.item-link { display:inline-block; position:relative; border-radius:5px; border:1px solid #ced4da; overflow:hidden; }
.item a.item-link .item-thumb { display:inline-block; width:100%; vertical-align:top; overflow:hidden; }
.item a.item-link .item-thumb img { display:inline-block; max-width:100%; width:100%; border-radius:5px; }
.item a.item-link .item-overlay { display:inline-block; position:absolute; padding:5px; background:rgba(0,0,0,0.3); color:#FFF; text-shadow:#000 1px 1px 1px; font-size:12px; top:0; left:0; }
.item a.item-link .item-overlay.top-left { top:0; left:0; right:auto; bottom:auto; border-radius:5px 0 5px 0;  font-size:1.1em; }
.item a.item-link .item-overlay.top-right { top:0; left:auto; right:0; bottom:auto; border-radius:0 5px 0 5px; }
.item a.item-link .item-overlay.bottom-left { top:auto; left:0; right:auto; bottom:0; border-radius:0 5px 0 5px; }
.item a.item-link .item-overlay.bottom-right { top:auto; left:auto; right:0; bottom:0; border-radius:5px 0 5px 0; }
.item a.item-link .item-overlay .flag-icon { display:inline-block; margin-left:5px; }
.item:hover a.item-link .item-thumb img { -webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05); }
.item:hover a.item-link .item-overlay { opacity:0.5; }
@media screen and (max-width: 479px) {
	.item a.item-link .item-overlay.top-left { font-size:12px; }
}

.scroll_up {
	position: fixed;
	bottom: 40px;
	right: 40px;
	z-index: 999;
	width: 30px;
	height: 30px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.06);
	background-color: #35adf2;
	border-radius: 30px;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: background .3s, opacity .3s, visibility .3s;
}

.scroll_up.show { opacity:1; visibility:visible; }

.scroll_up i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate3d(-50%, -50%, 0);
	color: #fff;
	font-size: 16px;
	color: #fff;
}

@media screen and (min-width: 1025px) {
	.scroll_up:hover { background-color:#1d2022; }
}
@media screen and (max-width: 1000px) {
	.scroll_up { right:20px; bottom:40px; }
}
@media screen and (max-width: 767px) {
	.scroll_up { width:40px; height:40px; }
}
@media screen and (max-width: 1000px) {
	.scroll_up i { font-size:16px; }
}

.gallery-grid .grid-item a, .gallery-grid .grid-item a img { width:100%; max-width:100%; }

.gallery-info .gallery-info-sponsored { border:1px solid #ececec; background:#f1f1f1; padding:10px; text-align:center; }
.gallery-info .gallery-info-sponsored em { display:inline-block; width:100%; margin-bottom:10px; }
.gallery-info .gallery-info-sponsored a { display:inline-block; width:100%; }
.gallery-info .gallery-info-sponsored a img { display:inline-block; max-width:100%; margin-bottom:10px; }
.gallery-info .gallery-info-sponsored a span { display:inline-block; width:100%; text-align:center; font-weight:700; font-size:12px; }

.gallery-info .gallery-info-details { display:table; }
.gallery-info .gallery-info-details .gallery-item-row { display:table-row; }
.gallery-info .gallery-info-details .gallery-item-row .gallery-item-label { display:table-cell; width:100px; padding:8px 0; }


.gallery-info .gallery-info-buttons .share_options { display:none; margin:15px 0; }
.gallery-info .gallery-info-buttons .share_options .a2a_default_style a { float:none !important; display:inline-block !important; }

@media screen and (max-width: 479px) {
	.gallery-info .gallery-info-details { display:inline-block; }
	.gallery-info .gallery-info-details .gallery-item-row { display:inline-block; width:100%; margin-bottom:10px; }
	.gallery-info .gallery-info-details .gallery-item-row .gallery-item-label { display:inline-block; width:100%; padding:2px 0; font-weight:700; }
	.gallery-info .gallery-info-details .gallery-item-row .gallery-item-data .btn { margin-bottom:4px; }
	.gallery-info .gallery-info-buttons .btn { margin-bottom:4px; }
}

.video-item { margin-bottom:15px; }
.ntv-ads { text-align:center; }
.ntv-ads .upsale-link { display:inline-block; margin-bottom:20px; }

#footer { display:inline-block; width:100%; text-align:center; position:relative; border-top:1px solid #e9e9e9; padding:25px 0; background-color:#ececec; }
#footer .footer-links { text-align:left; }
#footer .footer-title { display:inline-block; width:100%; font-weight:700; margin-bottom:10px; }
#footer .footer-links ul { display:inline-block; width:100%; margin:0; padding:0; list-style:none; }
#footer .footer-links ul li { display:inline-block; width:100%; margin-bottom:5px; }
#footer .footer-links ul.columns-4 { column-count:4; }
#footer .footer-links ul.columns-3 { column-count:3; }
#footer .footer-links ul.columns-2 { column-count:2; }
#footer .footer-bottom { display:inline-block; width:100%; margin-top:10px; padding-top:10px; border-top:1px solid #CCC; }

@media (max-width: 767px){
	#footer .footer-links ul.columns-4, #footer .footer-links ul.columns-3 { column-count:2; }
}

.comments { display:inline-block; width:100%; padding-top:15px; margin-top:15px; border-top:1px solid #dadada; }
.comments .comments-list { display:inline-block; width:100%; /*padding:15px; border:1px solid #444; background:#111;*/ margin-bottom:15px; }
.comments .comments-list ul { display:inline-block; width:100%; list-style:none; padding:0; margin:0; }
.comments .comments-list ul > li > ul { padding-left:30px; margin-top:10px; }
.comments .comments-list ul li { display:inline-block; width:100%; margin-bottom:10px; }
.comments .comments-list ul li:last-child { border-bottom:0; margin-bottom:0; padding-bottom:0; }
.comments .comments-list ul li .comment-row { float:left; width:100%; }
.comments .comments-list ul li .comment-rating { float:left; min-width:60px; margin-right:10px; text-align:center; line-height:100%; border:1px solid #dadada; padding:10px 5px; background:#FFF; }
.comments .comments-list ul li .comment-rating a { display:inline-block; font-size:12px; padding:5px; border:1px solid #dadada; }
.comments .comments-list ul li .comment-rating a:hover { border:1px solid #444; }
.comments .comments-list ul li .comment-rating a.comment-vote-up { color:#58d212; }
.comments .comments-list ul li .comment-rating a.comment-vote-down { color:#575757; }
.comments .comments-list ul li .comment-rating .comment-rating-value { display:block; font-size:12px; margin:5px 0; font-weight:300; }

.comments .comments-list ul li .comment-body .comment-meta { display:block; width:100%; font-size:12px; color:#868686; margin-bottom:5px; padding:5px 0; border-bottom:1px solid #dadada; }
.comments .comments-list ul li .comment-body .comment-text { font-size:14px; }

.comments .comments-form { display:inline-block; width:100%; margin-bottom:15px; }

.text-center { text-align:center; }

ul.custom { display:inline-block; width:100%; margin:0; padding:0; list-style:none; }
ul.custom li { display:inline-block; width:100%; padding:5px; border:1px solid #e0e0e0; background:#f5f5f5; margin-bottom:2px; border-radius:10px; }
ul.custom li i.fa { display:inline-block; margin-right:5px; min-width:30px; text-align:center; }
@media (min-width: 768px) {
	ul.custom li i.fa { min-width:0; }
}
ul.custom li:last-child { margin-bottom:0; }


#loginModal .input-group-text,
#forgotPasswordModal .input-group-text { min-width:42px; }

.pagination{ display:inline-block; width:100%; padding:25px 0; text-align:center; }
.pagination li{ display:inline-block; font-size:18px; text-align:center; margin:0 1px; }

.pagination li a:not([href]):not([tabindex]) { color:#222; background:none; }


body.darkmode { background:#252a2f; color:#FFF; }
body.darkmode .logo span { color:#FFF; }
body.darkmode .btn-outline-secondary { color:#bbb; border-color:#454d54; }
body.darkmode .item a.item-link { border-color:#343a40; }
body.darkmode #footer { background-color:#343a40; border-color:#525961; }
body.darkmode #footer .footer-bottom { border-color:#525961; }
body.darkmode .modal { color:#111; }
body.darkmode .category-list > a.dropdown-item {
	color: #ffffff;
}
body.darkmode .category-list > a.dropdown-item:hover {
	color: #000000;
}

body.darkmode .category-list > a.dropdown-item:active {
	color: #000000;
}


.category-list {
	width:20%;
	float:left;
	padding:2px;
	font-weight: bold;
}

@media (max-width: 992px){
	.category-list {
		width:50%;
	}
}

@media(max-width: 320px) {
	.category-list {
		width:100%;
	}
}

/* ── Legal pages (Terms, Privacy, Cookies) ───────────────────────────────── */
.legal-page { font-size: .95rem; line-height: 1.8; color: #333; }
.legal-page h2 { font-size: 1.25rem; font-weight: 700; margin: 2rem 0 .6rem; padding-bottom: .4rem; border-bottom: 2px solid #e9ecef; }
.legal-page h3 { font-size: 1.05rem; font-weight: 700; margin: 1.4rem 0 .4rem; }
.legal-page p { margin-bottom: 1rem; }
.legal-page ul { margin-bottom: 1rem; padding-left: 1.4rem; }
.legal-page ul li { margin-bottom: .35rem; }
.legal-page a { color: #35adf2; }
.legal-page a:hover { color: #006faf; }
.legal-page table { font-size: .875rem; }
.legal-page code { background: #f4f4f4; padding: 2px 5px; border-radius: 3px; font-size: .85rem; }

body.darkmode .legal-page { color: #ccc; }
body.darkmode .legal-page h2 { border-color: #454d54; }
body.darkmode .legal-page code { background: #2e3338; color: #e0e0e0; }
body.darkmode .legal-page table { color: #ccc; }
body.darkmode .legal-page .table-bordered td,
body.darkmode .legal-page .table-bordered th { border-color: #454d54; }
body.darkmode .legal-page .thead-light th { background: #2e3338; color: #ccc; border-color: #454d54; }

/* ── Creators ────────────────────────────────────────────────────────────── */
.creators-total-count {
    display: block;
    clear: both;
    margin: .4rem 0 0;
    font-size: .95rem;
    color: #6c757d;
    font-weight: 400;
}
.creators-total-count .fa { margin-right: 5px; color: #35adf2; }
.creators-total-count strong { color: #35adf2; font-size: 1rem; }
body.darkmode .creators-total-count { color: #adb5bd; }
/* Make all cards in a row the same height */
.creators-grid .row { display: flex; flex-wrap: wrap; }
.creators-grid .col-12.col-md-6 { display: flex; }

.creator-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1rem;
    transition: box-shadow 200ms ease;
}
.creator-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.creator-card .row { flex: 1; margin: 0; }

.creator-image { position: relative; overflow: hidden; border-radius: 0.4rem; }
.creator-image img { display: block; width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; transition: opacity 150ms ease; }

/* Missing-avatar placeholder */
.creator-image::after {
    content: '\f007\a  No Image';
    font-family: FontAwesome, sans-serif;
    white-space: pre;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255,255,255,.85);
    background: linear-gradient(135deg, #2c3e50 0%, #4a5568 50%, #2d3748 100%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms ease;
}
.creator-image.img-error img    { opacity: 0; }
.creator-image.img-error::after { opacity: 1; }

/* Info column stretches and spaces content top-to-bottom */
.creator-info {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.creator-info .creator-footer { margin-top: auto !important; }

.creator-name { font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; }
.creator-name a { color: inherit; }
.creator-username { font-size: 0.9rem; color: #6c757d; margin-bottom: 6px; }
.creator-tags .btn { margin: 0 4px 4px 0; }
.creator-bio { font-size: 0.875rem; line-height: 1.5; color: #495057; }
/* Show a placeholder line when bio is empty so the card doesn't collapse */
.creator-bio:empty::after {
    content: '\00a0';
    display: block;
    min-height: 1.5em;
}
.creator-price { font-size: 0.875rem; font-weight: 600; }

/* Creator profile page */
.creator-profile {
    background: #f8f9fa;
    padding: 2rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
}
.creator-profile-image img {
    width: 100%;
    max-width: 300px;
    border-radius: 0.5rem;
    aspect-ratio: 1/1;
    object-fit: cover;
}
.creator-profile .creator-name { font-size: 2rem; }
.creator-profile .creator-username { font-size: 1.1rem; }
.creator-bio { font-size: 1rem; line-height: 1.6; }

.stat-box {
    text-align: center;
    padding: 1rem;
    background: #fff;
    border-radius: 0.5rem;
    box-shadow: 0 2px 4px rgba(0,0,0,.1);
    margin-bottom: 1rem;
}
.stat-box i { font-size: 1.5rem; color: #35adf2; display: block; margin-bottom: 0.4rem; }
.stat-value { display: block; font-size: 1.2rem; font-weight: 700; }
.stat-label { display: block; font-size: 0.85rem; color: #6c757d; }

/* Creator media grid */
.media-item {
    background: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,.1);
    transition: transform 200ms ease;
    height: 100%;
}
.media-item:hover { transform: translateY(-4px); }
.media-thumb {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4/3;
    background: #f0f0f0;
}
.media-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 150ms ease;
}

/* Gradient "missing" placeholder shown when the image fails to load */
.media-thumb::after {
    content: '\f127\a  Missing';
    font-family: FontAwesome, sans-serif;
    white-space: pre;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: rgba(255,255,255,.85);
    background: linear-gradient(135deg, #2c3e50 0%, #4a5568 50%, #2d3748 100%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms ease;
}

/* Activated when JS adds .img-error to the thumb wrapper */
.media-thumb.img-error img   { opacity: 0; }
.media-thumb.img-error::after { opacity: 1; }

.media-info { padding: 0.75rem; }
.media-title { font-size: 0.9rem; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.media-date { font-size: 0.75rem; color: #6c757d; }

/* Related creator cards */
.related-creator-card { text-align: center; }
.related-creator-image img { width: 100%; border-radius: 50%; aspect-ratio: 1/1; object-fit: cover; }
.related-creator-name { font-size: 0.85rem; margin: 6px 0 2px; }
.related-creator-username { font-size: 0.75rem; color: #6c757d; }

body.darkmode .creator-card { background: #2e3338; border-color: #454d54; }
body.darkmode .creator-profile { background: #2e3338; }
body.darkmode .stat-box,
body.darkmode .media-item { background: #343a40; }
body.darkmode .media-thumb,
body.darkmode .creator-image { background: #2a2a2a; }