:root {
  --bg: #f2f2f2;
  --surface: #ffffff;
  --surface-soft: #fff8f8;
  --ink: #222222;
  --muted: #676767;
  --line: #dddddd;
  --red: #d92332;
  --red-dark: #a91321;
  --nav: #262626;
  --yellow: #fff0a8;
  --max: 1120px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  line-height: 1.75;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--red); }
button, input { font: inherit; }
h1, h2, h3, p { margin-top: 0; }

.partner-kit {
  width: min(920px, calc(100% - 28px));
  margin: 32px auto 72px;
}

.partner-kit-header,
.partner-kit-card {
  border: 1px solid var(--line);
  background: var(--surface);
}

.partner-kit-header {
  padding: clamp(24px, 5vw, 48px);
  border-top: 5px solid var(--red);
}

.partner-kit-header span {
  color: var(--red);
  font-weight: 800;
  letter-spacing: .12em;
}

.partner-kit-header h1 {
  margin-bottom: 8px;
  font-size: clamp(28px, 6vw, 48px);
  line-height: 1.2;
}

.partner-kit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.partner-kit-card {
  padding: 24px;
}

.partner-kit-card-wide {
  grid-column: 1 / -1;
}

.partner-kit-card h2 {
  margin-bottom: 16px;
  font-size: 20px;
}

.partner-kit-card dl {
  margin: 0;
}

.partner-kit-card dt {
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.partner-kit-card dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
}

.partner-kit-card a {
  color: var(--red-dark);
  text-decoration: underline;
}

.partner-kit-description {
  margin: 0;
  padding: 16px;
  border-left: 4px solid var(--red);
  background: var(--surface-soft);
}

.partner-kit-copy {
  padding: 14px;
  overflow-wrap: anywhere;
  border: 1px solid var(--line);
  background: var(--surface-soft);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 13px;
  line-height: 1.7;
  user-select: all;
}

@media (max-width: 680px) {
  .partner-kit-grid { grid-template-columns: 1fr; }
}

.ad-bar {
  padding: 6px 16px;
  color: #666;
  background: #e8e8e8;
  border-bottom: 1px solid #d4d4d4;
  font-size: 11px;
  text-align: center;
}

.site-header {
  position: relative;
  z-index: 20;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}

.site-header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  max-width: var(--max);
  min-height: 86px;
  margin: 0 auto;
  padding: 14px 22px;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.blog-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  color: #fff;
  background: var(--red);
  border-radius: 4px;
  font-size: 14px;
  font-weight: 900;
}

.wordmark > span:last-child {
  display: grid;
  line-height: 1.3;
}

.wordmark strong { font-size: 21px; }
.wordmark small { color: var(--muted); font-size: 11px; font-weight: 500; }

.unofficial-label {
  padding: 5px 9px;
  color: var(--red-dark);
  background: #fff0f1;
  border: 1px solid #f0b9be;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 700;
}

.site-header nav {
  display: flex;
  justify-content: center;
  gap: 0;
  color: #fff;
  background: var(--nav);
  border-bottom: 3px solid var(--red);
}

.site-header nav a {
  padding: 11px 22px;
  border-right: 1px solid #444;
  font-size: 13px;
  font-weight: 700;
}

.site-header nav a:first-child { border-left: 1px solid #444; }
.site-header nav a:hover { color: #fff; background: var(--red); }
.site-header nav .x-link { background: #3b3b3b; }

#top,
.editorial-page {
  width: min(calc(100% - 32px), var(--max));
  margin: 24px auto 64px;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, .7fr);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 5px solid var(--red);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
}

.blog-badge,
.kicker {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--red-dark);
  font-size: 11px;
  font-weight: 800;
}

.hero h1 {
  margin-bottom: 16px;
  font-size: clamp(32px, 5vw, 52px);
  line-height: 1.25;
  letter-spacing: -.035em;
}

h1 em { color: var(--red); font-style: normal; }

.return-hub {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
  gap: 24px;
  align-items: center;
  margin-top: 26px;
  padding: 24px;
  color: #fff;
  background: #171717;
  border-top: 4px solid var(--red);
}

.return-hub-kicker,
.update-page-header > span {
  color: #ff6570;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.return-hub h2 { margin: 4px 0 6px; font-size: clamp(24px, 4vw, 34px); }
.return-hub p { margin: 0; color: #c7c7c7; font-size: 12px; }
.return-hub-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.return-hub-actions a,
.install-card button {
  padding: 9px 13px;
  color: #fff;
  background: var(--red);
  border: 1px solid var(--red);
  border-radius: 3px;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.return-hub-actions a:last-child { color: #fff; background: transparent; border-color: #666; }
.return-hub-actions a:hover { color: #fff; border-color: #fff; }

.install-card {
  display: grid;
  gap: 6px;
  padding: 18px;
  color: var(--ink);
  background: #fff;
  border-left: 4px solid var(--red);
}
.install-card > span { color: var(--red-dark); font-size: 9px; font-weight: 900; }
.install-card strong { font-size: 15px; }
.install-card small { color: var(--muted); font-size: 10px; line-height: 1.6; }
.install-card button { justify-self: start; }

.update-page { max-width: 900px; }
.update-page-header {
  padding: clamp(24px, 5vw, 44px);
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 5px solid var(--red);
}
.update-page-header h1 { margin: 6px 0 10px; font-size: clamp(34px, 7vw, 58px); line-height: 1.1; }
.update-page-header p { margin: 0; color: var(--muted); }
.update-timeline { margin-top: 18px; background: var(--surface); border: 1px solid var(--line); }
.update-timeline article {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 22px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
}
.update-timeline article:last-child { border-bottom: 0; }
.update-timeline time { color: var(--muted); font-size: 11px; font-weight: 800; }
.update-timeline article span { color: var(--red-dark); font-size: 10px; font-weight: 900; }
.update-timeline h2 { margin: 4px 0 6px; font-size: 20px; line-height: 1.4; }
.update-timeline h2 a:hover { color: var(--red); }
.update-timeline p { margin: 0; color: var(--muted); font-size: 12px; }
.update-policy { margin-top: 18px; padding: 18px 20px; background: #fff8e2; border-left: 4px solid #b58100; }
.update-policy strong { font-size: 12px; }
.update-policy p { margin: 4px 0 0; color: #5f5540; font-size: 11px; }

@media (max-width: 680px) {
  .return-hub { grid-template-columns: 1fr; padding: 18px; }
  .update-timeline article { grid-template-columns: 1fr; gap: 6px; padding: 18px; }
}

.lead {
  max-width: 720px;
  margin-bottom: 22px;
  color: var(--muted);
  font-size: 15px;
}

.hero-actions,
.pick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 180px;
  padding: 12px 16px;
  border: 1px solid var(--red);
  border-radius: 3px;
  font-size: 13px;
  font-weight: 800;
}

.button.primary { color: #fff; background: var(--red); }
.button.secondary { color: var(--red-dark); background: #fff; }
.button:hover { color: #fff; background: var(--red-dark); }
.hero-affiliate span { margin-left: 5px; font-size: 9px; }

.blogger-card {
  padding: 22px;
  background: #faf7f3;
  border: 1px solid #e2d7ce;
  border-radius: 4px;
}

.blogger-label {
  margin-bottom: 6px;
  color: var(--red);
  font-size: 10px;
  font-weight: 800;
}

.blogger-card h2 { margin-bottom: 10px; font-size: 20px; }
.blogger-card p { color: #625b55; font-size: 12px; }
.blogger-card ul { margin: 14px 0 0; padding-left: 20px; font-size: 12px; }

.signal-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 0;
}

.signal-strip span {
  padding: 5px 10px;
  color: #555;
  background: #f1f1f1;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 700;
}

.preference-finder,
.buying-path,
.route-cards,
.picks-section,
.standards-section,
.about-section,
.privacy-section,
.platform-status,
.comparison-wrap,
.rank-list,
.editorial-note,
.guide-grid,
.checklist-section,
.guide-picks {
  margin-top: 26px;
}

.preference-finder {
  padding: 28px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.preference-heading,
.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .7fr);
  gap: 28px;
  align-items: end;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.preference-heading h2,
.section-heading h2,
.about-section h2,
.privacy-section h2 {
  margin: 0;
  font-size: clamp(26px, 4vw, 38px);
  line-height: 1.25;
}

.preference-heading > p,
.section-heading > p { margin: 0; color: var(--muted); font-size: 13px; }

.preference-options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 18px 0;
}

.preference-options button {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 92px;
  padding: 0;
  overflow: hidden;
  color: var(--ink);
  background: #111;
  border: 1px solid var(--line);
  border-radius: 3px;
  text-align: left;
  cursor: pointer;
}

.preference-options button:hover,
.preference-options button[aria-pressed="true"] {
  background: #1c1115;
  border-color: var(--red);
  box-shadow: inset 4px 0 var(--red);
}

.preference-option-media { position: relative; display: block; align-self: stretch; min-height: 88px; overflow: hidden; background: #000; }
.preference-option-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, transparent 55%, rgba(17, 17, 17, .78)); }
.preference-option-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease, filter .25s ease; }
.preference-options button:hover .preference-option-media img,
.preference-options button[aria-pressed="true"] .preference-option-media img { filter: brightness(.82) saturate(1.08); transform: scale(1.035); }
.preference-option-media i { position: absolute; z-index: 1; top: 7px; left: 7px; padding: 3px 6px; color: #fff; background: rgba(0, 0, 0, .76); border-left: 3px solid var(--red); font-size: 9px; font-style: normal; font-weight: 900; }
.preference-option-copy { display: grid; gap: 5px; padding: 12px 12px 12px 0; }
.preference-option-copy strong { color: #fff; font-size: 15px; }
.preference-option-copy small { color: #9d9598; }

.preference-result {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 0;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
  background: #111;
  border: 1px solid #3a2229;
  border-left: 5px solid var(--red);
}

.preference-result-media { position: relative; display: block; min-height: 260px; overflow: hidden; background: #000; }
.preference-result-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .7)); pointer-events: none; }
.preference-result-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter .2s ease, transform .3s ease; }
.preference-result-media:hover img { filter: brightness(.8) saturate(1.1); transform: scale(1.02); }
.preference-result-media .play-button { z-index: 2; width: 58px; height: 58px; background: rgba(222, 25, 76, .93); border: 1px solid rgba(255, 255, 255, .7); font-size: 15px; }
.preference-result-badge { position: absolute; z-index: 2; top: 12px; left: 12px; padding: 5px 8px; color: #fff; background: rgba(191, 16, 61, .92); font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.preference-result-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(20px, 3vw, 34px); }
.preference-result h3 { margin-bottom: 8px; color: #fff; font-size: clamp(20px, 2.5vw, 28px); }
.preference-result p { margin-bottom: 10px; color: #aaa0a4; font-size: 13px; }
.preference-result .evidence-row { margin-bottom: 20px; }
.preference-result .rank-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.preference-result .rank-actions a { display: grid; place-items: center; min-height: 44px; padding: 9px 12px; color: #ddd; background: #252025; border: 1px solid #42323a; font-size: 10px; font-weight: 900; text-align: center; }
.preference-result .rank-actions .affiliate-button { color: #fff; background: #cf1845; border-color: #e93965; }

.buying-path {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 24px;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.buying-path h2 { margin: 0; font-size: 25px; }

.buying-path ol {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.buying-path li {
  display: grid;
  gap: 4px;
  padding: 14px;
  background: #f7f7f7;
  border: 1px solid #e3e3e3;
}

.buying-path li span { color: var(--red); font-size: 10px; font-weight: 900; }
.buying-path li strong { font-size: 14px; }
.buying-path li small { color: var(--muted); line-height: 1.6; }

.route-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.route-cards a {
  display: grid;
  gap: 4px;
  min-height: 112px;
  padding: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 3px solid #777;
}

.route-cards a:hover { color: inherit; border-top-color: var(--red); box-shadow: 0 2px 8px rgba(0, 0, 0, .08); }
.route-cards span { color: var(--red); font-size: 9px; font-weight: 800; }
.route-cards strong { font-size: 15px; }
.route-cards small { color: var(--muted); }

.picks-section,
.standards-section,
.about-section,
.privacy-section {
  padding: 28px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.last-updated { margin: 8px 0 0; color: var(--muted); font-size: 11px; }

.pick-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.pick-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #fff;
  border: 1px solid #d8d8d8;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .06);
}

.pick-topline {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  color: #555;
  background: #f2f2f2;
  border-bottom: 1px solid #ddd;
  font-size: 10px;
  font-weight: 800;
}

.pick-topline span:first-child { color: #fff; background: var(--red); padding: 1px 7px; border-radius: 2px; }

.pick-visual {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 8.5;
  color: #fff;
  background: linear-gradient(135deg, #424242, #1f1f1f);
  border-bottom: 4px solid var(--red);
}

.pick-visual::before {
  position: absolute;
  content: "サンプル動画";
  top: 12px;
  left: 12px;
  padding: 3px 7px;
  background: rgba(0, 0, 0, .65);
  font-size: 9px;
}

.play-mark {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding-left: 3px;
  color: #fff;
  background: var(--red);
  border-radius: 50%;
}

.pick-visual small {
  position: absolute;
  right: 10px;
  bottom: 8px;
  padding: 2px 6px;
  background: rgba(0, 0, 0, .72);
  font-size: 9px;
}

.pick-body { padding: 18px; }
.creator { margin-bottom: 4px; color: var(--red-dark); font-size: 11px; font-weight: 800; }
.pick-body h3 { margin-bottom: 8px; font-size: 20px; line-height: 1.45; }
.pick-body > p:not(.creator):not(.proof) { color: var(--muted); font-size: 12px; }

.proof {
  display: inline-block;
  margin: 8px 0 0;
  padding: 4px 7px;
  color: #5d4c00;
  background: var(--yellow);
  font-size: 9px;
  font-weight: 700;
}

.verified-at { margin: 7px 0 0; color: #777; font-size: 10px; }

.decision-notes,
.rank-decision {
  display: grid;
  gap: 7px;
  margin: 13px 0 0;
}

.decision-notes div,
.rank-decision div {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 8px;
  padding-top: 7px;
  border-top: 1px dotted #ccc;
}

.decision-notes dt,
.rank-decision dt { color: var(--red-dark); font-size: 9px; font-weight: 800; }
.decision-notes dd,
.rank-decision dd { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }

.pick-actions { margin-top: auto; padding: 0 18px 18px; }
.pick-actions a,
.rank-actions a {
  display: block;
  padding: 10px 12px;
  border: 1px solid #bbb;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.pick-actions a:hover,
.rank-actions a:hover { color: #fff; background: #444; border-color: #444; }

.pick-actions .affiliate-button,
.rank-actions .affiliate-button {
  color: #fff;
  background: var(--red);
  border-color: var(--red);
}

.affiliate-button span { margin-left: 4px; font-size: 8px; }

.standards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 20px;
}

.standards-grid article { padding: 15px; background: #f7f7f7; border-left: 4px solid var(--red); }
.standards-grid span { color: var(--red); font-size: 10px; font-weight: 900; }
.standards-grid h3 { margin: 4px 0; font-size: 15px; }
.standards-grid p { margin: 0; color: var(--muted); font-size: 11px; }

.about-section,
.privacy-section {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 28px;
}

.about-copy,
.privacy-copy { color: var(--muted); font-size: 13px; }
.about-copy p:last-child { margin-bottom: 0; }

.privacy-copy {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.privacy-copy article,
.privacy-links { padding: 14px; background: #f7f7f7; }
.privacy-copy h3 { margin-bottom: 5px; color: var(--ink); font-size: 14px; }
.privacy-copy p { margin: 0; font-size: 11px; }
.privacy-links { display: grid; gap: 4px; grid-column: 1 / -1; }
.privacy-links a { color: var(--red-dark); font-size: 11px; font-weight: 700; }

.platform-status {
  padding: 18px 22px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.platform-status > div { display: flex; flex-wrap: wrap; gap: 8px; }
.platform-status span { padding: 6px 10px; background: #f2f2f2; font-size: 11px; }
.platform-status strong { color: var(--red-dark); }

.editorial-page { max-width: 980px; }

.page-hero {
  display: grid;
  grid-template-columns: 1fr 330px;
  gap: 26px;
  align-items: start;
  padding: 30px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 5px solid var(--red);
}

.page-hero h1 { margin: 0; font-size: clamp(32px, 5vw, 48px); line-height: 1.25; }
.breadcrumb { margin-bottom: 8px; color: #777; font-size: 10px; }
.breadcrumb a { color: var(--red-dark); }

.page-hero-note {
  padding: 18px;
  background: #faf7f3;
  border: 1px solid #e2d7ce;
}

.page-hero-note strong { color: var(--red-dark); font-size: 12px; }
.page-hero-note p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.hero-note-cta { display: block; margin-top: 12px; padding: 10px; color: #fff; background: var(--red); border-radius: 3px; font-size: 11px; font-weight: 800; text-align: center; }

.comparison-wrap,
.rank-list,
.guide-grid,
.checklist-section,
.guide-picks,
.editorial-note {
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.table-scroll { overflow-x: auto; margin-top: 18px; }
.comparison-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 11px; }
.comparison-table th { color: #fff; background: #333; }
.comparison-table th,
.comparison-table td { padding: 10px; border: 1px solid #d5d5d5; text-align: left; vertical-align: top; }
.comparison-table tbody tr:nth-child(even) { background: #f7f7f7; }
.comparison-table td:first-child strong { color: var(--red); font-size: 18px; }
.comparison-table td:nth-child(2) strong { color: var(--red-dark); font-size: 20px; }
.comparison-table small { display: block; color: var(--muted); }

.rank-list { padding: 0; }
.rank-entry {
  display: grid;
  grid-template-columns: 58px 1fr 220px;
  gap: 18px;
  align-items: start;
  padding: 22px;
  border-bottom: 1px solid var(--line);
}
.rank-entry:last-child { border-bottom: 0; }
.rank-number { color: var(--red); font-size: 34px; font-weight: 900; }
.rank-copy h2 { margin-bottom: 7px; font-size: 22px; line-height: 1.4; }
.rank-copy > p:not(.creator) { color: var(--muted); font-size: 12px; }
.rank-actions { display: grid; gap: 8px; }
.rank-actions small { color: var(--muted); font-size: 9px; text-align: center; }

.evidence-row { display: flex; flex-wrap: wrap; gap: 6px; }
.evidence-row span { padding: 4px 7px; background: #f0f0f0; border: 1px solid #ddd; font-size: 9px; font-weight: 700; }

.guide-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.guide-grid article { padding: 18px; background: #f8f8f8; border-top: 3px solid var(--red); }
.guide-grid span { color: var(--red); font-size: 10px; font-weight: 900; }
.guide-grid h2 { margin: 4px 0 7px; font-size: 18px; }
.guide-grid p { margin: 0; color: var(--muted); font-size: 12px; }

.checklist-section {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 24px;
}
.checklist-section h2 { margin: 0; font-size: 24px; }
.checklist-section ol { margin: 0; padding-left: 22px; }
.checklist-section li { padding: 7px 0; border-bottom: 1px dotted #ccc; font-size: 12px; }

.guide-picks > article {
  display: grid;
  grid-template-columns: 1fr 240px;
  gap: 22px;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.guide-picks > article:last-child { border-bottom: 0; }
.guide-picks h3 { margin-bottom: 7px; font-size: 20px; }
.guide-picks article p:not(.creator) { color: var(--muted); font-size: 12px; }
.guide-picks article small { color: var(--muted); font-size: 10px; }

.editorial-note { border-left: 5px solid var(--red); }
.editorial-note h2 { margin-bottom: 8px; font-size: 24px; }
.editorial-note > p:not(.kicker) { color: var(--muted); font-size: 12px; }
.guide-links { display: flex; flex-wrap: wrap; gap: 8px; }
.guide-links a { padding: 7px 10px; color: var(--red-dark); background: #fff1f2; border: 1px solid #efc6ca; font-size: 11px; font-weight: 700; }

footer {
  display: grid;
  grid-template-columns: 1.2fr 2fr;
  gap: 18px 30px;
  align-items: start;
  padding: 34px max(20px, calc((100vw - var(--max)) / 2));
  color: #ddd;
  background: #252525;
  border-top: 5px solid var(--red);
}

footer .blog-icon { width: 42px; height: 42px; }
footer .wordmark small { color: #aaa; }
footer p { margin: 0; color: #bbb; font-size: 11px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-links a, footer > a { color: #fff; font-size: 11px; }
footer > small { grid-column: 1 / -1; color: #999; font-size: 10px; }

.age-gate {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  place-items: center;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  overflow-y: auto;
  background: rgba(20, 20, 20, .88);
  -webkit-overflow-scrolling: touch;
}

html[data-age-confirmed="yes"] .age-gate { display: none; }

.age-gate-panel {
  width: min(100%, 480px);
  padding: 28px;
  background: #fff;
  border-top: 6px solid var(--red);
  box-shadow: 0 18px 60px rgba(0, 0, 0, .35);
}

.age-gate-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; font-size: 12px; font-weight: 800; }
.age-gate-brand .brand-mark { display: grid; place-items: center; width: 38px; height: 38px; color: #fff; background: var(--red); }
.age-gate-index { color: var(--red); font-size: 10px; font-weight: 900; }
.age-gate h2 { margin: 8px 0; font-size: 27px; }
.age-gate p { color: var(--muted); font-size: 13px; }
.age-gate-actions { display: grid; gap: 8px; }
.age-gate-confirm,
.age-gate-actions a { padding: 11px; border: 1px solid var(--red); text-align: center; }
.age-gate-confirm { position: relative; z-index: 1; display: grid; place-items: center; width: 100%; min-height: 52px; border: 0; color: #fff; background: var(--red); cursor: pointer; font: inherit; font-weight: 900; touch-action: manipulation; -webkit-tap-highlight-color: transparent; user-select: none; }
.age-gate-confirm:focus-visible { outline: 3px solid #111; outline-offset: 3px; }
.age-gate-actions a { color: #555; background: #fff; font-size: 12px; }
.age-gate small { display: block; margin-top: 10px; color: #777; font-size: 9px; }

.sticky-offer { display: none; }

@media (max-width: 900px) {
  .site-header nav { overflow-x: auto; justify-content: flex-start; }
  .site-header nav a { white-space: nowrap; }
  .hero,
  .page-hero,
  .preference-heading,
  .section-heading,
  .about-section,
  .privacy-section,
  .buying-path { grid-template-columns: 1fr; }
  .route-cards { grid-template-columns: repeat(2, 1fr); }
  .pick-grid { grid-template-columns: repeat(2, 1fr); }
  .standards-grid { grid-template-columns: repeat(2, 1fr); }
  .rank-entry { grid-template-columns: 50px 1fr; }
  .rank-actions { grid-column: 2; }
}

@media (max-width: 620px) {
  body { padding-bottom: 70px; }
  .site-header-inner { min-height: 72px; padding: 10px 14px; }
  .wordmark strong { font-size: 17px; }
  .wordmark small { font-size: 9px; }
  .blog-icon { width: 40px; height: 40px; font-size: 12px; }
  .unofficial-label { font-size: 9px; }
  .site-header nav a { padding: 9px 14px; font-size: 11px; }
  #top,
  .editorial-page { width: min(calc(100% - 20px), var(--max)); margin-top: 12px; }
  .hero,
  .preference-finder,
  .buying-path,
  .picks-section,
  .standards-section,
  .about-section,
  .privacy-section,
  .comparison-wrap,
  .guide-grid,
  .checklist-section,
  .guide-picks,
  .editorial-note,
  .page-hero { padding: 18px; }
  .hero h1 { font-size: 34px; }
  .hero-actions { display: grid; }
  .button { width: 100%; }
  .preference-options,
  .preference-result,
  .buying-path ol,
  .pick-grid,
  .route-cards,
  .standards-grid,
  .privacy-copy,
  .guide-grid,
  .checklist-section,
  .guide-picks > article { grid-template-columns: 1fr; }
  .preference-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .preference-options button { grid-template-columns: 1fr; min-height: 0; }
  .preference-option-media { aspect-ratio: 16 / 9; min-height: 0; }
  .preference-option-media::after { background: linear-gradient(180deg, transparent 55%, rgba(17, 17, 17, .72)); }
  .preference-option-copy { padding: 9px 10px 11px; }
  .preference-option-copy small { display: none; }
  .preference-result-media { min-height: 0; aspect-ratio: 16 / 9; }
  .preference-result .rank-actions { grid-template-columns: 1fr; }
  .rank-entry { grid-template-columns: 1fr; }
  .rank-actions { grid-column: auto; }
  .rank-number { font-size: 28px; }
  footer { grid-template-columns: 1fr; padding: 28px 18px; }
  footer > small { grid-column: auto; }
  .sticky-offer {
    position: fixed;
    z-index: 60;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-height: 66px;
    padding: 8px 10px;
    color: #fff;
    background: #252525;
    border-top: 3px solid var(--red);
    box-shadow: 0 -3px 12px rgba(0, 0, 0, .24);
  }
  .sticky-offer > span { color: #bbb; font-size: 8px; line-height: 1.2; }
  .sticky-offer > span strong { display: block; color: #fff; font-size: 16px; }
  .sticky-offer p { margin: 0; overflow: hidden; font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
  .sticky-offer a { padding: 9px 10px; color: #fff; background: var(--red); border-radius: 3px; font-size: 10px; font-weight: 800; white-space: nowrap; }
  .sticky-offer a small { font-size: 7px; }
}


/* Vertical, swipe-first video discovery */
.shorts-page {
  min-height: 100vh;
  padding: 14px 12px 36px;
  color: #fff;
  background:
    radial-gradient(circle at 50% 0%, rgba(210, 14, 66, .2), transparent 34%),
    #050506;
}

.shorts-heading {
  display: flex;
  width: min(100%, 560px);
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 0 auto 10px;
}

.shorts-heading span { color: #ff376b; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.shorts-heading h1 { margin: 2px 0 0; font-size: clamp(24px, 5vw, 38px); letter-spacing: -.04em; }
.shorts-heading p { margin: 0 0 4px; color: #9d9197; font-size: 10px; }

.vertical-video-feed {
  width: min(100%, 560px);
  height: calc(100dvh - 168px);
  min-height: 580px;
  margin: 0 auto;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-behavior: smooth;
  scroll-snap-type: y mandatory;
  scrollbar-color: #8d1538 #100b0e;
  scrollbar-width: thin;
}

.vertical-video-card {
  position: relative;
  display: flex;
  min-height: 100%;
  padding: 6px 0 18px;
  flex-direction: column;
  justify-content: center;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.vertical-video-position {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 10px;
  padding: 5px 8px;
  color: #fff;
  background: rgba(6, 5, 6, .78);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
}

.vertical-video-media {
  width: min(100%, 430px);
  max-height: min(69dvh, 760px);
  aspect-ratio: 9 / 16;
  margin: 0 auto;
  overflow: hidden;
  background: #000;
  border: 1px solid #4b2734;
  border-radius: 12px 12px 0 0;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .62);
}

.vertical-video-media .video-detail-media,
.vertical-video-media .video-sample-myfans {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  margin: 0;
  border: 0;
  box-shadow: none;
}

.vertical-video-media .video-detail-media img { object-fit: cover; }
.vertical-video-copy {
  width: min(100%, 430px);
  margin: 0 auto;
  padding: 12px 12px 13px;
  background: linear-gradient(180deg, #171014, #0e0b0d);
  border: 1px solid #4b2734;
  border-top: 0;
  border-radius: 0 0 12px 12px;
}
.vertical-video-copy h2 { margin: 6px 0 12px; font-size: 16px; line-height: 1.45; }
.vertical-video-actions { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8px; }
.vertical-video-actions a {
  display: grid;
  min-height: 46px;
  place-items: center;
  color: #fff;
  background: #30242a;
  border: 1px solid #513541;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 900;
}
.vertical-video-actions .vertical-video-purchase { background: #cc1248; border-color: #f02e63; }
.vertical-video-actions small { margin-left: 4px; font-size: 7px; opacity: .7; }

.duga-preview-status {
  width: min(100%, 560px);
  margin: 10vh auto 0;
  padding: clamp(24px, 6vw, 42px);
  background: linear-gradient(145deg, rgba(34, 22, 28, .98), rgba(11, 9, 10, .98));
  border: 1px solid #5d2d3d;
  border-radius: 14px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .55);
}

/* Publisher acquisition: a public, copy-ready distribution entrance. */
.publisher-landing { width: min(calc(100% - 24px), 1180px); margin: 18px auto 70px; }
.publisher-hero { padding: clamp(28px, 6vw, 68px); color: #fff; background: radial-gradient(circle at 82% 12%, rgba(238, 32, 88, .32), transparent 34%), #100c0e; border: 1px solid #3e2530; border-left: 6px solid #e61b52; }
.publisher-hero > span,
.publisher-demo > div > span,
.publisher-codes > header > span { color: #ff4b79; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.publisher-hero h1 { max-width: 850px; margin: 8px 0 14px; font-size: clamp(36px, 7vw, 76px); line-height: 1; letter-spacing: -.055em; }
.publisher-hero p { max-width: 720px; color: #b8adb1; }
.publisher-hero > a { display: inline-block; margin-top: 10px; padding: 12px 17px; color: #fff; background: #d8174d; font-size: 12px; font-weight: 900; }
.publisher-demo { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: clamp(24px, 5vw, 64px); align-items: center; margin-top: 18px; padding: clamp(24px, 5vw, 54px); color: #eee; background: #171215; border: 1px solid #3a2830; }
.publisher-demo h2 { margin: 7px 0 18px; font-size: clamp(28px, 5vw, 50px); line-height: 1.05; }
.publisher-demo ul { display: grid; gap: 10px; padding-left: 20px; color: #b0a4a9; }
.publisher-demo iframe { width: 100%; max-width: 390px; height: min(700px, 78svh); justify-self: center; border: 0; background: #080708; box-shadow: 0 20px 70px rgba(0, 0, 0, .45); }
.publisher-codes { margin-top: 18px; padding: clamp(22px, 5vw, 48px); background: #fff; border: 1px solid var(--line); }
.publisher-codes > header h2 { margin: 6px 0; font-size: clamp(28px, 5vw, 46px); }
.publisher-codes > header p { color: var(--muted); }
.publisher-codes > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.publisher-codes article { min-width: 0; padding: 16px; background: #f7f3f5; border: 1px solid #e3d8dc; }
.publisher-codes article:last-child { grid-column: 1 / -1; }
.publisher-codes h3 { margin: 0 0 8px; color: #b30f3d; }
.publisher-codes pre { margin: 0; padding: 12px; overflow-x: auto; color: #ffd4df; background: #100c0e; font-size: 10px; line-height: 1.6; white-space: pre-wrap; word-break: break-all; user-select: all; }
.publisher-terms { margin-top: 18px; padding: clamp(22px, 4vw, 38px); background: #fff8e6; border-left: 5px solid #b47b00; }
.publisher-terms h2 { margin-bottom: 8px; }
.publisher-terms p { color: #625944; }
.publisher-terms nav { display: flex; flex-wrap: wrap; gap: 8px; }
.publisher-terms nav a { padding: 9px 12px; color: #fff; background: #252020; font-size: 11px; font-weight: 850; }

@media (max-width: 760px) {
  .publisher-demo { grid-template-columns: 1fr; padding: 20px 10px; }
  .publisher-demo > div { padding: 0 10px; }
  .publisher-demo iframe { height: 76svh; min-height: 560px; }
  .publisher-codes > div { grid-template-columns: 1fr; }
  .publisher-codes article:last-child { grid-column: auto; }
}
.duga-preview-status > span { color: #ff376b; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.duga-preview-status h2 { margin: 8px 0 10px; font-size: clamp(24px, 5vw, 40px); line-height: 1.18; }
.duga-preview-status p { margin: 0; color: #baaeb3; font-size: 13px; line-height: 1.8; }
.duga-preview-status dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 26px 0 0; }
.duga-preview-status dl > div { padding: 12px; background: #171115; border: 1px solid #3c2931; border-radius: 6px; }
.duga-preview-status dt { color: #8e8086; font-size: 9px; font-weight: 800; }
.duga-preview-status dd { margin: 5px 0 0; color: #fff; font-size: 14px; font-weight: 900; }
.duga-service-credit { width: min(100%, 560px); margin: 10px auto 0; text-align: right; }
.duga-service-credit a { color: #a99da2; font-size: 9px; }
.video-sample-duga { aspect-ratio: 9 / 16; }
.video-sample-duga video { object-fit: cover; }
.duga-only-action a {
  display: grid;
  min-height: 48px;
  place-items: center;
  color: #fff;
  background: #cc1248;
  border: 1px solid #f02e63;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 900;
}
.duga-only-action small { margin-left: 4px; font-size: 7px; opacity: .7; }
.duga-hub-nav {
  display: flex;
  width: min(100%, 980px);
  margin: 0 auto 16px;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}
.duga-hub-nav::-webkit-scrollbar { display: none; }
.duga-hub-nav a {
  flex: 0 0 auto;
  padding: 10px 14px;
  color: #eee;
  background: #171115;
  border: 1px solid #3c2931;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}
.duga-watch-index {
  width: min(100%, 980px);
  margin: 22px auto 10px;
  padding: 16px;
  background: #121012;
  border: 1px solid #35272d;
  border-radius: 10px;
}
.duga-watch-index > strong { display: block; margin-bottom: 10px; color: #fff; font-size: 12px; }
.duga-watch-index > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.duga-watch-index a {
  display: grid;
  min-height: 42px;
  place-items: center;
  color: #ddd;
  background: #1c1719;
  border: 1px solid #3c2d33;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 900;
}
.duga-hub-page,
.duga-watch-page {
  width: min(calc(100% - 24px), 1120px);
  margin: 18px auto 0;
  padding-bottom: 64px;
}
.duga-hub-heading { margin: 18px 0 20px; }
.duga-hub-heading > span { color: #ff376b; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.duga-hub-heading h1 { margin: 5px 0 6px; color: #fff; font-size: clamp(30px, 5vw, 54px); line-height: 1.08; }
.duga-hub-heading p { margin: 0; color: #a99da2; font-size: 13px; }
.duga-catalog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.duga-catalog-card {
  overflow: hidden;
  background: #121012;
  border: 1px solid #32252b;
  border-radius: 10px;
}
.duga-catalog-media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #050505; }
.duga-catalog-media img { width: 100%; height: 100%; object-fit: cover; }
.duga-catalog-media > span {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 5px 8px;
  color: #fff;
  background: rgba(13, 8, 10, .84);
  border: 1px solid rgba(255, 55, 107, .55);
  border-radius: 4px;
  font-size: 9px;
  font-weight: 900;
}
.duga-catalog-copy { padding: 14px; }
.duga-catalog-copy h2 { margin: 8px 0 7px; color: #fff; font-size: clamp(16px, 2.5vw, 21px); line-height: 1.45; }
.duga-catalog-copy p { min-height: 42px; margin: 0 0 13px; color: #aca0a5; font-size: 12px; line-height: 1.7; }
.duga-catalog-copy > a {
  display: grid;
  min-height: 48px;
  place-items: center;
  color: #fff;
  background: #cc1248;
  border: 1px solid #f02e63;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 950;
}
.duga-catalog-copy > a small { margin-left: 4px; opacity: .72; }
.duga-watch-page .duga-hub-nav { margin-top: 14px; }
.duga-watch-card {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  overflow: hidden;
  margin-top: 12px;
  background: #120f11;
  border: 1px solid #3b2931;
  border-radius: 12px;
}
.duga-watch-media { display: grid; min-height: 520px; place-items: center; background: #050505; }
.duga-watch-media .video-sample-duga { width: min(100%, 600px); max-height: 78vh; }
.duga-watch-media .video-sample-duga video { max-height: 78vh; }
.duga-watch-copy { align-self: center; padding: clamp(20px, 4vw, 44px); }
.duga-watch-copy h1 { margin: 10px 0 12px; color: #fff; font-size: clamp(24px, 3.5vw, 42px); line-height: 1.22; }
.duga-watch-copy > p { margin: 0 0 20px; color: #b4a8ad; font-size: 13px; line-height: 1.8; }
.duga-watch-purchase {
  display: grid;
  min-height: 56px;
  place-items: center;
  color: #fff;
  background: #cc1248;
  border: 1px solid #f02e63;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 950;
}
.duga-watch-purchase small { margin-left: 5px; opacity: .72; }
.duga-watch-neighbors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 14px 0; }
.duga-watch-neighbors a {
  display: grid;
  min-height: 46px;
  place-items: center;
  color: #ddd;
  background: #171315;
  border: 1px solid #392a30;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 900;
}

@media (max-width: 720px) {
  .shorts-page { padding: 8px 6px max(18px, env(safe-area-inset-bottom)); }
  .shorts-heading { padding-inline: 6px; }
  .shorts-heading p { max-width: 140px; text-align: right; }
  .vertical-video-feed { height: calc(100dvh - 154px); min-height: 520px; }
  .vertical-video-card { padding-bottom: 10px; }
  .vertical-video-media { max-height: min(68dvh, 680px); border-radius: 8px 8px 0 0; }
  .vertical-video-copy { border-radius: 0 0 8px 8px; }
  .duga-preview-status { margin-top: 6vh; padding: 24px 18px; }
  .duga-preview-status dl { grid-template-columns: 1fr; }
  .duga-hub-page, .duga-watch-page { width: min(calc(100% - 12px), 1120px); margin-top: 8px; }
  .duga-hub-nav { margin-bottom: 10px; }
  .duga-catalog-grid { grid-template-columns: 1fr; gap: 10px; }
  .duga-catalog-copy p { min-height: 0; }
  .duga-watch-index > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .duga-watch-card { grid-template-columns: 1fr; }
  .duga-watch-media { min-height: 0; }
  .duga-watch-media .video-sample-duga, .duga-watch-media .video-sample-duga video { max-height: 66dvh; }
  .duga-watch-copy { padding: 18px 14px 20px; }
  .duga-watch-neighbors { grid-template-columns: 1fr 1fr; }
  .duga-watch-neighbors a:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
}


/* Video-first homepage */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

body {
  color: #eee;
  background: #090909;
  font-family: Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  line-height: 1.45;
}

.tube-site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: #111;
  border-bottom: 1px solid #2a2a2a;
  box-shadow: 0 5px 18px rgba(0, 0, 0, .35);
}

.tube-site-header .site-header-inner { min-height: 64px; padding-block: 8px; }
.tube-site-header .blog-icon { width: 42px; height: 42px; color: #111; background: #ff315f; border-radius: 3px; font-size: 13px; }
.tube-site-header .wordmark { color: #fff; }
.tube-site-header .wordmark strong { font-size: 20px; letter-spacing: -.03em; }
.tube-site-header .wordmark small { color: #888; font-size: 9px; letter-spacing: .18em; }
.tube-site-header .header-x-link { padding: 8px 12px; color: #ddd; background: #242424; border-radius: 3px; box-shadow: none; font-size: 12px; }
.header-social-links { display: flex; align-items: center; gap: 7px; }
.tube-site-header .header-bsky-link { padding: 8px 12px; color: #e6f5ff; background: #075d91; border-radius: 3px; box-shadow: none; font-size: 12px; }
.tube-site-header .header-telegram-link { padding: 8px 12px; color: #fff; background: #229ed9; border-radius: 3px; box-shadow: none; font-size: 12px; }

.tube-site-header nav {
  justify-content: flex-start;
  max-width: none;
  padding-inline: max(16px, calc((100vw - 1240px) / 2));
  overflow-x: auto;
  color: #bbb;
  background: #171717;
  border: 0;
  scrollbar-width: none;
}
.tube-site-header nav::-webkit-scrollbar { display: none; }
.tube-site-header nav a,
.tube-site-header nav a:first-child { flex: 0 0 auto; padding: 10px 17px; border: 0; font-size: 12px; }
.tube-site-header nav a:hover { color: #fff; background: #2d2d2d; }

.tube-home { width: min(calc(100% - 28px), 1240px); margin: 18px auto 54px; }
.tube-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; }

.tube-search {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  min-height: 46px;
  color: #888;
  background: #191919;
  border: 1px solid #333;
  border-radius: 4px;
}
.tube-search input { width: 100%; padding: 11px 14px; color: #f5f5f5; background: transparent; border: 0; outline: 0; }
.tube-search input::placeholder { color: #777; }
.tube-search > span:last-child { padding: 0 15px; font-size: 24px; }

.tube-tools > a { display: grid; place-items: center; min-height: 46px; padding: 0 16px; color: #fff; background: #292929; border: 1px solid #383838; border-radius: 4px; font-size: 12px; font-weight: 700; }

.tube-categories { display: flex; gap: 8px; margin: 14px 0 26px; overflow-x: auto; scrollbar-width: none; }
.tube-categories::-webkit-scrollbar { display: none; }
.tube-categories button { flex: 0 0 auto; padding: 8px 16px; color: #aaa; background: #1c1c1c; border: 1px solid #303030; border-radius: 999px; cursor: pointer; font-size: 12px; font-weight: 700; }
.tube-categories button:hover,
.tube-categories button[aria-pressed="true"] { color: #fff; background: #d91f4c; border-color: #d91f4c; }

.discovery-tags {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: -12px 0 24px;
  overflow-x: auto;
  scrollbar-width: none;
}

.discovery-tags::-webkit-scrollbar { display: none; }
.discovery-tags > span { flex: 0 0 auto; color: #777; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.discovery-tags a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  color: #c9c9c9;
  background: #161616;
  border: 1px solid #333;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 800;
}
.discovery-tags a:hover,
.discovery-tags a[aria-current="page"] { color: #fff; background: #541126; border-color: #be2450; }
.discovery-tags small { color: #777; font-size: 8px; }
.discovery-tags-compact { margin: 10px 0 18px; }

.feed-heading { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; }
.feed-heading h1 { margin: 0; color: #fff; font-size: 24px; letter-spacing: -.02em; text-shadow: none; }
.feed-heading span { color: #888; font-size: 12px; }

.video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 14px; }
.video-tile { min-width: 0; color: #e8e8e8; background: transparent; }
.video-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #000; border-radius: 4px; }
.video-frame video { display: block; width: 100%; height: 100%; background: #000; object-fit: cover; }

.x-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.x-post-frame { min-height: 360px; overflow: hidden; background: #111; border: 1px solid #272727; border-radius: 8px; }
.x-post-frame .twitter-tweet { margin: 0 auto !important; }
.x-post-frame iframe { display: block !important; width: 100% !important; margin: 0 auto !important; }

.video-info { padding-top: 10px; }
.video-info h2 { display: -webkit-box; min-height: 42px; margin: 0 0 5px; overflow: hidden; color: #f2f2f2; font-size: 15px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.video-info > p { margin: 0 0 7px; color: #8e8e8e; font-size: 11px; }
.video-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; min-height: 21px; color: #858585; font-size: 10px; }
.video-meta span:nth-child(n+3) { color: #c68a9a; }

.video-actions { display: grid; grid-template-columns: 1fr auto; gap: 7px; margin-top: 9px; }
.video-actions a { display: grid; place-items: center; min-height: 38px; border-radius: 3px; font-size: 11px; font-weight: 800; }
.video-actions .watch-full { color: #fff; background: #d91f4c; }
.video-actions .watch-full:hover { color: #fff; background: #ff315f; }
.video-actions .watch-full small { margin-left: 5px; font-size: 8px; opacity: .75; }
.video-actions .source-link { padding-inline: 12px; color: #bcbcbc; background: #252525; }
.video-actions .source-link:hover { color: #fff; background: #333; }

.empty-feed { padding: 60px 0; color: #888; text-align: center; }
.publisher-ad-section {
  display: grid;
  justify-items: center;
  width: 100%;
  margin: clamp(30px, 5vw, 54px) auto 0;
  padding-top: 14px;
  border-top: 1px solid #292329;
}
.publisher-ad-label {
  margin: 0 0 7px;
  color: #776d72;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
}
.publisher-ad-frame {
  width: 300px;
  max-width: 100%;
  min-height: 250px;
  overflow: hidden;
  background: #090809;
}
.publisher-ad-frame .admax-ads { display: block !important; max-width: 100%; margin: 0 auto; }
.publisher-ad-section--detail_after_offer { margin-bottom: 38px; }
.tube-notice { display: flex; gap: 16px; align-items: flex-start; margin-top: 44px; padding-top: 18px; color: #777; border-top: 1px solid #292929; font-size: 10px; }
.tube-notice strong { flex: 0 0 auto; color: #b8b8b8; }
.tube-notice p { margin: 0; }

footer { display: grid; gap: 14px; color: #a7a7a7; background: #101010; border-top: 1px solid #282828; }
footer .footer-mark { color: #fff; }
footer .footer-links { display: flex; flex-wrap: wrap; gap: 8px 18px; }
footer .footer-links a { color: #999; font-size: 11px; }
footer > small { color: #666; }

.age-gate-panel { max-width: 480px; color: #211b1f; }
.age-gate-panel .age-gate-brand,
.age-gate-panel h2 { color: #171316; }
.age-gate-panel p { margin-bottom: 18px; }

@media (min-width: 1180px) {
  .video-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .x-video-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  body { padding-bottom: 0; }
  .tube-site-header .site-header-inner { min-height: 56px; }
  .tube-site-header .blog-icon { width: 36px; height: 36px; }
  .tube-site-header .wordmark strong { font-size: 17px; }
  .tube-site-header .header-x-link { padding: 7px 9px; font-size: 10px; }
  .tube-site-header .header-bsky-link { padding: 7px 9px; font-size: 10px; }
  .tube-site-header .header-telegram-link { padding: 7px 9px; font-size: 10px; }
  .tube-home { width: min(calc(100% - 18px), 1240px); margin-top: 10px; }
  .tube-tools { grid-template-columns: 1fr; }
  .tube-tools > a { display: none; }
  .tube-categories { margin-block: 10px 18px; }
  .feed-heading h1 { font-size: 20px; }
  .video-grid,
  .x-video-grid { grid-template-columns: 1fr; gap: 22px 8px; }
  .video-info h2 { min-height: 37px; font-size: 13px; }
  .video-actions { grid-template-columns: 1fr; }
  .video-actions .source-link { display: none; }
  .tube-notice { display: block; }
  .tube-notice strong { display: block; margin-bottom: 6px; }
}

@media (max-width: 380px) {
  .video-grid { grid-template-columns: 1fr; }
}

/* Compact thumbnail index */
.tube-site-header {
  background: #07070a;
  border-bottom-color: #2b1523;
}

.tube-site-header .site-header-inner {
  max-width: 1420px;
  min-height: 58px;
  padding: 7px 18px;
}

.tube-site-header .blog-icon {
  width: 38px;
  height: 38px;
  color: #fff;
  background: linear-gradient(145deg, #ff174f, #b00035);
  border-radius: 2px;
  font-size: 20px;
  font-style: italic;
}

.tube-site-header .wordmark strong {
  font-size: 22px;
  letter-spacing: -.045em;
}

.tube-site-header nav {
  padding-inline: max(12px, calc((100vw - 1420px) / 2));
  background: #151218;
  border-top: 1px solid #241a22;
  border-bottom: 3px solid #e2144d;
}

.tube-site-header nav a {
  padding: 9px 18px;
}

.tube-home {
  width: min(calc(100% - 24px), 1420px);
  margin-top: 14px;
}

.tube-tools {
  grid-template-columns: minmax(220px, 560px) auto;
  justify-content: space-between;
}

.tube-search {
  min-height: 40px;
  background: #111014;
  border-color: #34242e;
}

.tube-search input {
  padding-block: 8px;
}

.tube-tools > a {
  min-height: 40px;
  background: #251720;
  border-color: #472236;
}

.tube-categories {
  margin: 10px 0 18px;
}

.tube-categories button {
  padding: 6px 15px;
  color: #c3b9bf;
  background: #151217;
  border-color: #33262e;
  border-radius: 3px;
}

.tube-categories button:hover,
.tube-categories button[aria-pressed="true"] {
  background: #e2144d;
  border-color: #e2144d;
}

.feed-heading {
  margin-bottom: 10px;
  padding: 9px 12px;
  background: linear-gradient(90deg, #7f062b, #2b111d 62%, transparent);
  border-left: 4px solid #ff2b61;
}

.feed-heading h1 {
  font-size: 20px;
}

.feed-heading span {
  color: #d8bdc7;
}

.feed-view-controls {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}

.feed-view-controls select,
.feed-view-controls button,
.video-save-button {
  min-height: 30px;
  padding: 5px 9px;
  color: #c9bec4;
  background: #171217;
  border: 1px solid #49313d;
  border-radius: 3px;
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
}

.feed-view-controls select { color-scheme: dark; }
.feed-view-controls button[aria-pressed="true"],
.video-save-button[aria-pressed="true"] {
  color: #fff;
  background: #a90d39;
  border-color: #e2144d;
}

.poster-video-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px 12px;
}

.video-card-media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #171217;
  border: 1px solid #2f232a;
  border-radius: 3px;
}

.poster-video-grid .video-tile {
  content-visibility: auto;
  contain-intrinsic-size: auto 340px;
}

.video-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease, filter .25s ease;
}

.video-card-media::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 52%, rgba(0, 0, 0, .78));
  pointer-events: none;
}

.video-card-media:hover img {
  filter: brightness(.86) saturate(1.15);
  transform: scale(1.035);
}

.play-button {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  padding-left: 3px;
  color: #fff;
  background: rgba(226, 20, 77, .92);
  border: 2px solid rgba(255, 255, 255, .88);
  border-radius: 50%;
  box-shadow: 0 5px 18px rgba(0, 0, 0, .5);
  transform: translate(-50%, -50%);
}

.hot-label {
  position: absolute;
  z-index: 3;
  top: 7px;
  left: 7px;
  padding: 3px 7px;
  color: #fff;
  background: #e2144d;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.rank-label {
  position: absolute;
  z-index: 3;
  top: 7px;
  left: 7px;
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 32px;
  padding-inline: 8px;
  color: #fff;
  background: linear-gradient(135deg, #ff285f, #8d082f);
  border: 1px solid rgba(255, 255, 255, .55);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .45);
  font-size: 13px;
  font-weight: 950;
}

.catalog-home {
  margin-top: 14px;
}

.home-discovery {
  margin-top: 46px;
  padding: 22px 24px;
  color: #a99ca3;
  background: #111014;
  border: 1px solid #30242b;
  border-left: 4px solid #8f0a34;
}

.home-discovery h2 {
  margin: 0 0 8px;
  color: #f4edf0;
  font-size: 18px;
}

.home-discovery p {
  max-width: 920px;
  margin: 0;
  font-size: 12px;
  line-height: 1.8;
}

.home-discovery nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.home-discovery nav a {
  padding: 7px 10px;
  color: #ff89a7;
  background: #21151b;
  border: 1px solid #472332;
  font-size: 11px;
  font-weight: 800;
}

.partner-rss {
  display: grid;
  grid-template-columns: minmax(150px, .55fr) minmax(0, 2fr);
  gap: 14px 28px;
  margin-top: 18px;
  padding: 18px 20px;
  color: #a99ca3;
  background: #0d0d0f;
  border: 1px solid #292126;
}

.partner-rss-heading span {
  color: #cf416a;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
}

.partner-rss-heading h2 {
  margin: 4px 0 0;
  color: #f4edf0;
  font-size: 16px;
}

.partner-rss ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.partner-rss li {
  min-width: 0;
  padding-bottom: 7px;
  border-bottom: 1px solid #231d20;
}

.partner-rss li a {
  display: block;
  overflow: hidden;
  color: #d8cbd1;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.partner-rss li a small {
  display: block;
  margin-bottom: 2px;
  color: #9b6575;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
}

.partner-rss > p { margin: 0; font-size: 12px; }
.partner-rss nav { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px; }
.partner-rss nav a { color: #ff89a7; font-size: 11px; }

.video-detail-summary {
  margin: -4px 0 18px;
  color: #c6b8be;
  font-size: 13px;
  line-height: 1.75;
}

.video-info {
  padding-top: 8px;
}

.card-tags {
  display: flex;
  gap: 5px;
  margin-bottom: 5px;
}

.video-card-topline {
  display: flex;
  gap: 7px;
  align-items: flex-start;
  justify-content: space-between;
}

.video-card-topline .card-tags { flex-wrap: wrap; }
.video-save-button { flex: 0 0 auto; min-height: 24px; padding: 3px 6px; }

.card-tags span,
.card-tags a {
  color: #ff789b;
  font-size: 9px;
  font-weight: 800;
}

.video-info h2 {
  min-height: 41px;
  margin-bottom: 7px;
  color: #f7f2f4;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.42;
}

.video-info h2 a:hover {
  color: #ff537f;
}

.video-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-top: 7px;
  border-top: 1px solid #292127;
}

.video-card-footer > span {
  color: #8f838a;
  font-size: 10px;
}

.video-card-footer .watch-full {
  padding: 7px 10px;
  color: #fff;
  background: #bb0d40;
  border-radius: 2px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.video-card-footer .watch-full:hover {
  color: #fff;
  background: #e2144d;
}

.video-card-footer .watch-full small {
  font-size: 7px;
  opacity: .72;
}

footer {
  padding-block: 22px;
  border-top: 3px solid #67142f;
}

@media (min-width: 1500px) {
  .poster-video-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .poster-video-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 92px; }
  .tube-site-header .site-header-inner { min-height: 52px; }
  .tube-site-header .wordmark small { display: none; }
  .tube-home { width: min(calc(100% - 12px), 1420px); }
  .tube-tools { grid-template-columns: 1fr; }
  .tube-categories { gap: 5px; }
  .tube-categories button { padding: 6px 12px; }
  .feed-heading { flex-wrap: wrap; }
  .feed-view-controls { width: 100%; margin-left: 0; overflow-x: auto; }
  .feed-view-controls select,
  .feed-view-controls button { flex: 0 0 auto; }
  .poster-video-grid { grid-template-columns: 1fr; gap: 28px; }
  .video-card-media { border-radius: 6px; }
  .play-button { width: 52px; height: 52px; font-size: 14px; }
  .video-info { padding: 10px 4px 0; }
  .video-info h2 { min-height: 0; font-size: 16px; line-height: 1.45; }
  .video-card-footer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(145px, .8fr); gap: 8px; }
  .video-card-footer .watch-full { display: grid; place-items: center; min-height: 46px; text-align: center; }
  .video-save-button { min-height: 34px; padding-inline: 10px; }
  .home-discovery { margin-top: 32px; padding: 16px; }
  .home-discovery h2 { font-size: 16px; }
  .partner-rss { grid-template-columns: 1fr; padding: 16px; }
  .partner-rss nav { grid-column: 1; }
}

@media (max-width: 360px) {
  .poster-video-grid { grid-template-columns: 1fr; }
  .video-info h2 { min-height: 0; font-size: 14px; }
}

@media (max-width: 720px) {
  .age-gate { place-items: end center; padding: 0; background: rgba(4, 4, 5, .9); }
  .age-gate-panel {
    width: 100%;
    max-width: none;
    padding: 24px 18px max(22px, env(safe-area-inset-bottom));
    border-top-width: 5px;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -18px 55px rgba(0, 0, 0, .5);
  }
  .age-gate h2 { margin: 10px 0 20px; font-size: clamp(24px, 7vw, 31px); line-height: 1.25; }
  .age-gate-confirm { min-height: 58px; font-size: 16px; }
  .age-gate-actions a { min-height: 44px; }
  .tube-site-header { position: sticky; z-index: 70; top: 0; }
  .tube-site-header nav { padding-inline: 4px; scroll-snap-type: x proximity; }
  .tube-site-header nav a { min-height: 42px; scroll-snap-align: start; }
  .feed-heading { position: sticky; z-index: 20; top: 93px; margin-inline: -6px; box-shadow: 0 8px 18px rgba(0, 0, 0, .32); }
  .preference-finder { padding: 16px 10px; }
  .preference-heading { gap: 8px; }
  .preference-result-copy { padding: 20px 14px; }
}

.video-detail-page {
  width: min(calc(100% - 24px), 1080px);
  margin: 18px auto 60px;
}

.video-breadcrumb {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
  color: #887b82;
  font-size: 11px;
}

.video-breadcrumb a { color: #e14a72; }

.video-detail-card {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr);
  gap: 24px;
  padding: 18px;
  background: #111014;
  border: 1px solid #33252d;
}

.video-detail-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #000;
}

.video-detail-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-detail-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.video-detail-copy h1 {
  margin: 4px 0 22px;
  color: #fff;
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.35;
}

.video-detail-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 18px;
}

.video-detail-stats div {
  min-width: 0;
  padding: 9px 10px;
  background: #191419;
  border: 1px solid #3c2b34;
}

.video-detail-stats dt { color: #a88f9a; font-size: 9px; }
.video-detail-stats dd {
  margin: 3px 0 0;
  overflow: hidden;
  color: #f4edf0;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-detail-actions {
  display: grid;
  gap: 8px;
}

.video-detail-actions a {
  display: grid;
  place-items: center;
  min-height: 48px;
  color: #fff;
  background: #2b2529;
  border: 1px solid #4a3942;
  font-size: 13px;
  font-weight: 900;
}

.video-detail-actions button {
  min-height: 42px;
  color: #d8cdd2;
  background: #171217;
  border: 1px solid #4a3942;
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
}

.video-detail-actions button[aria-pressed="true"] {
  color: #fff;
  background: #7f1734;
  border-color: #d72a59;
}

.video-detail-actions .detail-affiliate {
  background: #ca1045;
  border-color: #e2144d;
}

.video-detail-actions small { margin-left: 5px; font-size: 8px; opacity: .72; }

.video-detail-genre-link {
  margin-top: 12px;
  color: #ff6e94;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.video-neighbors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.video-neighbors a {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px 15px;
  background: #141115;
  border: 1px solid #33252d;
}

.video-neighbors a:last-child { text-align: right; }
.video-neighbors span { color: #ff638c; font-size: 9px; font-weight: 900; }
.video-neighbors strong {
  overflow: hidden;
  color: #e8dde2;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.related-videos { margin-top: 28px; }
.related-videos h2 { padding-bottom: 8px; border-bottom: 3px solid #7f062b; font-size: 19px; }
.related-video-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.related-video-grid a { display: grid; gap: 7px; }
.related-video-grid img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.related-video-grid span { color: #ff6b91; font-size: 8px; font-weight: 900; }
.related-video-grid strong { color: #ddd; font-size: 11px; line-height: 1.45; }
.detail-popular-videos { padding-top: 24px; border-top: 1px solid #32252c; }

@media (max-width: 760px) {
  .video-detail-card { grid-template-columns: 1fr; padding: 10px; }
  .video-detail-copy h1 { margin-bottom: 14px; font-size: 23px; }
  .video-detail-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .video-detail-stats div:last-child { grid-column: 1 / -1; }
  .video-neighbors { grid-template-columns: 1fr; }
  .video-neighbors a:last-child { text-align: left; }
  .related-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Video-first catalog and detail pages */
.catalog-header {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  padding: 10px 12px;
  background: linear-gradient(90deg, #7f062b, #2b111d 62%, transparent);
  border-left: 4px solid #ff2b61;
}

.catalog-header h1 {
  margin: 0;
  color: #fff;
  font-size: clamp(20px, 2.6vw, 30px);
  line-height: 1.2;
}

.catalog-header nav {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.catalog-header nav::-webkit-scrollbar { display: none; }
.catalog-header nav a {
  flex: 0 0 auto;
  padding: 7px 10px;
  color: #d9c9d0;
  background: rgba(15, 10, 13, .68);
  border: 1px solid #54303f;
  font-size: 10px;
  font-weight: 900;
}

.catalog-header nav a:hover { color: #fff; border-color: #ef2b60; }

.catalog-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(280px, .65fr);
  min-height: 390px;
  overflow: hidden;
  background: #110e11;
  border: 1px solid #3a2630;
  box-shadow: 0 14px 42px rgba(0, 0, 0, .28);
}

.catalog-feature-media {
  position: relative;
  display: block;
  min-height: 390px;
  overflow: hidden;
  background: #000;
}

.catalog-feature-media::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .55));
  pointer-events: none;
}

.catalog-feature-media img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 390px;
  object-fit: cover;
  transition: filter .25s ease, transform .25s ease;
}

.catalog-feature-media:hover img { filter: brightness(.82) saturate(1.12); transform: scale(1.018); }
.catalog-feature-label {
  position: absolute;
  z-index: 3;
  top: 14px;
  left: 14px;
  padding: 7px 11px;
  color: #fff;
  background: linear-gradient(135deg, #ff245c, #92072f);
  border: 1px solid rgba(255, 255, 255, .58);
  box-shadow: 0 5px 18px rgba(0, 0, 0, .42);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .04em;
}

.catalog-feature-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(24px, 3.2vw, 44px);
}

.catalog-feature-kicker {
  margin-bottom: 9px;
  color: #ff5b83;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .2em;
}

.catalog-feature-copy h2 {
  margin: 5px 0 10px;
  color: #fff;
  font-size: clamp(23px, 2.8vw, 38px);
  line-height: 1.32;
}

.catalog-feature-copy > p { margin: 0 0 20px; color: #9b8c93; font-size: 11px; }
.catalog-feature-actions { display: grid; gap: 8px; margin-top: auto; }
.catalog-feature-actions a {
  display: grid;
  place-items: center;
  min-height: 48px;
  color: #fff;
  background: #2b2227;
  border: 1px solid #503540;
  font-size: 12px;
  font-weight: 950;
}

.catalog-feature-actions a:hover { color: #fff; background: #3a2931; }
.catalog-feature-actions .catalog-feature-affiliate { background: #c70f43; border-color: #ec2058; }
.catalog-feature-actions .catalog-feature-affiliate:hover { background: #e2144d; }
.catalog-feature-actions small { margin-left: 5px; font-size: 8px; opacity: .72; }

.catalog-feed-section,
.catalog-related-section { margin-top: 30px; }
.catalog-related-section { padding-top: 24px; border-top: 1px solid #35232c; }
.catalog-home .feed-heading h2 { margin: 0; color: #fff; font-size: 20px; letter-spacing: -.02em; }
.catalog-home .feed-heading h2 + span { color: #d8bdc7; }

.video-detail-media { display: block; }
.video-detail-media::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .72));
  pointer-events: none;
}
.video-detail-media:hover img { filter: brightness(.83) saturate(1.1); }
.video-detail-play-label {
  position: absolute;
  z-index: 3;
  right: 14px;
  bottom: 12px;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

@media (max-width: 900px) {
  .catalog-feature { grid-template-columns: 1fr; }
  .catalog-feature-media,
  .catalog-feature-media img { min-height: 0; aspect-ratio: 16 / 9; }
  .catalog-feature-copy { padding: 22px; }
  .catalog-feature-actions { grid-template-columns: 1fr 1fr; margin-top: 6px; }
}

@media (max-width: 720px) {
  .catalog-header { align-items: flex-start; flex-direction: column; }
  .catalog-header nav { width: 100%; }
  .catalog-feature-copy h2 { font-size: 22px; }
  .catalog-feature-actions { grid-template-columns: 1fr; }
  .catalog-home .poster-video-grid { grid-template-columns: 1fr; gap: 24px; }
  .catalog-home .video-info h2 { min-height: 0; font-size: 15px; }
  .catalog-feed-section,
  .catalog-related-section { margin-top: 24px; }
}

/* Full-production video detail pages */
.video-detail-page {
  position: relative;
  isolation: isolate;
  width: min(calc(100% - 28px), 1420px);
  margin: 16px auto 72px;
}

.video-detail-page::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle at 14% 10%, rgba(188, 7, 58, .2), transparent 29%),
    radial-gradient(circle at 87% 38%, rgba(93, 19, 61, .18), transparent 33%),
    linear-gradient(180deg, #0b080b 0%, #050506 44%, #0b080b 100%);
  pointer-events: none;
}

.video-breadcrumb {
  display: flex;
  gap: 9px;
  align-items: center;
  min-height: 38px;
  margin-bottom: 10px;
  padding: 8px 12px;
  color: #71666c;
  background: rgba(17, 13, 16, .86);
  border: 1px solid #2b2026;
  font-size: 10px;
  font-weight: 800;
}

.video-breadcrumb a { color: #cdbcc4; }
.video-breadcrumb a:hover { color: #ff4e7d; }
.video-breadcrumb strong { color: #8e7d85; font-weight: 800; }

.video-detail-card {
  display: grid;
  grid-template-columns: minmax(0, 1.68fr) minmax(330px, .72fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
  background: linear-gradient(135deg, #151014, #09080a 70%);
  border: 1px solid #3b2630;
  border-top: 3px solid #e2144d;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .52), 0 0 0 1px rgba(255, 255, 255, .018) inset;
}

.video-detail-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 520px;
  overflow: hidden;
  background: #000;
}

.video-detail-atmosphere {
  position: absolute;
  inset: -12%;
  background-image: var(--detail-image);
  background-position: center;
  background-size: cover;
  filter: blur(42px) brightness(.48) saturate(1.18);
  opacity: .62;
  transform: scale(1.08);
}

.video-detail-visual::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  background: radial-gradient(circle at center, transparent 35%, rgba(0, 0, 0, .7) 100%);
  pointer-events: none;
}

.video-detail-media {
  position: relative;
  z-index: 1;
  display: block;
  width: calc(100% - clamp(28px, 4vw, 64px));
  aspect-ratio: 16 / 9;
  margin: clamp(14px, 2vw, 32px);
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 22px 65px rgba(0, 0, 0, .65);
}

.video-detail-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter .25s ease, transform .35s ease;
}

.video-detail-media:hover img { filter: brightness(.78) saturate(1.12); transform: scale(1.015); }

.video-sample-shell { isolation: isolate; }

.video-sample-activate {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  color: #fff;
  background: #000;
  border: 0;
  cursor: pointer;
  text-decoration: none;
}

.video-sample-external:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -4px;
}

.video-sample-activate::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .66));
  pointer-events: none;
}

.video-sample-embed iframe {
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  border: 0;
}

.video-sample-myfans {
  aspect-ratio: 4 / 5;
  max-height: min(78vh, 900px);
}

.video-sample-myfans iframe {
  color-scheme: dark;
}

.video-sample-native video {
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  object-fit: contain;
}

.video-sample-fallback-link {
  position: absolute;
  z-index: 4;
  right: 10px;
  bottom: 10px;
  padding: 7px 10px;
  color: #fff;
  background: rgba(8, 7, 8, .86);
  border: 1px solid rgba(255, 255, 255, .24);
  font-size: 10px;
  font-weight: 850;
}

.resilient-poster-fallback {
  display: flex;
  width: 100%;
  height: 100%;
  min-height: 80px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  background:
    radial-gradient(circle at 50% 20%, rgba(239, 29, 87, .28), transparent 44%),
    linear-gradient(145deg, #20131a, #080708 72%);
  border: 1px solid rgba(255, 255, 255, .08);
  letter-spacing: .12em;
}

.resilient-poster-fallback strong { font-size: clamp(20px, 4vw, 42px); }
.resilient-poster-fallback small { margin-top: 4px; color: #bdaeb5; font-size: 8px; font-weight: 900; }

.nightindex-embed {
  min-height: 100vh;
  padding: 10px;
  color: #f8f2f5;
  background: #080708;
}

.nightindex-embed header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  color: #bfaeb6;
  font-size: 10px;
}

.nightindex-embed header strong { color: #ff356a; letter-spacing: .1em; }
.nightindex-embed-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nightindex-embed-grid a { min-width: 0; color: #fff; text-decoration: none; }
.nightindex-embed-media { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #140d11; }
.nightindex-embed-media img { width: 100%; height: 100%; object-fit: cover; }
.nightindex-embed-media i {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  color: #fff;
  background: rgba(226, 20, 77, .92);
  border-radius: 50%;
  font-size: 9px;
  font-style: normal;
}
.nightindex-embed-grid b { display: -webkit-box; margin-top: 6px; overflow: hidden; font-size: 11px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

.partner-vertical-shell {
  min-height: 100svh;
  margin: 0;
  color: #fff;
  background: #080708;
}

.partner-vertical-feed {
  height: 100svh;
  overflow-y: auto;
  background: #080708;
  scroll-snap-type: y mandatory;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}

.partner-vertical-feed::-webkit-scrollbar { display: none; }

.partner-vertical-card {
  position: relative;
  display: grid;
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  place-items: center;
  background: #080708;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.partner-vertical-media {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}

.partner-vertical-media .video-detail-media {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  border: 0;
}

.partner-vertical-media .video-sample-shell iframe,
.partner-vertical-media .video-sample-shell video,
.partner-vertical-media .video-sample-shell img,
.partner-vertical-media .video-sample-activate {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.partner-vertical-media .video-sample-fallback-link { display: none; }

.partner-vertical-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .48), transparent 22%, transparent 52%, rgba(0, 0, 0, .92));
  pointer-events: none;
}

.partner-vertical-brand {
  position: absolute;
  z-index: 4;
  top: 14px;
  right: 14px;
  left: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  letter-spacing: .08em;
  text-shadow: 0 2px 12px #000;
}

.partner-vertical-brand b { color: #ff315f; }
.partner-vertical-brand span { color: #e5d9dd; }

.partner-vertical-copy {
  position: absolute;
  z-index: 4;
  right: 16px;
  bottom: 24px;
  left: 16px;
  display: grid;
  gap: 8px;
}

.partner-vertical-copy p { margin: 0; color: #ff7d9f; font-size: 10px; font-weight: 900; }
.partner-vertical-copy h2 { margin: 0; max-width: 92%; font-size: clamp(19px, 6vw, 28px); line-height: 1.16; text-shadow: 0 2px 14px #000; }
.partner-vertical-copy a {
  justify-self: start;
  margin-top: 4px;
  padding: 11px 15px;
  color: #fff;
  background: #d8174c;
  font-size: 12px;
  font-weight: 950;
  text-decoration: none;
}
.partner-vertical-copy a small { margin-left: 5px; font-size: 8px; }

.partner-vertical-swipe {
  position: absolute;
  z-index: 4;
  right: 12px;
  bottom: 28px;
  color: rgba(255, 255, 255, .68);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
  writing-mode: vertical-rl;
}

.video-sample-static::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 58%, rgba(0, 0, 0, .58));
  pointer-events: none;
}

.video-detail-source-label {
  position: absolute;
  z-index: 3;
  top: 12px;
  left: 12px;
  padding: 6px 9px;
  color: #fff;
  background: rgba(7, 7, 8, .8);
  border-left: 3px solid #ff245c;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .08em;
}

.video-detail-media .play-button {
  width: 66px;
  height: 66px;
  background: rgba(221, 18, 72, .94);
  border: 2px solid rgba(255, 255, 255, .78);
  box-shadow: 0 12px 35px rgba(138, 0, 38, .48);
  font-size: 18px;
}

.video-detail-play-label {
  right: 16px;
  bottom: 14px;
  padding: 5px 8px;
  background: rgba(0, 0, 0, .68);
  font-size: 10px;
  letter-spacing: .05em;
}

.video-detail-play-label small {
  margin-left: 5px;
  color: #ffd2de;
  font-size: 8px;
}

.video-detail-copy {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: clamp(28px, 3vw, 52px);
  background:
    linear-gradient(155deg, rgba(42, 19, 30, .92), rgba(14, 11, 14, .97) 62%),
    #100d0f;
  border-left: 1px solid #422a35;
}

.video-detail-copy::before {
  position: absolute;
  top: 0;
  right: 0;
  width: 110px;
  height: 110px;
  content: "";
  background: linear-gradient(135deg, transparent 49%, rgba(226, 20, 77, .14) 50%);
  pointer-events: none;
}

.video-detail-kicker {
  margin-bottom: 14px;
  color: #796a71;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .2em;
}

.video-detail-kicker span {
  display: inline-block;
  margin-right: 7px;
  padding: 4px 7px;
  color: #fff;
  background: #b90d3e;
  letter-spacing: .1em;
}

.video-detail-copy .card-tags { margin-bottom: 10px; }
.video-detail-copy .card-tags span { padding: 4px 8px; background: #24161d; border: 1px solid #512739; }

.video-detail-copy h1 {
  margin: 0 0 22px;
  color: #fff;
  font-size: clamp(25px, 2.5vw, 40px);
  line-height: 1.28;
  letter-spacing: -.035em;
}

.video-detail-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 0 0 18px;
}

.video-detail-stats div {
  min-width: 0;
  padding: 10px 11px;
  background: rgba(255, 255, 255, .035);
  border: 1px solid #3b2a32;
}

.video-detail-stats div:only-child { grid-column: 1 / -1; }
.video-detail-stats dt { color: #9c8a92; font-size: 8px; font-weight: 900; letter-spacing: .06em; }
.video-detail-stats dd { margin-top: 4px; color: #f5edf0; font-size: 11px; }

.video-detail-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.video-detail-actions a,
.video-detail-actions button {
  min-height: 46px;
  border-radius: 2px;
  font-size: 11px;
  letter-spacing: .015em;
}

.video-detail-actions .detail-affiliate {
  display: flex;
  grid-column: 1 / -1;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 18px;
  background: linear-gradient(135deg, #f31d57, #b50738);
  border: 1px solid #ff4e7c;
  box-shadow: 0 10px 30px rgba(168, 0, 45, .26);
  font-size: 16px;
}

.video-detail-actions .detail-affiliate:hover { color: #fff; background: linear-gradient(135deg, #ff356a, #cf0d43); }
.video-detail-actions .detail-affiliate small { margin: 0; font-size: 8px; letter-spacing: .06em; }
.video-detail-actions button { color: #cfc2c8; background: #181317; border-color: #47343d; }

.revenue-goal {
  margin: 18px 0;
  padding: 18px;
  color: #f8edf1;
  background: linear-gradient(135deg, #29101a, #100d10 68%);
  border: 1px solid #5c2033;
  border-top: 3px solid #e2144d;
}

.revenue-goal header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.revenue-goal header span { color: #e87091; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.revenue-goal h2 { margin: 0; font-size: 20px; }
.revenue-goal > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.revenue-goal article { padding: 12px; background: rgba(255, 255, 255, .04); border: 1px solid #422631; }
.revenue-goal article span { display: block; color: #ad929c; font-size: 9px; }
.revenue-goal article strong { display: block; margin-top: 5px; font-size: clamp(18px, 2vw, 28px); }
.revenue-goal article small { margin-left: 3px; font-size: 9px; }
.revenue-goal p { margin: 12px 0 0; color: #c5abb5; font-size: 11px; }

@media (max-width: 720px) {
  .revenue-goal > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.video-detail-share {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
}

.video-detail-share > span {
  margin-right: auto;
  color: #8f7f86;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
}

.video-detail-share a {
  display: inline-grid;
  place-items: center;
  min-height: 32px;
  padding: 6px 10px;
  color: #ddd;
  background: #211a1e;
  border: 1px solid #49333d;
  border-radius: 2px;
  font-size: 9px;
  font-weight: 900;
}

.video-detail-share a:last-child { color: #dff4ff; background: #073c5d; border-color: #126997; }

.video-detail-pr-note {
  margin: 10px 0 0;
  color: #74676d;
  font-size: 8px;
  text-align: center;
}

.video-detail-genre-link {
  margin-top: 15px;
  color: #ff658e;
  font-size: 10px;
  letter-spacing: .02em;
}

.video-neighbors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.video-neighbors a {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 13px;
  align-items: center;
  min-width: 0;
  padding: 0 14px 0 0;
  overflow: hidden;
  background: linear-gradient(90deg, #171216, #0f0d0f);
  border: 1px solid #32242b;
  transition: border-color .2s ease, transform .2s ease;
}

.video-neighbors a:hover { color: inherit; border-color: #843047; transform: translateY(-2px); }
.video-neighbors img { display: block; width: 116px; height: 68px; object-fit: cover; }
.video-neighbors a:last-child { padding: 0 14px 0 0; text-align: left; }
.video-neighbors span { display: flex; flex-direction: column; gap: 5px; min-width: 0; color: inherit; }
.video-neighbors small { color: #ff4976; font-size: 8px; font-weight: 950; letter-spacing: .14em; }
.video-neighbors strong { color: #e8dfe3; font-size: 11px; line-height: 1.35; }

.related-videos {
  margin-top: 30px;
  padding: clamp(18px, 2vw, 28px);
  background: rgba(14, 11, 13, .9);
  border: 1px solid #2e2228;
  border-top: 3px solid #79102f;
}

.related-videos h2 {
  margin-bottom: 16px;
  padding: 0;
  color: #fff;
  border: 0;
  font-size: 20px;
  letter-spacing: -.02em;
}

.related-videos h2::before { margin-right: 8px; color: #ff2b61; content: "■"; font-size: 10px; vertical-align: 3px; }
.related-video-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 10px; }

.related-video-grid a {
  display: grid;
  gap: 0;
  min-width: 0;
  padding-bottom: 11px;
  overflow: hidden;
  background: #161216;
  border: 1px solid #30242a;
  transition: border-color .2s ease, transform .2s ease;
}

.related-video-grid a:hover { color: inherit; border-color: #8f2848; transform: translateY(-3px); }
.related-video-media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #000; }
.related-video-grid .related-video-media img { width: 100%; height: 100%; object-fit: cover; transition: filter .2s ease, transform .3s ease; }
.related-video-grid a:hover img { filter: brightness(.82) saturate(1.08); transform: scale(1.025); }
.related-video-media small {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  color: #fff;
  background: rgba(213, 18, 70, .88);
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 50%;
  font-size: 9px;
  opacity: 0;
  transform: translate(-50%, -42%);
  transition: opacity .2s ease, transform .2s ease;
}

.related-video-grid a:hover .related-video-media small { opacity: 1; transform: translate(-50%, -50%); }
.related-video-grid span.related-video-meta { padding: 9px 10px 4px; color: #ff678e; font-size: 8px; font-weight: 950; }
.related-video-grid strong { padding: 0 10px; color: #e8e0e3; font-size: 11px; line-height: 1.45; }
.detail-popular-videos { padding-top: clamp(18px, 2vw, 28px); border-top: 3px solid #79102f; }

.detail-sticky-affiliate {
  position: fixed;
  z-index: 90;
  right: 18px;
  bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-width: 270px;
  min-height: 58px;
  padding: 10px 16px;
  color: #fff;
  background: linear-gradient(135deg, #f31d57, #a60734);
  border: 1px solid #ff5b87;
  border-radius: 3px;
  box-shadow: 0 14px 38px rgba(0, 0, 0, .58), 0 7px 24px rgba(191, 0, 51, .34);
  font-size: 15px;
  font-weight: 950;
}

.detail-sticky-affiliate:hover { color: #fff; background: linear-gradient(135deg, #ff356a, #c90b42); }
.detail-sticky-affiliate small { color: #ffd9e3; font-size: 8px; font-weight: 850; letter-spacing: .05em; }

@media (max-width: 1040px) {
  .video-detail-card { grid-template-columns: 1fr; }
  .video-detail-visual { min-height: 0; }
  .video-detail-copy { border-top: 1px solid #422a35; border-left: 0; }
  .related-video-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .video-detail-page { width: min(calc(100% - 12px), 1420px); margin-top: 8px; padding-bottom: 78px; }
  .video-breadcrumb { margin-bottom: 6px; padding-inline: 9px; overflow: hidden; white-space: nowrap; }
  .video-detail-card { border-right: 0; border-left: 0; }
  .video-detail-media { width: calc(100% - 16px); margin: 8px; }
  .video-detail-media .play-button { width: 50px; height: 50px; font-size: 13px; }
  .video-detail-source-label { top: 8px; left: 8px; }
  .video-detail-copy { padding: 22px 16px 20px; }
  .video-detail-copy h1 { margin-bottom: 17px; font-size: 23px; }
  .video-detail-actions { grid-template-columns: 1fr; }
  .video-detail-actions .detail-affiliate { grid-column: auto; }
  .video-neighbors { grid-template-columns: 1fr; }
  .video-neighbors a,
  .video-neighbors a:last-child { grid-template-columns: 100px minmax(0, 1fr); padding-right: 10px; text-align: left; }
  .video-neighbors img { width: 100px; height: 62px; }
  .related-videos { margin-top: 20px; padding: 14px 10px 16px; }
  .related-videos h2 { margin-bottom: 12px; font-size: 17px; }
  .related-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 6px; }
  .related-video-grid strong { font-size: 10px; }
  .detail-sticky-affiliate {
    right: 8px;
    bottom: max(8px, env(safe-area-inset-bottom));
    left: 8px;
    min-width: 0;
    min-height: 58px;
  }
}

/* Quick-pick conversion strip */
.spotlight-picks { margin-bottom: 30px; }
.telegram-follow-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -16px 0 24px;
  padding: 13px 15px;
  color: #eefaff;
  background: linear-gradient(110deg, #0f2632, #0c151a);
  border: 1px solid #28556b;
  border-left: 4px solid #229ed9;
}
.telegram-follow-strip > div { display: grid; gap: 2px; }
.telegram-follow-strip span { color: #61c8f8; font-size: 8px; font-weight: 950; letter-spacing: .16em; }
.telegram-follow-strip strong { color: #fff; font-size: 13px; }
.telegram-follow-strip > a { flex: 0 0 auto; padding: 9px 12px; color: #fff; background: #168ac1; font-size: 10px; font-weight: 900; }
.telegram-follow-strip > a:hover { color: #fff; background: #229ed9; }
.spotlight-picks > header { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.spotlight-picks > header span { color: #ff315f; font-size: 9px; font-weight: 900; letter-spacing: .18em; }
.spotlight-picks > header h2 { margin: 2px 0 0; color: #fff; font-size: clamp(24px, 3vw, 36px); line-height: 1.1; }
.spotlight-picks > header .spotlight-refresh-note { display: block; margin-top: 4px; color: #888; font-size: 9px; font-weight: 700; }
.spotlight-picks > header > a { color: #aaa; font-size: 11px; font-weight: 700; }
.spotlight-picks > header > a:hover { color: #ff5f84; }
.spotlight-grid { display: grid; grid-template-columns: 1.45fr 1fr 1fr; gap: 10px; }
.spotlight-card { min-width: 0; overflow: hidden; background: #151515; border: 1px solid #2f2f2f; border-radius: 4px; }
.spotlight-media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #000; }
.spotlight-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 54%, rgba(0, 0, 0, .72)); pointer-events: none; }
.spotlight-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter .2s ease, transform .3s ease; }
.spotlight-card:hover .spotlight-media img { filter: brightness(.8) saturate(1.1); transform: scale(1.018); }
.spotlight-media .play-button { z-index: 2; width: 48px; height: 48px; background: rgba(222, 25, 76, .92); border: 1px solid rgba(255, 255, 255, .65); font-size: 13px; }
.spotlight-rank { position: absolute; z-index: 2; top: 10px; left: 10px; padding: 4px 7px; color: #fff; background: rgba(0, 0, 0, .76); border-left: 3px solid #ff315f; font-size: 10px; font-weight: 900; }
.spotlight-copy { padding: 12px; }
.spotlight-decision { display: flex; align-items: center; gap: 7px; margin-bottom: 9px; }
.spotlight-decision strong { padding: 4px 6px; color: #fff; background: #b20e3c; font-size: 8px; letter-spacing: .06em; }
.spotlight-decision span { overflow: hidden; color: #9d9598; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.spotlight-tags { margin-top: 0; }
.spotlight-copy h2 { min-height: 2.9em; margin: 8px 0 12px; color: #f2f2f2; font-size: 14px; line-height: 1.45; }
.spotlight-card-main .spotlight-copy h2 { font-size: 17px; }
.spotlight-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.spotlight-actions a { display: grid; place-items: center; min-height: 36px; padding: 7px; color: #ddd; background: #242424; border: 1px solid #363636; border-radius: 2px; font-size: 10px; font-weight: 800; }
.spotlight-actions a:last-child { color: #fff; background: #cf1845; border-color: #e93965; }
.spotlight-actions small { font-size: 7px; }

@media (max-width: 900px) {
  .spotlight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spotlight-card-main { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .telegram-follow-strip { align-items: stretch; flex-direction: column; gap: 9px; margin-top: -18px; padding: 12px; }
  .telegram-follow-strip > a { text-align: center; }
  .spotlight-picks > header { align-items: center; }
  .spotlight-grid { grid-template-columns: 1fr; }
  .spotlight-card-main { grid-column: auto; }
  .spotlight-copy h2,
  .spotlight-card-main .spotlight-copy h2 { min-height: 0; font-size: 14px; }
}

@media (max-width: 420px) {
  .header-social-links { gap: 4px; }
  .tube-site-header .header-x-link,
  .tube-site-header .header-bsky-link,
  .tube-site-header .header-telegram-link { padding: 6px 7px; font-size: 9px; }
  .video-detail-share { align-items: stretch; display: grid; grid-template-columns: 1fr 1fr; }
  .video-detail-share > span { grid-column: 1 / -1; }
}

/* Private revenue control */
.admin-shell {
  min-height: 100svh;
  padding: clamp(20px, 4vw, 56px);
  color: #f4eef0;
  background:
    radial-gradient(circle at 88% 0%, rgba(162, 16, 59, .24), transparent 30%),
    linear-gradient(145deg, #080708, #120c0f 58%, #090809);
}

.admin-access-card {
  display: grid;
  gap: 18px;
  width: min(100%, 520px);
  margin: 12vh auto 0;
  padding: clamp(24px, 5vw, 48px);
  background: rgba(18, 14, 16, .96);
  border: 1px solid #4a2734;
  border-top: 3px solid #e51d54;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}

.admin-access-card > span,
.revenue-dashboard span,
.revenue-dashboard-header span { color: #ff3a6c; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.admin-access-card h1 { margin: 0; font-size: clamp(25px, 4vw, 40px); line-height: 1.18; }
.admin-access-card p { margin: 0; color: #aaa0a4; font-size: 13px; line-height: 1.7; }
.admin-access-card label { display: grid; gap: 8px; color: #bdb3b7; font-size: 11px; font-weight: 800; }
.admin-access-card input { min-height: 48px; padding: 0 13px; color: #fff; background: #0a090a; border: 1px solid #56303e; border-radius: 2px; }
.admin-access-card button,
.admin-access-card a { display: grid; place-items: center; min-height: 48px; padding: 11px 16px; color: #fff; background: #cf1748; border: 1px solid #ef3a69; border-radius: 2px; font-size: 12px; font-weight: 900; }

.revenue-dashboard { width: min(100%, 1440px); margin: 0 auto; }
.revenue-dashboard-header { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.revenue-dashboard-header h1 { margin: 4px 0 0; font-size: clamp(30px, 5vw, 58px); letter-spacing: -.055em; }
.revenue-dashboard-header > div:last-child { display: grid; justify-items: end; gap: 8px; }
.revenue-dashboard-header small { color: #8f8589; }
.revenue-dashboard-header a { padding: 8px 12px; color: #ddd2d6; border: 1px solid #492b36; font-size: 10px; font-weight: 900; }

.revenue-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-bottom: 12px; }
.revenue-kpis article { display: grid; gap: 12px; min-width: 0; padding: 18px; background: rgba(22, 16, 19, .94); border: 1px solid #35242a; }
.revenue-kpis article:first-child { border-top: 3px solid #e51d54; }
.revenue-kpis span { color: #93898d; letter-spacing: .12em; }
.revenue-kpis strong { overflow: hidden; color: #fff; font-size: clamp(22px, 3vw, 36px); letter-spacing: -.04em; text-overflow: ellipsis; }
.revenue-kpis small { margin-left: 5px; color: #8f8589; font-size: 9px; letter-spacing: .04em; }

.growth-control { margin: 12px 0; padding: clamp(18px, 2.5vw, 30px); background: rgba(18, 14, 16, .95); border: 1px solid #4a2834; }
.growth-control > header { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.growth-control h2 { margin: 4px 0 0; font-size: 23px; }
.growth-control > header p { max-width: 620px; margin: 0; color: #9e9297; font-size: 10px; line-height: 1.7; text-align: right; }
.growth-control-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.growth-control article { display: grid; gap: 13px; padding: 16px; background: #0d0b0c; border: 1px solid #32232a; border-top: 3px solid #71505c; }
.growth-control article[data-decision="scale"] { border-top-color: #32c483; }
.growth-control article[data-decision="fix_conversion"] { border-top-color: #ffb24a; }
.growth-control article[data-decision="fix_acquisition"] { border-top-color: #ff426d; }
.growth-control article > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.growth-control article > div:first-child span { color: #8f8589; }
.growth-control article > div:first-child strong { color: #f4edef; font-size: 14px; }
.growth-control article > b { color: #fff; font-size: 20px; letter-spacing: -.03em; }
.growth-control dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin: 0; }
.growth-control dl div { padding: 8px; background: rgba(255, 255, 255, .035); }
.growth-control dt { color: #81767b; font-size: 8px; }
.growth-control dd { margin: 5px 0 0; color: #e9e1e4; font-size: 15px; font-weight: 900; }
.growth-control article p { margin: 0; color: #afa3a8; font-size: 10px; line-height: 1.65; }

.revenue-import,
.revenue-table-card { margin-top: 12px; padding: clamp(18px, 2.5vw, 30px); background: rgba(18, 14, 16, .95); border: 1px solid #35242a; }
.revenue-import { display: grid; grid-template-columns: minmax(220px, 1.5fr) 220px 180px; align-items: end; gap: 16px; }
.revenue-import h2,
.revenue-table-card h2 { margin: 4px 0 6px; font-size: 21px; }
.revenue-import p { margin: 0; color: #93898d; font-size: 11px; }
.revenue-import label { display: grid; gap: 7px; color: #a79da1; font-size: 9px; font-weight: 900; }
.revenue-import input { min-height: 42px; padding: 8px 10px; color: #eee; background: #090809; border: 1px solid #48303a; }
.revenue-file { position: relative; display: grid; place-items: center; min-height: 42px; padding: 8px 12px; color: #fff !important; background: #332029; border: 1px solid #5d3342; cursor: pointer; }
.revenue-file input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.revenue-import-status { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid #302228; }
.revenue-import-status > span { color: #aca2a6; letter-spacing: normal; }
.revenue-import-status button { min-height: 40px; padding: 8px 22px; color: #fff; background: #cf1748; border: 1px solid #ed3c6b; font-weight: 900; }
.revenue-import-status button:disabled { cursor: not-allowed; opacity: .35; }
.revenue-import > p[role="status"] { grid-column: 1 / -1; margin: 0; color: #ff7699; font-size: 11px; }

.revenue-table-card > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.revenue-table-card > header small { color: #80767a; font-size: 9px; }
.revenue-table-scroll { overflow-x: auto; }
.revenue-table-card table { width: 100%; min-width: 1040px; border-collapse: collapse; }
.revenue-table-card th { padding: 10px; color: #7f7479; border-bottom: 1px solid #46303a; font-size: 8px; text-align: right; letter-spacing: .08em; white-space: nowrap; }
.revenue-table-card th:first-child { text-align: left; }
.revenue-table-card td { padding: 10px; color: #c9bfc3; border-bottom: 1px solid #2a2024; font-size: 10px; text-align: right; white-space: nowrap; }
.revenue-table-card td:first-child { display: grid; grid-template-columns: 28px 82px minmax(220px, 1fr); align-items: center; gap: 10px; text-align: left; white-space: normal; }
.revenue-table-card td img { width: 82px; aspect-ratio: 16 / 9; object-fit: cover; }
.revenue-table-card td > div { display: grid; gap: 5px; }
.revenue-table-card td > div strong { color: #f2eaed; font-size: 10px; line-height: 1.4; }
.revenue-table-card td > div small { color: #8c8185; font-size: 8px; }
.revenue-table-card td:last-child strong { color: #ff5e86; }
.revenue-rank { color: #815264 !important; font-size: 10px !important; letter-spacing: .06em !important; }

@media (max-width: 900px) {
  .revenue-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .growth-control-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .revenue-import { grid-template-columns: 1fr 1fr; }
  .revenue-import > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .admin-shell { padding: 16px 10px 30px; }
  .revenue-dashboard-header { align-items: start; }
  .revenue-dashboard-header > div:last-child { display: none; }
  .revenue-kpis { gap: 6px; }
  .revenue-kpis article { padding: 14px 12px; }
  .revenue-kpis strong { font-size: 21px; }
  .growth-control > header { align-items: start; flex-direction: column; }
  .growth-control > header p { text-align: left; }
  .growth-control-grid { grid-template-columns: 1fr; }
  .revenue-import { grid-template-columns: 1fr; }
  .revenue-import > div:first-child,
  .revenue-import-status { grid-column: auto; }
  .revenue-import-status { align-items: stretch; flex-direction: column; }
  .revenue-import-status button { width: 100%; }
}

/* English discovery pages */
.en-site { min-height: 100svh; color: #ece7e9; background: #080708; }
.en-header,
.en-footer { border-color: #35232a; background: #0d0b0c; }
.en-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: min(100% - 28px, 1380px); margin: 0 auto; padding: 15px 0; }
.en-header .wordmark { color: #fff; }
.en-header nav,
.en-footer nav { display: flex; flex-wrap: wrap; gap: 7px 18px; }
.en-header nav a,
.en-footer a { color: #aaa0a4; font-size: 11px; font-weight: 800; }
.en-header nav a:hover,
.en-footer a:hover { color: #ff4b78; }
.en-footer { display: grid; gap: 15px; padding: 28px max(14px, calc((100% - 1380px) / 2)); }
.en-footer small { color: #776e72; }
.en-page,
.en-detail-page { width: min(100% - 28px, 1380px); margin: 0 auto; padding: clamp(20px, 4vw, 58px) 0; }
.en-hero { display: grid; gap: 10px; max-width: 840px; margin-bottom: 28px; }
.en-hero > span,
.en-detail-copy > small { color: #ff416f; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.en-hero h1 { margin: 0; color: #fff; font-size: clamp(34px, 7vw, 76px); line-height: .98; letter-spacing: -.055em; }
.en-hero p { max-width: 680px; margin: 0; color: #a69ca0; line-height: 1.7; }
.en-category-nav { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 24px; }
.en-category-nav a { padding: 9px 13px; color: #e9e0e3; background: #1b1518; border: 1px solid #3b2730; font-size: 11px; font-weight: 850; }
.en-video-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.en-video-card { display: grid; min-width: 0; overflow: hidden; color: inherit; background: #141113; border: 1px solid #302128; }
.en-video-card:hover { color: inherit; border-color: #a51b45; transform: translateY(-2px); }
.en-video-media { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #000; }
.en-video-media img { width: 100%; height: 100%; object-fit: cover; }
.en-video-media span { position: absolute; right: 9px; bottom: 9px; display: grid; place-items: center; width: 38px; height: 38px; color: #fff; background: #d6164b; border-radius: 50%; font-size: 9px; font-weight: 900; }
.en-video-copy { display: grid; gap: 8px; padding: 13px; }
.en-video-copy small { color: #ff5d86; font-size: 8px; font-weight: 900; }
.en-video-copy h2 { margin: 0; color: #f2ecee; font-size: 14px; line-height: 1.4; }
.en-video-copy p { margin: 0; color: #9b9195; font-size: 11px; line-height: 1.55; }
.en-detail-card { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr); background: #111; border: 1px solid #38242d; border-top: 3px solid #bb123f; }
.en-detail-media { min-width: 0; background: #000; }
.en-detail-copy { display: flex; flex-direction: column; gap: 14px; padding: clamp(22px, 3vw, 40px); border-left: 1px solid #38242d; }
.en-detail-copy h1 { margin: 0; color: #fff; font-size: clamp(24px, 3vw, 40px); line-height: 1.1; }
.en-detail-copy p { margin: 0; color: #a69da0; font-size: 12px; line-height: 1.7; }
.en-detail-copy > strong { color: #e8dfe2; font-size: 13px; }
.en-affiliate-link { display: grid; gap: 4px; margin-top: auto; padding: 14px; color: #fff; background: linear-gradient(135deg, #df194f, #9b0b32); border: 1px solid #ff4c7b; font-size: 13px; font-weight: 950; }
.en-affiliate-link:hover { color: #fff; }
.en-affiliate-link span { color: #ffd2de; font-size: 8px; }
.en-related { margin-top: 28px; }

/* Return notification and owner controls */
.push-opt-in { display: grid; gap: 8px; min-width: 250px; padding: 16px; background: linear-gradient(145deg, #181216, #100d0f); border: 1px solid #4d2a37; }
.push-opt-in > span,
.push-console header > span { color: #ff3a6c; font-size: 8px; font-weight: 950; letter-spacing: .18em; }
.push-opt-in > strong { color: #fff; font-size: 14px; }
.push-opt-in p { margin: 0; color: #958b8f; font-size: 9px; line-height: 1.55; }
.push-opt-in button,
.push-console button { min-height: 38px; padding: 8px 13px; color: #fff; background: #c81445; border: 1px solid #e93969; font-size: 10px; font-weight: 900; }
.push-opt-in button:disabled,
.push-console button:disabled { opacity: .45; }
.push-console { display: grid; gap: 14px; width: min(100%, 1440px); margin: 12px auto 0; padding: 22px; color: #eee; background: rgba(18, 14, 16, .95); border: 1px solid #35242a; }
.push-console h2 { margin: 3px 0 0; }
.push-console p { margin: 0; color: #9f9599; }
.push-console p strong { color: #fff; }
.push-console button { width: max-content; min-width: 180px; }
.push-console small { color: #ff789a; }

/* Public trend index and publisher kit */
.trend-page,
.citation-page { width: min(100% - 28px, 1240px); margin: 0 auto; padding: clamp(24px, 5vw, 70px) 0; }
.trend-hero,
.citation-page > header { display: grid; gap: 10px; max-width: 830px; margin-bottom: 30px; }
.trend-hero > span,
.citation-page > header > span,
.trend-partner-callout span { color: #ff3f6e; font-size: 9px; font-weight: 950; letter-spacing: .18em; }
.trend-hero h1,
.citation-page > header h1 { margin: 0; color: #fff; font-size: clamp(38px, 7vw, 78px); line-height: .98; letter-spacing: -.055em; }
.trend-hero p,
.citation-page > header p { margin: 0; color: #a69ca0; line-height: 1.7; }
.trend-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.trend-list li { display: grid; grid-template-columns: 64px 220px minmax(0, 1fr) 88px; align-items: center; gap: 16px; min-width: 0; padding: 9px; background: #131012; border: 1px solid #302128; }
.trend-rank { color: #6e4b58; font-size: 25px; text-align: center; }
.trend-list li:first-child { border-color: #9d183f; border-left: 4px solid #ef265c; }
.trend-list li:first-child .trend-rank { color: #ff416f; }
.trend-thumb { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #000; }
.trend-thumb img { width: 100%; height: 100%; object-fit: cover; }
.trend-thumb span { position: absolute; right: 7px; bottom: 7px; padding: 5px 8px; color: #fff; background: #cb1344; font-size: 8px; font-weight: 900; }
.trend-copy { min-width: 0; }
.trend-copy small { color: #ed5680; font-size: 8px; font-weight: 900; }
.trend-copy h2 { margin: 5px 0; font-size: 15px; line-height: 1.4; }
.trend-copy h2 a { color: #f1eaec; }
.trend-copy p { margin: 0; color: #8f8589; font-size: 9px; }
.trend-score { display: grid; justify-items: center; gap: 2px; padding: 10px; background: #090809; }
.trend-score span { color: #8d7d83; font-size: 7px; font-weight: 900; letter-spacing: .14em; }
.trend-score strong { color: #ff3b6b; font-size: 25px; }
.trend-partner-callout { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 22px; padding: clamp(20px, 3vw, 34px); background: linear-gradient(135deg, #1c1116, #0f0c0d); border: 1px solid #512a39; border-top: 3px solid #b81443; }
.trend-partner-callout h2 { margin: 5px 0 0; color: #fff; }
.trend-partner-callout a { padding: 11px 15px; color: #fff; background: #c91546; font-size: 11px; font-weight: 900; white-space: nowrap; }
.citation-page { max-width: 980px; }
.citation-page section { margin-top: 8px; padding: clamp(18px, 3vw, 30px); background: #131012; border: 1px solid #35242a; }
.citation-page section h2 { margin: 0 0 10px; color: #fff; }
.citation-page section p,
.citation-page section li { color: #a69da0; font-size: 12px; line-height: 1.7; }
.citation-page pre { max-width: 100%; overflow-x: auto; padding: 14px; color: #f7c9d5; background: #080708; border: 1px solid #3d2730; font-size: 10px; white-space: pre-wrap; word-break: break-all; }
.citation-page section a { color: #ff5c84; }

/* Embeddable widget: isolated and intentionally compact. */
.trend-embed { min-height: 100svh; padding: 10px; color: #eee; background: #090809; font-family: Arial, sans-serif; }
.trend-embed header,
.trend-embed footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px; }
.trend-embed header strong { color: #ff315f; font-size: 14px; }
.trend-embed header span,
.trend-embed footer small { color: #81757a; font-size: 9px; }
.trend-embed ol { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.trend-embed li { display: grid; grid-template-columns: 26px minmax(0, 1fr) 34px; align-items: center; gap: 7px; padding: 5px; background: #161215; border: 1px solid #2f2227; }
.trend-embed li > b { color: #ff416f; text-align: center; }
.trend-embed li > a { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; color: #eae3e5; }
.trend-embed li img { width: 92px; height: 52px; object-fit: cover; }
.trend-embed li span { overflow: hidden; font-size: 10px; font-weight: 800; line-height: 1.35; text-overflow: ellipsis; }
.trend-embed li > strong { color: #ff668d; font-size: 12px; text-align: center; }
.trend-embed footer a { color: #ff527c; font-size: 10px; font-weight: 900; }

@media (max-width: 900px) {
  .en-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .en-detail-card { grid-template-columns: 1fr; }
  .en-detail-copy { border-top: 1px solid #38242d; border-left: 0; }
  .trend-list li { grid-template-columns: 42px 150px minmax(0, 1fr) 64px; gap: 9px; }
}

@media (max-width: 620px) {
  .en-header-inner { align-items: flex-start; flex-direction: column; }
  .en-header nav { width: 100%; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
  .en-header nav::-webkit-scrollbar { display: none; }
  .en-video-grid { grid-template-columns: 1fr; gap: 12px; }
  .en-video-copy { padding: 14px; }
  .en-video-copy h2 { font-size: 17px; }
  .trend-list li { grid-template-columns: 32px 112px minmax(0, 1fr); gap: 7px; padding: 6px; }
  .trend-rank { font-size: 17px; }
  .trend-score { display: none; }
  .trend-copy h2 { margin: 3px 0; font-size: 11px; }
  .trend-copy p { display: none; }
  .trend-partner-callout { align-items: stretch; flex-direction: column; }
  .trend-partner-callout a { text-align: center; }
}

/* Verified creator discovery */
.creator-directory {
  width: min(calc(100% - 24px), 1420px);
  margin: 14px auto 64px;
}

.creator-directory-header {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
  padding: clamp(22px, 4vw, 44px);
  background: radial-gradient(circle at 86% 12%, rgba(213, 20, 74, .22), transparent 34%), #120e11;
  border: 1px solid #3b2630;
  border-left: 5px solid #ef2459;
}

.creator-directory-header > span { color: #ff4d78; font-size: 9px; font-weight: 950; letter-spacing: .2em; }
.creator-directory-header h1 { margin: 0; color: #fff; font-size: clamp(30px, 5vw, 58px); line-height: 1.05; letter-spacing: -.045em; }
.creator-directory-header p { max-width: 760px; margin: 0; color: #a89ca1; font-size: 12px; }

.creator-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.creator-card { display: grid; grid-template-columns: minmax(190px, .78fr) minmax(0, 1.22fr); min-width: 0; overflow: hidden; background: #131013; border: 1px solid #33242b; }
.creator-card:hover { border-color: #8d2042; }
.creator-card-media { position: relative; min-height: 190px; overflow: hidden; background: #050505; }
.creator-card-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, transparent 54%, rgba(19, 16, 19, .82)); pointer-events: none; }
.creator-card-media img,
.creator-card-media .resilient-poster-fallback { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter .2s ease, transform .25s ease; }
.creator-card:hover .creator-card-media img { filter: brightness(.78) saturate(1.08); transform: scale(1.025); }
.creator-card-media > span { position: absolute; z-index: 2; left: 14px; bottom: 14px; display: grid; place-items: center; width: 42px; height: 42px; color: #fff; background: #d8174d; border-radius: 50%; font-size: 11px; }
.creator-card-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; padding: 20px; }
.creator-card-copy > small { color: #ff4f7a; font-size: 8px; font-weight: 950; letter-spacing: .15em; }
.creator-card-copy h2 { margin: 7px 0 12px; color: #fff; font-size: clamp(17px, 2vw, 25px); line-height: 1.28; overflow-wrap: anywhere; }
.creator-card-copy h2 a:hover { color: #ff6b90; }
.creator-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 18px; }
.creator-tags span { padding: 4px 7px; color: #bdb1b6; background: #211820; border: 1px solid #3d2933; font-size: 8px; font-weight: 850; }
.creator-card-action { margin-top: auto; padding: 9px 12px; color: #fff; background: #bc113e; border: 1px solid #e42a5e; font-size: 10px; font-weight: 900; }
.creator-card-action:hover { color: #fff; background: #e11950; }

.creator-follow-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 8px 14px;
  color: #fff;
  background: #241a20;
  border: 1px solid #704055;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}
.creator-follow-button:hover { background: #34212a; border-color: #e22c61; }
.creator-follow-button[aria-pressed="true"] { color: #ffd5df; background: #770b2e; border-color: #df2458; }
.creator-follow-button:disabled { cursor: wait; opacity: .55; }
.creator-follow-button-compact { min-height: 34px; margin-bottom: 7px; padding: 6px 10px; }

.creator-profile-note { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 12px; padding: 10px 13px; background: #171116; border: 1px solid #3b2831; }
.creator-profile-note > div { display: grid; gap: 3px; }
.creator-profile-note strong { color: #fff; font-size: 11px; }
.creator-profile-note span { color: #91878b; font-size: 9px; }
.video-breadcrumb a[href^="/creators/"] { color: #ff668d; }
.video-detail-creator { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #35262e; }
.video-detail-creator > a { min-width: 0; overflow: hidden; color: #ff6d91; font-size: 10px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.video-detail-creator .creator-follow-button { flex: 0 0 auto; margin: 0; }

.followed-creator-updates { margin-top: 18px; padding: clamp(18px, 3vw, 28px); background: #120f12; border: 1px solid #3c2932; border-top: 4px solid #df1c50; }
.followed-creator-updates > header { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.followed-creator-updates > header span { color: #ff4e79; font-size: 8px; font-weight: 950; letter-spacing: .18em; }
.followed-creator-updates > header h2 { margin: 4px 0 0; color: #fff; font-size: clamp(22px, 4vw, 34px); }
.followed-creator-updates > header > a { color: #ff6b90; font-size: 10px; font-weight: 900; }
.followed-creator-empty { padding: 22px; background: #0a090a; border: 1px solid #2d2227; }
.followed-creator-empty strong { color: #fff; }
.followed-creator-empty p { margin: 6px 0 14px; color: #93898d; font-size: 11px; }
.followed-creator-empty a { display: inline-block; padding: 9px 12px; color: #fff; background: #c91546; font-size: 10px; font-weight: 900; }
.followed-creator-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: #a99ea2; font-size: 9px; }
.followed-creator-summary strong { color: #fff; font-size: 11px; }
.followed-video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.followed-video-grid article { min-width: 0; overflow: hidden; background: #0c0a0b; border: 1px solid #2e2227; }
.followed-video-media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #000; }
.followed-video-media img,
.followed-video-media .resilient-poster-fallback { display: block; width: 100%; height: 100%; object-fit: cover; }
.followed-video-media > span { position: absolute; right: 8px; bottom: 8px; display: grid; place-items: center; width: 34px; height: 34px; color: #fff; background: #d8174d; border-radius: 50%; font-size: 8px; }
.followed-video-grid article > div { padding: 11px; }
.followed-video-grid small a { color: #ff5f86; font-size: 8px; font-weight: 900; }
.followed-video-grid h3 { margin: 5px 0 0; color: #eee; font-size: 12px; line-height: 1.45; }
.followed-creator-updates .push-opt-in { margin-top: 14px; }
.push-console-target { display: grid; gap: 7px; }
.push-console-target > span { color: #a79da1; font-size: 9px; font-weight: 900; }
.push-console-target select { min-height: 42px; padding: 8px 10px; color: #eee; background: #090809; border: 1px solid #48303a; }

@media (max-width: 860px) {
  .creator-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .creator-directory { width: min(calc(100% - 12px), 1420px); margin-top: 8px; }
  .creator-directory-header { padding: 22px 18px; }
  .creator-card { grid-template-columns: 1fr; }
  .creator-card-media { min-height: 0; aspect-ratio: 16 / 9; }
  .creator-card-media::after { background: linear-gradient(180deg, transparent 55%, rgba(19, 16, 19, .72)); }
  .creator-card-copy { padding: 17px; }
  .creator-profile-note { align-items: flex-start; flex-direction: column; gap: 3px; }
  .creator-profile-note .creator-follow-button { width: 100%; margin-top: 6px; }
  .followed-creator-updates { padding: 16px 10px; }
  .followed-creator-updates > header { align-items: flex-start; flex-direction: column; gap: 7px; }
  .followed-video-grid { grid-template-columns: 1fr; }
}
