/*
 * Valentine Network Core — front-end component + layout styles.
 * Moved from the DB 'Additional CSS' (Site Editor) so CSS lives in a file, not the database.
 * These style the .vn-* classes emitted by vn-core's post_content + bonus output.
 */

/* Hide junk navigation placeholders */
.wp-block-navigation a[href="#"] {
  display: none !important;
}

/* Homepage "New Videos" heading */
.home main h1.wp-block-heading {
  font-size: 2.4rem;
  line-height: 1.3;
  color: #ffffff;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Video Grid */
.wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 24px !important;
}
.single .wp-block-post-template {
  display: block !important;
}
@media (max-width: 1024px) {
  .wp-block-post-template {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 600px) {
  .wp-block-post-template {
    grid-template-columns: 1fr !important;
  }
}

/* Video placeholder styling */
.video-placeholder,
div[style*="border:2px dashed #e63946"] {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.video-placeholder:hover,
div[style*="border:2px dashed #e63946"]:hover {
  border-color: #f4a261 !important;
  box-shadow: 0 0 30px rgba(244, 162, 97, 0.12);
}


/* Hide author + date on front end */
.wp-block-post-author, .wp-block-post-date, .wp-block-post-author-name__link, time { display: none !important; }
main a[href*="/author/"] { display: none !important; }

/* Hide byline/meta block on single video pages */
.single-vn_video .wp-block-group.has-small-font-size.is-layout-flex { display: none !important; }
.single-post .wp-block-group.has-small-font-size.is-layout-flex { display: none !important; }
.single-vn_actress .wp-block-group.has-small-font-size.is-layout-flex { display: none !important; }
/* Hide empty "More posts" query block on the actress profile page */
.single-vn_actress .wp-block-query { display: none !important; }
.single-vn_actress .wp-block-heading:has(+ .wp-block-query) { display: none !important; }
/* Hide empty "More posts" heading + query block on single video pages */
.single-vn_video .wp-block-query { display: none !important; }
.single-vn_video .wp-block-heading:has(+ .wp-block-query) { display: none !important; }


/* Purchase button on video pages */
.vn-purchase-cta { margin:2rem 0; padding:1.5rem; background:#14141f; border:1px solid #1e1e2e; border-radius:10px; text-align:center; }
.vn-buy-button { display:inline-block; background:#f4a261; color:#0a0a0f; padding:14px 40px; border-radius:8px; font-weight:700; font-size:1.1rem; text-decoration:none; transition:background 0.2s; }
.vn-buy-button:hover { background:#e68930; }
.vn-purchase-links { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.vn-buy-note { color:#8888a0; font-size:0.8rem; margin-top:8px; }


/* ── Bonus content sections ── */
.vn-bonus-section { margin:2.5rem 0; padding:1.5rem; background:#14141f; border:1px solid #1e1e2e; border-radius:10px; }
.vn-bonus-section h3 { color:#f4a261; font-size:1.2rem; margin-bottom:1rem; padding-bottom:0.5rem; border-bottom:1px solid #1e1e2e; }
.vn-bonus-photo-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:12px; }
.vn-bonus-photo-item img { width:100%; aspect-ratio: 4/3; object-fit:cover; border-radius:6px; transition:transform 0.2s, box-shadow 0.2s; }
.vn-bonus-photo-item img:hover { transform:scale(1.03); box-shadow:0 4px 16px rgba(244,162,97,0.15); }
.vn-bonus-video-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:16px; }
.vn-bonus-video-item video { width:100%; border-radius:6px; background:#000; }
.vn-bonus-rotate-note { margin:0 0 1.1rem; padding:0.75rem 1rem; background:#2a2414; border:1px solid #6b5320; border-left:3px solid #f4a261; border-radius:8px; color:#e9d8b0; font-size:0.95rem; }
.vn-bonus-label { display:block; color:#8888a0; font-size:0.75rem; margin-top:4px; word-break:break-all; }


/* ── Single video page: layout ── */
.single-vn_video .wp-block-post-featured-image { display: none !important; height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; clip: rect(0,0,0,0) !important; }
.single-vn_video .entry-content p:first-of-type { order: 2; }
.single-vn_video .vn-purchase-cta { order: 4; }
.single-vn_video .vn-bonus-section { margin-top: 2rem; }

/* Hide excerpt on single (use content description instead) */
.single-vn_video .wp-block-post-excerpt { display: none !important; }

/* Category links styling on single page */
.single-vn_video .taxonomy-category, .single-vn_video .wp-block-post-terms { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0.5rem 0 1rem 0 !important; }
.single-vn_video .taxonomy-category a, .single-vn_video .wp-block-post-terms a { color: #f4a261 !important; background: rgba(244,162,97,0.1) !important; padding: 4px 10px !important; border-radius: 4px !important; font-size: 0.78rem !important; text-decoration: none !important; }
.single-vn_video .taxonomy-category a:hover, .single-vn_video .wp-block-post-terms a:hover { background: rgba(244,162,97,0.25) !important; }


/* Hide template byline and built-in post-terms on single video pages */
.single-vn_video .wp-block-post-author, .single-vn_video .wp-block-post-author-name, .single-vn_video .wp-block-post-date, .single-vn_video .wp-block-post-author__name, .single-vn_video .wp-block-post-author__avatar { display: none !important; }
.single-vn_video .taxonomy-category.wp-block-post-terms, .single-vn_video .wp-block-post-terms.has-text-color { display: none !important; }

/* Our injected category pills */
.vn-cat-pills { display:flex; flex-wrap:wrap; gap:6px; margin:0.5rem 0 1.25rem 0; }
.vn-cat-pill { color: #f4a261 !important; background: rgba(244,162,97,0.1) !important; padding: 5px 12px !important; border-radius: 5px !important; font-size: 0.8rem !important; text-decoration: none !important; transition: background 0.15s; display:inline-block !important; }
.vn-cat-pill:hover { background: rgba(244,162,97,0.3) !important; color: #ffd0a0 !important; }

/* Hide "Written by" paragraph on single pages */
.single-vn_video p:has(.screen-reader-text), .single-post p:has(.screen-reader-text) { display: none !important; }


/* KILL poster IMG on single video pages */
.single-vn_video .wp-block-post-featured-image img { display: none !important; height: 0 !important; width: 0 !important; opacity: 0 !important; visibility: hidden !important; position: absolute !important; }
.single-vn_video .wp-block-post-featured-image figure { display: none !important; }
.single-vn_video figure.wp-block-post-featured-image { display: none !important; }


/* MORE link on truncated descriptions */
.vn-more-link { color: #f4a261 !important; font-weight: 600; text-decoration: none; font-size: 0.85rem; margin-left: 4px; }
.vn-more-link:hover { color: #e68930 !important; text-decoration: underline; }


/* POSTER FINAL KILL */
.single-vn_video .wp-block-post-featured-image, .single-vn_video .wp-block-post-featured-image * { display: none !important; visibility: hidden !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; width: 0 !important; min-width: 0 !important; max-width: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border: none !important; opacity: 0 !important; position: absolute !important; pointer-events: none !important; }
.single-vn_video figure.wp-block-post-featured-image, .single-vn_video figure.wp-block-post-featured-image img, .single-vn_video .attachment-post-thumbnail { display: none !important; visibility: hidden !important; height: 0 !important; width: 0 !important; }


/* Hide full description from front-end visitors (admin sees it in Gutenberg) */
.vn-admin-full-desc { display: none !important; }

/* Hide theme credit ("Twenty Twenty-Five") + "Designed with WordPress" from the footer.
   Lives here (plugin), NOT in the parent theme, so it survives WordPress core/theme updates. */
footer p.has-small-font-size {
	display: none !important;
}

/* Align grid cards: reset the per-item "flow" margin the theme adds to non-first
   post-template items, so every card sits on the same top line (gap handles spacing). */
.wp-block-post-template > .wp-block-post {
	margin: 0 !important;
}


/* Photo gallery (screen captures) on the product page */
.vn-gallery-section { margin: 2rem 0; }
.vn-gallery-section h3 { color: #f4a261; font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px solid #1e1e2e; }
.vn-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.vn-gallery-item img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 6px; transition: transform 0.2s, box-shadow 0.2s; }
.vn-gallery-item img:hover { transform: scale(1.03); box-shadow: 0 4px 16px rgba(244,162,97,0.15); }

/* Header search — compact, inline between site title and the nav menu */
.vn-header-search { width: 340px; max-width: 340px; flex: 0 0 auto; }
.vn-header-search .wp-block-search__inside-wrapper { border-radius: 6px; }
.vn-header-search .wp-block-search__input {
  height: 32px;
  min-height: 32px;
  padding: 4px 14px;
  font-size: 0.9rem;
  line-height: 1.2;
}
.vn-header-search .wp-block-search__button {
  height: 32px;
  min-height: 32px;
  padding: 0 12px;
  font-size: 0.8rem;
  line-height: 1;
}
@media (max-width: 782px) {
  .vn-header-search { width: 220px; max-width: 220px; }
}

/* ── Actress profile + preview row (single video page) ── */
.vn-preview-row { display: flex; gap: 22px; align-items: stretch; margin-bottom: 1.5rem; }
.vn-preview-main { flex: 2 1 0; min-width: 0; }
.vn-preview-media { width: 100%; display: block; }

/* Full video streamed from an X/Twitter URL */
.vn-twitter-video { margin-bottom: 1.5rem; }
.vn-full-label { font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: #8b8b96; margin-bottom: 6px; }
.vn-full-video { width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #000; border-radius: 8px; display: block; }
.vn-twitter-fallback { margin-top: 8px; }

/* Homepage featured "free movie" spotlight */
.vn-featured { margin-bottom: 2.5rem; padding: 1.25rem 1.4rem; background: #14141f; border: 1px solid #1e1e2e; border-radius: 12px; }
.vn-featured-announce { margin-bottom: 1.1rem; }
.vn-featured-announce h2, .vn-featured-announce p { margin: 0 0 0.5rem; }
.vn-featured-announce h2 { font-size: 1.35rem; color: #f4a261; }
.vn-featured-announce p { color: #e4e4ec; max-width: 72ch; }
.vn-featured-video .vn-full-video { border: 1px solid #1e1e2e; }
.vn-featured-now { margin-bottom: 6px; font-size: 0.95rem; }
.vn-featured-now a { color: #f4a261; text-decoration: none; }
.vn-featured-now a:hover { text-decoration: underline; }
.vn-featured-link { margin-top: 8px; }
.vn-featured-link a { color: #f4a261; text-decoration: none; font-weight: 600; }
.vn-featured-link a:hover { text-decoration: underline; }

.vn-actress-panel { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; background: #14141f; border: 1px solid #1e1e2e; border-radius: 10px; padding: 1rem; }
.vn-actress-name { font-size: 1.15rem; font-weight: 700; margin-bottom: 0.65rem; }
.vn-actress-name a { color: #f4a261; text-decoration: none; }
.vn-actress-name a:hover { text-decoration: underline; }
.vn-actress-photo { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; margin-bottom: 0; display: block; }
.vn-actress-photo-wrap { flex: 1 1 0; min-height: 0; margin-bottom: 1rem; }

/* Collapsible "All My Links" toggle (checkbox + label). Collapsed by default on wide screens;
   always expanded on mobile (<=780px) so mobile is unaffected. */
.vn-links-toggle { display: none; }   /* hidden checkbox — label `for` still toggles it */
.vn-all-links-btn {
  display: block;
  text-align: center;
  padding: 10px 12px;
  margin-bottom: 1rem;
  background: #1e1e2e;
  color: #f4a261;
  border: 1px solid #2a2a3a;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.vn-all-links-btn:hover { background: #26262f; border-color: #f4a261; }
.vn-links-inner { display: none; }
.vn-links-toggle:checked ~ .vn-links-inner { display: block; }
.vn-all-links-btn::after { content: " ▾"; opacity: 0.7; }
.vn-links-toggle:checked ~ .vn-all-links-btn::after { content: " ▴"; }

@media (max-width: 780px) {
  .vn-all-links-btn { display: none; }        /* hide the button — links show full-time on mobile */
  .vn-links-inner { display: block !important; }
}

.vn-actress-section { margin-bottom: 1.1rem; }
.vn-section-label { font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: #8b8b96; margin-bottom: 4px; }
.vn-section-line { border: 0; border-top: 1px solid #2a2a3a; margin: 4px 0 10px 0; }
.vn-actress-btn { display: block; text-align: center; padding: 9px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: 600; text-decoration: none; margin-bottom: 8px; transition: filter 0.15s, transform 0.1s; }
.vn-actress-btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
.vn-actress-btn--gold { background: #f5c518; color: #241c05; }
.vn-actress-btn--pink { background: #ec4899; color: #ffffff; }
.vn-actress-btn--blue { background: #3b82f6; color: #ffffff; }
.vn-actress-btn--green { background: #22c55e; color: #07210e; }

.vn-also-starring { margin: 0 0 1.5rem 0; font-size: 0.9rem; color: #c8c8d4; }
.vn-also-label { color: #8b8b96; }
.vn-star-link { color: #f4a261; text-decoration: none; }
.vn-star-link:hover { text-decoration: underline; }

@media (max-width: 782px) {
  .vn-preview-row { flex-direction: column; }
  .vn-preview-main, .vn-actress-panel { flex: 1 1 100%; width: 100%; }
  .vn-actress-photo-wrap { flex: 0 0 auto; }
  .vn-actress-photo { height: auto; }
}

/* ── Actresses listing ([vn_actresses] shortcode) ── */
.vn-actresses-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; align-items: start; }
.vn-actresses-main { min-width: 0; }
.vn-actresses-empty { color: #8b8b96; }
.vn-actresses-sidebar { background: #14141f; border: 1px solid #1e1e2e; border-radius: 10px; padding: 1rem; }
.vn-actresses-sidebar-title { color: #f4a261; font-size: 1.05rem; margin: 0 0 0.75rem 0; }
.vn-actresses-list { list-style: none; margin: 0; padding: 0; }
.vn-actresses-list li { margin-bottom: 6px; }
.vn-actresses-list a { color: #e4e4ec; text-decoration: none; }
.vn-actresses-list a:hover { color: #f4a261; text-decoration: underline; }
@media (max-width: 782px) { .vn-actresses-layout { grid-template-columns: 1fr; } }

.vn-actresses-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
.vn-actress-card { background: #14141f; border: 1px solid #1e1e2e; border-radius: 10px; overflow: hidden; }
.vn-actress-card-link { display: block; text-decoration: none; color: inherit; }
.vn-actress-card-photo { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.vn-actress-card-name { display: block; padding: 10px 12px; font-weight: 600; color: #f4a261; text-align: center; }
.vn-actress-card-link:hover .vn-actress-card-name { text-decoration: underline; }

/* ── "Tip Me Directly" button (next to Starring name on video pages) ── */
.vn-tip-btn {
  display: inline-block;
  margin-left: 6px;
  padding: 3px 10px;
  background: linear-gradient(180deg, #f5c518, #e0b000);
  color: #241c05;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  white-space: nowrap;
  transition: filter 0.15s, transform 0.1s;
}
.vn-tip-btn:hover { filter: brightness(1.08); transform: translateY(-1px); color: #241c05; }

/* ── Full actress profile page ── */
.vn-actress-profile-page { max-width: 560px; margin: 1.5rem 0; }
.vn-actress-profile-photo { width: 100%; max-width: 340px; border-radius: 10px; margin-bottom: 1.25rem; display: block; }

/* ── Admin: Video Health report ── */
.vn-health-table td, .vn-health-table th { text-align: center; vertical-align: middle; }
.vn-health-table td:first-child, .vn-health-table th:first-child { text-align: left; }
.vn-health-ok   { color: #2ea043; font-weight: 700; font-size: 1.05rem; }
.vn-health-miss { color: #e63946; font-weight: 700; font-size: 1.05rem; }
.vn-health-badge {
	display: inline-block; background: #e63946; color: #fff; border-radius: 10px;
	font-size: 0.72rem; font-weight: 700; padding: 0 7px; margin-left: 6px; line-height: 1.5; vertical-align: 1px;
}

/* ── Mobile nav overlay → dark background (fix white panel with light-grey text on iOS) ──
   The header nav block uses the light "base" overlay color; the dark theme turns the links
   light, so the two conflict and the panel comes up white-on-light. Force it dark. */
.wp-block-navigation__responsive-container {
	background-color: #0a0a0f !important;
	color: #e4e4ec !important;
}
.wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container .wp-block-navigation__submenu-container {
	color: #e4e4ec !important;
}
.wp-block-navigation__responsive-container .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container a {
	color: #e4e4ec !important;
}
.wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-close {
	color: #e4e4ec !important;
}

/* ── Categories index ([vn_categories] shortcode) ── */
.vn-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 2rem 0; }
.vn-cat-card {
	display: block; background: #14141f; border: 1px solid #1e1e2e; border-radius: 8px;
	padding: 1rem; text-decoration: none; color: #e4e4ec; transition: border-color 0.15s;
}
.vn-cat-card:hover { border-color: #e63946; }
.vn-cat-name { display: block; font-size: 0.95rem; font-weight: 500; }
.vn-cat-count { display: block; color: #8888a0; font-size: 0.75rem; margin-top: 4px; }
@media (max-width: 782px) { .vn-cat-grid { grid-template-columns: repeat(2, 1fr); } }

/* ── Actress-scoped search bar (star- category pages) ── */
.vn-actress-search {
	margin: 1.25rem 0 2rem;
	padding: 1.25rem 1.5rem;
	background: #14141f;
	border: 1px solid #1e1e2e;
	border-radius: 10px;
}
.vn-actress-search-label {
	display: block;
	margin: 0 0 0.65rem;
	font-size: 1.05rem;
	font-weight: 600;
	color: #f4a261;
}
.vn-actress-search-row { display: flex; gap: 0.5rem; }
.vn-actress-search-input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.6rem 0.9rem;
	border: 1px solid #1e1e2e;
	border-radius: 6px;
	background: #0a0a0f;
	color: #e4e4ec;
	font-size: 1rem;
}
.vn-actress-search-input::placeholder { color: #6b6b7b; }
.vn-actress-search-input:focus { outline: none; border-color: #e63946; }
.vn-actress-search-submit {
	flex: 0 0 auto;
	padding: 0.6rem 1.4rem;
	border: none;
	border-radius: 6px;
	background: #e63946;
	color: #ffffff;
	font-weight: 600;
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.15s;
}
.vn-actress-search-submit:hover { background: #c62835; }
@media (max-width: 480px) {
	.vn-actress-search-row { flex-direction: column; }
	.vn-actress-search-submit { width: 100%; }
}

/* Actress profile summary on a star-category archive (above the video results) */
.vn-star-summary {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 1rem 0 1.5rem;
	padding: 1rem 1.25rem;
	background: #14141f;
	border: 1px solid #1e1e2e;
	border-radius: 10px;
}
.vn-star-summary-photo img {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: 50%;
	display: block;
	border: 2px solid #e63946;
}
.vn-star-summary-name {
	font-size: 1.25rem;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 0.35rem;
}
.vn-star-summary-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.vn-star-summary-link {
	color: #f4a261;
	text-decoration: none;
	font-weight: 600;
}
.vn-star-summary-link:hover { text-decoration: underline; }

/* ── Homepage grid: hide the video description (keep it on the single video page) ── */
.home .vn-description { display: none !important; }

/* ── Download-protected video player (full video + secret bonus videos) ── */
.vn-protect-wrap { position: relative; }
.vn-protected-video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #000; }
.vn-protect-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	background: rgba(0, 0, 0, 0.35);
	border-radius: 8px;
}
.vn-protect-play {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: rgba(230, 57, 70, 0.9);
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 26px;
	padding-left: 6px; /* optical centering of the ▶ glyph */
	transition: background 0.15s, transform 0.15s;
}
.vn-protect-overlay:hover .vn-protect-play { background: #e63946; transform: scale(1.06); }
.vn-protect-loading .vn-protect-play { background: #5a5a66; }

/* ── Actress social timeline wall ── */
.vn-timeline { max-width: 560px; margin: 2rem 0; }
.vn-timeline-title { font-size: 1.15rem; font-weight: 600; color: #e4e4ec; margin: 0 0 1rem; padding-bottom: 0.5rem; border-bottom: 1px solid #1e1e2e; }
.vn-tl-entry {
	background: #14141f;
	border: 1px solid #1e1e2e;
	border-radius: 10px;
	padding: 1rem 1.1rem;
	margin-bottom: 1rem;
}
.vn-tl-entry.vn-tl-pinned { border-color: #f4a261; }
.vn-tl-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.vn-tl-name { font-weight: 700; color: #e4e4ec; font-size: 0.9rem; }
.vn-tl-pin-badge {
	font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
	background: #f4a261; color: #241504; border-radius: 4px; padding: 1px 6px;
}
.vn-tl-date { margin-left: auto; color: #8b8b96; font-size: 0.75rem; }
.vn-tl-caption { color: #e4e4ec; font-size: 0.92rem; line-height: 1.55; margin-bottom: 0.75rem; }
.vn-tl-media { margin-bottom: 0.75rem; border-radius: 8px; overflow: hidden; }
.vn-tl-imgwrap { position: relative; }
.vn-tl-single img { display: block; width: 100%; height: auto; border-radius: 8px; }

/* ── Watermark overlay on timeline photos ── */
.vn-tl-watermark {
	position: absolute; left: 8px; bottom: 8px; z-index: 2;
	color: rgba(255, 255, 255, 0.85); font-size: 0.68rem; font-weight: 500;
	letter-spacing: 0.02em; line-height: 1.2;
	padding: 2px 6px; border-radius: 3px; background: rgba(10, 10, 15, 0.30);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); pointer-events: none;
}

/* ── Twitter-style photo carousel (timeline gallery) ── */
.vn-tl-carousel {
	position: relative; border-radius: 8px; overflow: hidden; background: #000;
	aspect-ratio: 1 / 1; user-select: none; -webkit-user-select: none; outline: none;
}
.vn-tl-car-track { display: flex; height: 100%; transition: transform 0.28s ease; }
.vn-tl-car-slide { flex: 0 0 100%; min-width: 100%; height: 100%; position: relative; }
.vn-tl-car-slide img { display: block; width: 100%; height: 100%; object-fit: contain; }
.vn-tl-car-prev, .vn-tl-car-next {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 34px; height: 34px; border-radius: 50%; border: none; cursor: pointer;
	background: rgba(10, 10, 15, 0.6); color: #fff; font-size: 20px; line-height: 1;
	display: flex; align-items: center; justify-content: center; z-index: 3;
	transition: opacity 0.15s, background 0.15s;
}
.vn-tl-car-prev { left: 8px; }
.vn-tl-car-next { right: 8px; }
.vn-tl-car-prev:hover, .vn-tl-car-next:hover { background: rgba(230, 57, 70, 0.85); }
.vn-tl-car-prev.is-hidden, .vn-tl-car-next.is-hidden { opacity: 0; pointer-events: none; }
.vn-tl-car-count {
	position: absolute; top: 10px; right: 10px; z-index: 3;
	background: rgba(10, 10, 15, 0.75); color: #e4e4ec; font-size: 0.72rem; font-weight: 600;
	padding: 2px 8px; border-radius: 12px; letter-spacing: 0.03em;
}
.vn-tl-car-dots {
	position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); z-index: 3;
	display: flex; gap: 6px;
}
.vn-tl-car-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(228, 228, 236, 0.4); cursor: pointer; transition: background 0.15s, transform 0.15s; }
.vn-tl-car-dot.is-active { background: #e63946; transform: scale(1.25); }
.vn-tl-videowrap { position: relative; }
/* Portrait by default; the inline aspect-ratio (read from the video's own poster) overrides this per-video. */
.vn-tl-video video { display: block; margin: 0 auto; width: 100%; max-width: 420px; aspect-ratio: 9/16; object-fit: contain; background: #000; border-radius: 8px; }
.vn-tl-embed { border-radius: 8px; overflow: hidden; }
.vn-tl-embed iframe, .vn-tl-embed blockquote { max-width: 100%; }
.vn-tl-linkcard {
	display: block; background: #0a0a0f; border: 1px solid #1e1e2e; border-radius: 8px;
	padding: 0.9rem 1rem; text-decoration: none; transition: border-color 0.15s;
}
.vn-tl-linkcard:hover { border-color: #e63946; }
.vn-tl-linkhost { display: block; color: #f4a261; font-weight: 600; font-size: 0.85rem; }
.vn-tl-linkurl { display: block; color: #8b8b96; font-size: 0.75rem; overflow-wrap: anywhere; }
.vn-tl-stats { display: flex; gap: 1rem; padding-top: 0.6rem; border-top: 1px solid #1e1e2e; color: #8b8b96; font-size: 0.8rem; }
.vn-tl-stat { display: inline-flex; align-items: center; gap: 0.3rem; }

/* ── X/Twitter post card (rich embed inside a timeline entry) ── */
.vn-tl-twitter {
	display: block; background: #0a0a0f; border: 1px solid #1e1e2e; border-radius: 8px;
	padding: 0.85rem 0.95rem; text-decoration: none; transition: border-color 0.15s; margin-bottom: 0.75rem;
}
.vn-tl-twitter:hover { border-color: #3b82f6; }
.vn-tl-tw-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.vn-tl-tw-avatar { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.vn-tl-tw-who { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.vn-tl-tw-author { font-weight: 600; color: #e4e4ec; font-size: 0.85rem; }
.vn-tl-tw-handle { color: #8b8b96; font-size: 0.75rem; }
.vn-tl-tw-brand { margin-left: auto; color: #e4e4ec; font-size: 1.1rem; line-height: 1; }
.vn-tl-tw-text { color: #e4e4ec; font-size: 0.9rem; line-height: 1.5; margin-bottom: 0.65rem; overflow-wrap: anywhere; }
.vn-tl-tw-img { display: block; width: 100%; height: auto; border-radius: 8px; margin-bottom: 0.5rem; }
.vn-tl-tw-cta { display: inline-block; color: #3b82f6; font-size: 0.78rem; font-weight: 600; }