/* Abibitumitv — "Nocturne" streaming reskin (Phase 1, CSS only).
   Source of truth: claude.ai/design project "Professional streaming platform redesign"
   (Abibitumi.dc.html + _ds/nocturne styles.css). Pan-African brand pass: crimson + gold
   accents on Nocturne's navy ground.
   Loaded from layout/container.html OUTSIDE the cloudinary-only block.
   Selectors use "html body ..." where PlayTube's custom.style.css / inline <style>
   blocks already force values with !important. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --color-bg:#161826;
  --color-surface:#232532;
  --color-surface-2:#2b2e3d;
  --color-text:#e9e9ed;
  --color-divider:rgba(var(--ink-rgb),0.16);
  --color-neutral-200:#e4e7f5;
  --color-neutral-300:#cfd3e5;
  --color-neutral-400:#b2b6ca;
  --color-neutral-500:#9397ab;
  --color-neutral-600:#75798c;
  --color-neutral-800:#3f424d;
  --color-accent:#d1493a;
  --color-accent-200:#f0cd6c;
  --color-accent-300:#deb03e;
  --color-accent-600:#ab362a;
  --color-accent-800:#551b16;
  --color-accent-2:#c1932c;
  --color-accent-2-300:#f0cd6c;
  --color-section:#262a60;
  --radius-md:8px;
  --radius-lg:14px;
  --shadow-md:0 0 0 1px #595d6c, 0 6px 18px rgba(0,0,0,0.55);
  --shadow-lg:0 0 0 1px #9397ab, 0 16px 40px rgba(0,0,0,0.65);
  --font-body:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --rail-w:76px;
  --tint-rgb:193,147,44;
  --ink-rgb:233,233,237;
  --bg-rgb:22,24,38;
  --color-neutral-700:#595d6c;
  --hero-glow:rgba(38,42,96,0.55);
  color-scheme:dark;

  /* legacy names still referenced by other Abibitumi CSS */
  --abv-bg:var(--color-bg);
  --abv-surface:var(--color-surface);
  --abv-surface2:var(--color-surface-2);
  --abv-text:var(--color-text);
  --abv-muted:var(--color-neutral-400);
  --abv-border:var(--color-divider);
  --abv-border-strong:rgba(var(--ink-rgb),0.3);
  --abv-crimson:var(--color-accent);
  --abv-crimson-hover:var(--color-accent-600);
  --abv-crimson-light:rgba(var(--tint-rgb),0.14);
  --abv-gold:var(--color-accent-2);
  --abv-gold-border:rgba(193,147,44,0.35);
  --abv-gold-light:rgba(193,147,44,0.12);
}

@keyframes abvLivePulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ================= base ================= */
html body,
html body #main-container,
html body #main-container.home-container,
html body #container_content,
html body #main-container.home-container #container_content,
html body .main_content,
html body .page_content,
html body .content_main_wrapper,
html body .pt_homepg_whote_bg,
html body .page-margin.pt_homepg_whote_bg,
html body #main-container.home-container .pt_homepg_whote_bg.margin,
html body #main-container .page-margin.pt_homepg_whote_bg.margin,
html body .yp_side_menu,
html body .owl-carousel.pl_feat_vid_slider{
  background:var(--color-bg) !important;
  background-color:var(--color-bg) !important;
}
html body{
  color:var(--color-text) !important;
  font-family:var(--font-body) !important;
  -webkit-font-smoothing:antialiased;
}
html body h1, html body h2, html body h3, html body h4, html body h5,
html body .video_title, html body .channel_name, html body .post_title{
  font-family:var(--font-body) !important;
  color:var(--color-text) !important;
  letter-spacing:-0.01em;
}
html body a{ color:var(--color-accent-300); }
html body a:hover{ color:var(--color-accent-200); }
::selection{ background:rgba(193,147,44,0.35); }

/* ================= side menu: PlayTube's original layout + behaviour, dark styled ================= */
html body .left_menu,
html body .left_menu.desktop,
html body .left_menu .yp_side_drawer,
html body .new_left_right .left_menu{
  background:var(--color-bg) !important;
}
html body .left_menu.desktop{ border-right:0 !important; box-shadow:1px 0 0 rgba(var(--ink-rgb),0.06) !important; }
html body .left_menu .top_logo a.navbar-brand.logo-img,
html body .yp_slide_menu{ background:var(--color-bg) !important; }
html body .yp_side_drawer ul.sections li,
html body .yp_side_drawer ul.sections li.active{ background:transparent !important; }
html body .yp_side_drawer ul.sections li > a{
  color:var(--color-neutral-300) !important;
  background:transparent !important;
  border-radius:var(--radius-md) !important;
  font-size:14px !important; font-weight:500 !important;
}
html body .yp_side_drawer ul.sections li > a span{ color:inherit !important; }
html body .yp_side_drawer ul.sections li > a svg{ color:var(--color-neutral-300) !important; }
html body .yp_side_drawer ul.sections li > a:hover{ background:rgba(var(--ink-rgb),0.06) !important; color:var(--color-text) !important; }
html body .yp_side_drawer ul.sections li > a:hover svg{ color:var(--color-text) !important; }
html body .yp_side_drawer ul.sections li.active > a{
  background:rgba(var(--tint-rgb),0.10) !important;
  color:var(--color-accent-200) !important;
  box-shadow:inset 2px 0 0 var(--color-accent) !important;
}
html body .yp_side_drawer ul.sections li.active > a svg{ color:var(--color-accent-200) !important; }
html body .yp_side_drawer .menu_static_text{
  color:var(--color-neutral-500) !important;
  font-size:10px !important; letter-spacing:.12em !important; text-transform:uppercase;
}
html body .yp_side_drawer ul.sections.subs_list li > a img{ border-radius:50% !important; }

/* ================= top bar ================= */
html body .header-layout,
html body nav.navbar.header-layout,
html body #header_change,
html body .pt_main_hdr{
  background:var(--color-bg) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  border:0 !important;
  box-shadow:none !important;
}
html body #header_change{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  flex-wrap:nowrap !important; height:66px !important;
}
html body #header_change .navbar-header{
  display:flex !important; flex:1 1 auto !important; min-width:0; float:none !important;
  flex-wrap:nowrap !important; align-items:center !important;
}
html body .sec_lay_hdr{
  display:flex !important; flex-wrap:nowrap !important; align-items:center !important; gap:4px;
  margin:0 12px 0 0 !important;
}
html body .sec_lay_hdr > li{ float:none !important; }
html body .sec_lay_hdr > li > a{
  height:36px !important; line-height:36px !important;
  padding:0 14px !important; margin:0 !important;
  border-radius:var(--radius-md) !important;
  font-size:13px !important; font-weight:500 !important; white-space:nowrap;
  background:rgba(var(--ink-rgb),0.14) !important;
  color:var(--color-text) !important;
}
html body .sec_lay_hdr > li > a:hover{ background:rgba(var(--ink-rgb),0.22) !important; }
html body .sec_lay_hdr > li.dropdown > a,
html body .sec_lay_hdr > li:last-child > a.dropdown-toggle{
  background:transparent !important; color:var(--color-neutral-300) !important;
}
html body .sec_lay_hdr > li.dropdown > a:hover{ background:rgba(var(--ink-rgb),0.06) !important; }

/* search */
html body .search-header{ margin:0 16px 0 0 !important; flex:1 1 auto; max-width:460px !important; }
html body .search-header .form-group{ position:relative; margin:0 !important; }
html body .search-header .form-control,
html body .search-header #search-bar,
html body #search_input{
  height:40px !important;
  border-radius:999px !important;
  background:color-mix(in srgb, var(--color-surface) 70%, transparent) !important;
  border:1px solid var(--color-divider) !important;
  color:var(--color-text) !important;
  font-size:14px !important;
  padding-left:18px !important;
  box-shadow:none !important;
}
html body .search-header .form-control::placeholder{ color:var(--color-neutral-500) !important; }
html body .search-header .form-control:focus{ border-color:var(--color-accent) !important; }
html body .search-header button,
html body .search-header .btn{
  background:transparent !important; border:0 !important; color:var(--color-neutral-400) !important;
  box-shadow:none !important;
}

/* right-side icons + profile */
html body .header-layout .navbar-right{
  display:flex !important; flex-wrap:nowrap !important; align-items:center !important; gap:4px;
  margin:0 !important; float:none !important;
}
html body .header-layout .navbar-right > li{ float:none !important; }
html body .header-layout .navbar-right li.profile-nav > a{
  display:flex !important; align-items:center !important; gap:10px;
  max-width:240px; overflow:hidden; white-space:nowrap !important; text-overflow:ellipsis;
  font-size:13px !important; font-weight:500 !important;
}
html body .header-layout .navbar-right > li > a{ color:var(--color-text) !important; background:transparent !important; }
html body .header-layout .navbar-right svg{ color:var(--color-text) !important; }
html body .header-layout .navbar-right > li > a:hover{ background:rgba(var(--ink-rgb),0.06) !important; border-radius:var(--radius-md); }
html body .header-layout .navbar-right img{ border-radius:50% !important; box-shadow:0 0 0 1px var(--color-divider); }

/* dropdowns */
html body .dropdown-menu,
html body .ani-acc-menu,
html body .notfi-dropdown,
html body .pt-create-menu{
  background:var(--color-surface) !important;
  border:0 !important;
  border-radius:var(--radius-md) !important;
  box-shadow:var(--shadow-lg) !important;
  color:var(--color-text) !important;
  padding:8px !important;
}
html body .dropdown-menu > li > a,
html body .dropdown-menu a,
html body .ani-acc-menu a{
  color:var(--color-neutral-200) !important;
  border-radius:6px !important;
  font-size:13px !important;
}
html body .dropdown-menu > li > a:hover,
html body .dropdown-menu a:hover,
html body .ani-acc-menu li:hover{
  background:rgba(var(--ink-rgb),0.06) !important; color:var(--color-text) !important;
}
html body .dropdown-menu .divider{ background:var(--color-divider) !important; }

/* ================= featured hero ================= */
html body .pt_new_home_feat_vidd.home_feat .feature_wrap,
html body .feature_wrap{ color:var(--color-text) !important; }
html body .feature_text_title a,
html body .video-big-title a{
  color:var(--color-text) !important;
  font-weight:500 !important;
  letter-spacing:-0.025em !important;
  line-height:1.02 !important;
}
html body .feature_wrap h4,
html body .feature_wrap p,
html body .feature_wrap .video_info{ color:var(--color-neutral-300) !important; }
html body .button_watch{
  display:inline-flex !important; align-items:center; gap:8px;
  height:48px !important; padding:0 26px !important;
  border-radius:var(--radius-md) !important;
  border:1px solid var(--color-accent) !important;
  background:rgba(var(--tint-rgb),0.14) !important;
  color:var(--color-accent-300) !important;
  font-size:15px !important; font-weight:500 !important;
  box-shadow:0 0 24px rgba(209,73,58,0.35) !important;
}
html body .button_watch:hover{ background:rgba(var(--tint-rgb),0.24) !important; color:var(--color-accent-200) !important; }
html body .feat_vid_big_play_btn .btn.btn-main{
  background:rgba(var(--bg-rgb),0.55) !important;
  border:1px solid var(--color-accent) !important;
  border-radius:50% !important;
  box-shadow:0 0 28px rgba(209,73,58,0.35) !important;
}

/* ================= category chips (in-page swiper) ================= */
html body .pt_sec_nav_slide_prnt .pt_sec_nav_slide .swiper-slide > a{
  display:inline-flex !important; align-items:center; height:36px !important; line-height:36px !important;
  padding:0 14px !important; margin:0 !important;
  background:rgba(var(--ink-rgb),0.08) !important; color:var(--color-neutral-300) !important;
  border:0 !important; border-radius:var(--radius-md) !important; box-shadow:none !important;
  font-size:13px !important; font-weight:500 !important; white-space:nowrap;
}
html body .pt_sec_nav_slide_prnt .pt_sec_nav_slide .swiper-slide > a:hover{
  background:rgba(var(--ink-rgb),0.14) !important; color:var(--color-text) !important;
}
html body .pt_sec_nav_slide_prnt .pt_sec_nav_slide .swiper-slide > a.active{
  background:rgba(var(--tint-rgb),0.12) !important; color:var(--color-accent-200) !important;
  box-shadow:inset 0 0 0 1px rgba(var(--tint-rgb),0.6) !important;
}
/* legacy pill selector */
html body .pt_sec_nav_slide a{
  color:var(--color-text) !important;
  background:rgba(var(--ink-rgb),0.10) !important;
  border:0 !important;
  border-radius:var(--radius-md) !important;
  padding:8px 14px !important;
  margin-right:6px;
  font-size:13px !important; font-weight:500 !important;
}
html body .pt_sec_nav_slide a.active,
html body .pt_sec_nav_slide a:hover{
  background:rgba(var(--ink-rgb),0.2) !important;
  color:var(--color-text) !important;
}

/* ================= content rows ================= */
@media (min-width: 1301px){
  html body .pt_hmpg_contanr{ max-width:none !important; padding:0 clamp(20px,3.2vw,48px) !important; }
}
html body .home-page-categories .title h4,
html body .pt_sec_nav_cats .title h4{
  font-size:19px !important; font-weight:500 !important; letter-spacing:-0.01em !important;
  color:var(--color-text) !important;
  display:flex; align-items:center; gap:14px;
}
html body .home-page-categories .title h4 > svg{ display:none !important; }
html body .view_more_link a,
html body .home-page-categories .title a{
  color:var(--color-accent-300) !important; font-size:13px !important; font-weight:400 !important;
}

/* video cards */
html body .video-list{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
html body .video-list .video-list-image{
  border-radius:var(--radius-md) !important;
  overflow:hidden !important;
  background:var(--color-surface) !important;
  transition:transform .25s ease, box-shadow .25s ease;
}
html body .video-list .video-list-image img{ transition:transform 5s ease-out; }
html body .video-list:hover .video-list-image{
  transform:translateY(-4px);
  box-shadow:0 0 0 1px var(--color-accent), 0 18px 36px rgba(0,0,0,0.55), 0 0 22px rgba(209,73,58,0.25);
}
html body .video-list:hover .video-list-image img{ transform:scale(1.06); }
html body .video-list .center_abs,
html body .video-list .custom_height_fixed_blur{ background:transparent !important; }
html body .video-list .center_abs a,
html body .video-list h4, html body .video-list h4 a,
html body .video-list .video-title a{
  color:var(--color-text) !important; font-size:14px !important; font-weight:500 !important;
}
html body .video-list .center_abs p,
html body .video-list .center_abs span,
html body .video-list .video-views,
html body .video-list .publisher-name a{
  color:var(--color-neutral-400) !important; font-size:12px !important;
}
html body .video-list .video-duration,
html body .video-list .duration{
  background:rgba(var(--bg-rgb),0.8) !important; color:var(--color-text) !important;
  border-radius:4px !important; font-size:11px !important; font-weight:500 !important;
}

/* article cards on home */
html body .pt_article_h_list{
  background:var(--color-surface) !important;
  border:0 !important;
  border-radius:var(--radius-md) !important;
  overflow:hidden;
}

/* generic cards / blocks */
html body .video_item,
html body .video_block,
html body .channel_item,
html body .post_item,
html body .thumbnail_holder{
  background:var(--color-surface) !important;
  border:0 !important;
  border-radius:var(--radius-md) !important;
  transition:transform .25s ease, box-shadow .25s ease;
}
html body .video_item:hover,
html body .video_block:hover,
html body .channel_item:hover,
html body .post_item:hover{
  transform:translateY(-4px);
  box-shadow:0 0 0 1px var(--color-accent), 0 18px 36px rgba(0,0,0,0.55);
}

/* ================= live badges ================= */
html body .badge_live,
html body span.live,
html body .live-badge{
  background:rgba(var(--bg-rgb),0.8) !important;
  color:var(--color-accent-200) !important;
  box-shadow:0 0 0 1px var(--color-accent) !important;
  border-radius:4px !important;
  font-size:10px !important; font-weight:600 !important; letter-spacing:.1em !important;
}

/* ================= buttons ================= */
html body .btn-primary,
html body .subscribe_btn,
html body .follow_btn{
  background:rgba(var(--tint-rgb),0.14) !important;
  border:1px solid var(--color-accent) !important;
  color:var(--color-accent-300) !important;
  border-radius:var(--radius-md) !important;
}
html body .btn-primary:hover,
html body .subscribe_btn:hover,
html body .follow_btn:hover{
  background:rgba(var(--tint-rgb),0.24) !important; color:var(--color-accent-200) !important;
}
html body .btn-secondary,
html body .btn-default,
html body .btn-outline,
html body .btn_outline{
  background:transparent !important;
  border:1px solid var(--color-divider) !important;
  color:var(--color-text) !important;
  border-radius:var(--radius-md) !important;
}
html body .btn-secondary:hover,
html body .btn-default:hover,
html body .btn-outline:hover{ background:rgba(var(--ink-rgb),0.07) !important; }

/* ================= forms ================= */
html body input[type="text"],
html body input[type="email"],
html body input[type="password"],
html body input[type="search"],
html body input[type="url"],
html body input[type="number"],
html body textarea,
html body select,
html body .form-control{
  background:var(--color-surface) !important;
  border:1px solid var(--color-divider) !important;
  color:var(--color-text) !important;
  border-radius:var(--radius-md) !important;
  box-shadow:none !important;
}
html body input:focus, html body textarea:focus, html body select:focus, html body .form-control:focus{
  border-color:var(--color-accent) !important;
  box-shadow:0 0 0 2px rgba(209,73,58,0.18) !important;
}
html body ::placeholder{ color:var(--color-neutral-500) !important; }

/* ================= surfaces: modals, panels ================= */
html body .swal2-modal,
html body .modal-content,
html body .share_feat_vid{
  background:var(--color-surface) !important;
  color:var(--color-text) !important;
  border:0 !important;
  border-radius:var(--radius-lg) !important;
  box-shadow:var(--shadow-lg) !important;
}
html body .modal-header, html body .modal-footer{ border-color:var(--color-divider) !important; }

/* ================= scrollbars ================= */
html body ::-webkit-scrollbar{ width:10px; height:8px; }
html body ::-webkit-scrollbar-track{ background:var(--color-bg); }
html body ::-webkit-scrollbar-thumb{ background:var(--color-neutral-800); border-radius:6px; }
html body ::-webkit-scrollbar-thumb:hover{ background:var(--color-neutral-700); }

/* ================= watch page ================= */
html body .content.pt_shadow.new_box_color,
html body .new_box_color{
  background:var(--color-surface) !important;
  color:var(--color-text) !important;
  border:0 !important;
  border-radius:var(--radius-lg) !important;
  box-shadow:none !important;
}
html body .new_box_color p,
html body .new_box_color li,
html body .new_box_color .desc,
html body .new_box_color .video-description,
html body .new_box_color label{ color:var(--color-neutral-300) !important; }
html body .new_box_color h1, html body .new_box_color h2, html body .new_box_color h3,
html body .new_box_color h4, html body .new_box_color strong, html body .new_box_color b{ color:var(--color-text) !important; }
html body .new_box_color hr{ border-color:var(--color-divider) !important; }
html body .related-videos .video-title a,
html body .pt_video_side_vids .video-title a{
  color:var(--color-text) !important; font-size:14px !important; font-weight:500 !important; line-height:1.35 !important;
}
html body .related-videos .video-info,
html body .related-videos .video-info *,
html body .pt_video_side_vids .video-info,
html body .pt_video_side_vids .video-info *{ color:var(--color-neutral-400) !important; }
html body .related-videos .video-thumb,
html body .pt_video_side_vids .video-thumb{ border-radius:var(--radius-md) !important; overflow:hidden !important; }

html body .yp_side_drawer::-webkit-scrollbar{ background:var(--color-bg) !important; }
html body .yp_side_drawer::-webkit-scrollbar-track{ background:var(--color-bg) !important; box-shadow:none !important; }
html body .yp_side_drawer::-webkit-scrollbar-thumb{ background:var(--color-neutral-800) !important; border-radius:3px !important; }

/* ================= inner pages (channel, listings, articles, live) ================= */
html body .box_light_black,
html body .padding_box_light_black,
html body .pt_vid_lst_page,
html body .article-categories,
html body .popular_below_wrap,
html body .mov_filtr_cont,
html body .lang_price_range,
html body .tp_vid_fltr_tabs,
html body .pt_chnl_info.container-home,
html body .links-container.container-home,
html body h3.recent-articles.heading_all_sections_top,
html body .heading_all_sections_top{
  background:var(--color-surface) !important;
  background-color:var(--color-surface) !important;
  color:var(--color-text) !important;
  border:0 !important;
  box-shadow:none !important;
}
html body .box_light_black,
html body .padding_box_light_black,
html body .article-categories,
html body .popular_below_wrap,
html body h3.recent-articles.heading_all_sections_top{ border-radius:var(--radius-lg) !important; }
html body h3.recent-articles.heading_all_sections_top,
html body h3.recent-articles.heading_all_sections_top *{ color:var(--color-text) !important; }
html body h3.recent-articles.heading_all_sections_top svg{ color:var(--color-accent) !important; }
html body .pt_chnl_info.container-home,
html body .links-container.container-home{ border-radius:0 !important; }
html body .links-container.container-home{ box-shadow:inset 0 -1px 0 var(--color-divider) !important; }
html body .links-container a{ color:var(--color-neutral-300) !important; }
html body .links-container a.active,
html body .links-container li.active a,
html body .links-container a:hover{ color:var(--color-accent-200) !important; }
html body .pt_chnl_info .channel_name, html body .pt_chnl_info h3, html body .pt_chnl_info h4{ color:var(--color-text) !important; }
html body .pt_chnl_info p, html body .pt_chnl_info span, html body .pt_chnl_info small{ color:var(--color-neutral-400) !important; }
html body .box_light_black h1, html body .box_light_black h2, html body .box_light_black h3,
html body .box_light_black h4, html body .box_light_black h5,
html body .popular_below_wrap h3, html body .popular_below_wrap h4{ color:var(--color-text) !important; }
html body .box_light_black p, html body .box_light_black label, html body .box_light_black li,
html body .popular_below_wrap p, html body .popular_below_wrap span{ color:var(--color-neutral-300) !important; }
html body .article-categories a, html body .article-categories li{ color:var(--color-neutral-300) !important; }
html body .article-categories a:hover{ color:var(--color-accent-200) !important; }
html body .article-categories li a span{ background:transparent !important; color:inherit !important; }
html body .article-categories .badge, html body .article-categories span.count_number{ background:rgba(var(--ink-rgb),0.08) !important; color:var(--color-neutral-300) !important; border-radius:6px !important; }
html body .tp_vid_fltr_tabs a, html body .tp_vid_fltr_tabs button{ color:var(--color-neutral-300) !important; background:transparent !important; }
html body .tp_vid_fltr_tabs a.active, html body .tp_vid_fltr_tabs .active a{ color:var(--color-accent-200) !important; box-shadow:inset 0 -2px 0 var(--color-accent) !important; }
html body .channel_details .video_channel_title,
html body .channel_details .video_channel_name{ color:var(--color-text) !important; }
html body .channel_details .video_channel_stats{ color:var(--color-neutral-400) !important; }
html body .video-info .name_artcile{ color:var(--color-text) !important; font-weight:500 !important; }
html body .video-info .name_artcile_views,
html body .views_pop_channel,
html body .no-content-found{ color:var(--color-neutral-400) !important; }
/* live studio: remap its own light-mode variables */
html body:not(.dark_mode){
  --bg-base:var(--color-bg); --bg-surface:var(--color-surface); --bg-sidebar:var(--color-surface); --text:var(--color-text);
  --border:rgba(var(--ink-rgb),0.12);
  --text-muted:rgba(var(--ink-rgb),0.6); --text-dim:rgba(var(--ink-rgb),0.35);
}
html body .lv-tabs, html body .lv-preview, html body .lv-sidebar{
  background:var(--color-surface) !important; color:var(--color-text) !important; border-color:var(--color-divider) !important;
}
html body .lv-sidebar input, html body .lv-sidebar select, html body .lv-sidebar textarea,
html body .box_light_black input, html body .box_light_black select, html body .box_light_black textarea,
html body #live_video_name, html body #camera_select, html body #mic_select,
html body #sidebar_title_mirror, html body #stream_category{
  background:var(--color-bg) !important; color:var(--color-text) !important;
  border:1px solid var(--color-divider) !important; border-radius:var(--radius-md) !important;
}

html body .pt_chnl_info h4 a, html body .pt_chnl_info h4{ color:var(--color-text) !important; }
/* ================= single article page ================= */
html body .movie_slider.artcile_before::before{ background:linear-gradient(rgba(var(--bg-rgb),0), var(--color-bg)) !important; }
html body .movie_slider.artcile_before::after{ background:linear-gradient(rgba(var(--bg-rgb),0) 0%, rgba(var(--bg-rgb),0.78) 49%, var(--color-bg) 100%) !important; }
html body .feature_text_title.article_new_feature_title,
html body .feature_text_title.article_new_feature_title *{ color:var(--color-text) !important; }
html body .full_text_article_custom,
html body .full_text_article_custom p,
html body .full_text_article_custom li,
html body .full_text_article_custom em,
html body .full_text_article_custom td,
html body .full_text_article_custom th,
html body .full_text_article_custom figcaption{ color:var(--color-neutral-200) !important; }
html body .full_text_article_custom strong,
html body .full_text_article_custom b,
html body .full_text_article_custom h1, html body .full_text_article_custom h2,
html body .full_text_article_custom h3, html body .full_text_article_custom h4,
html body .abibitumi-credited-author, html body .abibitumi-credited-author strong{ color:var(--color-text) !important; }
html body .full_text_article_custom a{ color:var(--color-accent-300) !important; }
html body .full_text_article_custom table, html body .full_text_article_custom td, html body .full_text_article_custom th{ border-color:var(--color-divider) !important; background:transparent !important; }
html body .full_text_article_custom blockquote{ border-left-color:var(--color-accent) !important; color:var(--color-neutral-300) !important; }
html body .comments-content.read-article-comments_custom{ background:var(--color-surface) !important; border-radius:var(--radius-lg) !important; border:0 !important; }
html body .no-comments-found{ color:var(--color-neutral-400) !important; }
html body .popular-article-title, html body a.popular-article-title{ color:var(--color-text) !important; }
/* footer */
html body .pt_footer, html body .pt_footer *{ background-color:transparent; }
html body .pt_footer a{ color:var(--color-neutral-400) !important; }
html body .pt_footer a:hover{ color:var(--color-accent-200) !important; }

/* ================= Phase 2 · home hero (full-bleed, design: Abibitumi.dc.html HOME section) ================= */
html body .pt_new_home_feat_vidd.home_feat{
  height:clamp(520px,80vh,780px) !important;
  padding:0 !important;
  background:var(--color-bg) !important;
  border-radius:0 !important;
}
html body #main-container.home-container .pt_new_home_feat_vidd.home_feat{
  margin:0 -15px !important; width:calc(100% + 30px) !important; max-width:none !important;
}
html body #main-container.home-container .pt_homepg_whote_bg.margin{ padding-top:0 !important; }
html body .pt_new_home_feat_vidd .owl-stage-outer,
html body .pt_new_home_feat_vidd .owl-stage,
html body .pt_new_home_feat_vidd .owl-item,
html body .pt_new_home_feat_vidd .pl_feat_vid_slide,
html body .pt_new_home_feat_vidd .pt_fv_blur_img,
html body .pt_new_home_feat_vidd .pt_fv_blur_img > div,
html body .pt_new_home_feat_vidd .feature_image_main{
  height:clamp(520px,80vh,780px) !important;
  min-height:0 !important;
}
html body .pt_new_home_feat_vidd .feature_image_main{
  position:relative !important;
  border-radius:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background-color:var(--color-bg) !important;
  background-repeat:no-repeat !important;
  background-size:auto 100% !important;
  background-position:right center !important;
  filter:none !important;
}
/* gradient stack: indigo glow + bottom fade (before), left fade (after) */
html body .pt_new_home_feat_vidd .feature_image_main::before{
  content:"" !important; display:block !important; position:absolute !important; inset:0 !important; z-index:1 !important;
  background:
    radial-gradient(60% 50% at 12% 60%, var(--hero-glow), transparent 70%),
    linear-gradient(0deg, var(--color-bg) 0%, rgba(var(--bg-rgb),0.4) 26%, transparent 50%) !important;
  filter:none !important; opacity:1 !important; transform:none !important;
}
html body .pt_new_home_feat_vidd .feature_image_main::after{
  content:"" !important; display:block !important; position:absolute !important; inset:0 !important; z-index:1 !important;
  background:linear-gradient(90deg, var(--color-bg) 22%, rgba(var(--bg-rgb),0.7) 42%, transparent 70%) !important;
}
html body .pt_new_home_feat_vidd .feature_image_main > .pt_hmpg_contanr{
  position:relative !important; z-index:2 !important;
  height:100% !important; max-width:none !important;
  padding:0 clamp(20px,3.2vw,48px) !important;
  display:flex !important; align-items:flex-end !important; justify-content:flex-start !important;
}
html body .pt_new_home_feat_vidd.home_feat .feature_wrap{
  display:flex !important; flex-direction:column !important; gap:16px !important;
  width:auto !important; max-width:600px !important; height:auto !important;
  margin:0 0 12vh 0 !important; padding:0 !important;
  background:transparent !important; box-shadow:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  float:none !important; position:relative !important;
}
/* order: kicker, title, meta, description, channel, actions */
html body .pt_new_home_feat_vidd .feature_wrap > h4{ order:1; }
html body .pt_new_home_feat_vidd .feature_wrap > .feature_text_title{ order:2; }
html body .pt_new_home_feat_vidd .feature_wrap > .video_info{ order:3; }
html body .pt_new_home_feat_vidd .feature_wrap > p:not(.video_info){ order:4; }
html body .pt_new_home_feat_vidd .feature_wrap > .right_feature_wrap{ order:5; }
html body .pt_new_home_feat_vidd .feature_wrap > .feature_channel_wrap{ order:6; }
html body .pt_new_home_feat_vidd .feature_wrap > hr{ display:none !important; }

html body .pt_new_home_feat_vidd .feature_wrap > h4{
  display:flex !important; align-items:center !important; gap:10px !important; margin:0 !important;
  font-size:11px !important; font-weight:500 !important; letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--color-accent-300) !important;
}
html body .pt_new_home_feat_vidd .feature_wrap > h4 svg{ display:none !important; }
html body .pt_new_home_feat_vidd .feature_wrap > h4::before{
  content:""; width:22px; height:2px; background:var(--color-accent); box-shadow:0 0 10px var(--color-accent);
}
html body .pt_new_home_feat_vidd .feature_text_title{ margin:0 !important; width:auto !important; height:auto !important; max-height:none !important; }
html body .pt_new_home_feat_vidd .feature_text_title a{
  display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important;
  font-family:var(--font-body) !important;
  font-size:clamp(34px,4.6vw,64px) !important; line-height:1.02 !important; letter-spacing:-0.025em !important;
  font-weight:500 !important; text-transform:none !important; color:var(--color-text) !important;
  text-wrap:balance;
}
html body .pt_new_home_feat_vidd .feature_wrap > .video_info{
  margin:0 !important; font-size:13px !important; color:var(--color-neutral-300) !important;
}
html body .pt_new_home_feat_vidd .feature_wrap > p:not(.video_info){
  margin:0 !important; max-width:520px !important; height:auto !important; max-height:none !important;
  font-size:15px !important; line-height:1.55 !important; color:var(--color-neutral-200) !important;
  display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important;
}
html body .pt_new_home_feat_vidd .feature_wrap > p:not(.video_info) br{ display:none; }
html body .pt_new_home_feat_vidd .feature_wrap > p:not(.video_info) a{ color:var(--color-accent-300) !important; }
/* channel */
html body .pt_new_home_feat_vidd .right_feature_wrap{
  display:flex !important; align-items:center !important; gap:10px !important; margin:0 !important; height:auto !important;
}
html body .pt_new_home_feat_vidd .right_feature_wrap > span,
html body .pt_new_home_feat_vidd .right_feature_wrap > span a,
html body .pt_new_home_feat_vidd .right_feature_wrap > span img{
  width:28px !important; height:28px !important; min-width:28px !important; border-radius:50% !important; object-fit:cover; margin:0 !important;
}
html body .pt_new_home_feat_vidd .chanel_content{ display:flex !important; align-items:center !important; gap:10px !important; }
html body .pt_new_home_feat_vidd .chanel_content > a,
html body .pt_new_home_feat_vidd .chanel_content > a span{ font-size:13px !important; font-weight:500 !important; color:var(--color-text) !important; }
html body .pt_new_home_feat_vidd .subscribe_channel{ display:flex !important; align-items:center; gap:6px; }
html body .pt_new_home_feat_vidd .subscribe_channel button{
  height:26px !important; padding:0 10px !important; font-size:11px !important; border-radius:6px !important;
}
/* actions */
html body .pt_new_home_feat_vidd .feature_channel_wrap,
html body .pt_new_home_feat_vidd .feature_channel_wrap .left_wrap{
  display:flex !important; align-items:center !important; gap:10px !important; margin:6px 0 0 !important; padding:0 !important;
  background:transparent !important; flex-wrap:wrap;
}
html body .pt_new_home_feat_vidd .feature_channel_wrap .share_button button,
html body .pt_new_home_feat_vidd .feature_channel_wrap .left_wrap > div button,
html body .pt_new_home_feat_vidd .feature_channel_wrap .left_wrap > button{
  width:48px !important; height:48px !important; border-radius:var(--radius-md) !important;
  background:rgba(var(--bg-rgb),0.5) !important; border:1px solid var(--color-divider) !important; color:var(--color-text) !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
}
html body .pt_new_home_feat_vidd .feature_channel_wrap button svg{ color:var(--color-text) !important; }
html body .pt_new_home_feat_vidd .feat_vid_big_play_btn{ display:none !important; }
@media (max-width: 767px){
  html body .pt_new_home_feat_vidd.home_feat,
  html body .pt_new_home_feat_vidd .owl-stage-outer, html body .pt_new_home_feat_vidd .owl-stage,
  html body .pt_new_home_feat_vidd .owl-item, html body .pt_new_home_feat_vidd .pl_feat_vid_slide,
  html body .pt_new_home_feat_vidd .pt_fv_blur_img, html body .pt_new_home_feat_vidd .pt_fv_blur_img > div,
  html body .pt_new_home_feat_vidd .feature_image_main{ height:560px !important; }
  html body .pt_new_home_feat_vidd .feature_image_main{ background-size:cover !important; background-position:center top !important; }
  html body .pt_new_home_feat_vidd .feature_image_main::after{ background:linear-gradient(0deg, var(--color-bg) 30%, rgba(var(--bg-rgb),0.6) 60%, transparent 100%) !important; }
  html body .pt_new_home_feat_vidd.home_feat .feature_wrap{ margin-bottom:28px !important; }
}

/* ================= Phase 2 · hero on phones: stacked (clear thumbnail on top, text below) ================= */
@media (max-width: 767px){
  html body #main-container.home-container .pt_new_home_feat_vidd.home_feat,
  html body .pt_new_home_feat_vidd.home_feat,
  html body .pt_new_home_feat_vidd .owl-stage-outer, html body .pt_new_home_feat_vidd .owl-stage,
  html body .pt_new_home_feat_vidd .owl-item, html body .pt_new_home_feat_vidd .pl_feat_vid_slide,
  html body .pt_new_home_feat_vidd .pt_fv_blur_img, html body .pt_new_home_feat_vidd .pt_fv_blur_img > div,
  html body .pt_new_home_feat_vidd .feature_image_main{ height:auto !important; min-height:0 !important; }
  html body .pt_new_home_feat_vidd .feature_image_main{
    background-size:auto 56.25vw !important; background-position:center top !important;
    padding-top:calc(56.25vw - 20px) !important;
  }
  html body .pt_new_home_feat_vidd .feature_image_main::before{ display:none !important; }
  html body .pt_new_home_feat_vidd .feature_image_main::after{
    background:linear-gradient(180deg, transparent 0, transparent calc(56.25vw - 70px), var(--color-bg) 56.25vw, var(--color-bg) 100%) !important;
  }
  html body .pt_new_home_feat_vidd .feature_image_main > .pt_hmpg_contanr{ height:auto !important; padding:0 20px 28px !important; }
  html body .pt_new_home_feat_vidd.home_feat .feature_wrap{ margin:0 !important; gap:12px !important; max-width:none !important; }
  html body .pt_new_home_feat_vidd .feature_text_title a{ font-size:28px !important; line-height:1.1 !important; }
  html body .pt_new_home_feat_vidd .feature_wrap > .video_info{ font-size:12px !important; }
  html body .pt_new_home_feat_vidd .feature_wrap > p:not(.video_info){ font-size:14px !important; -webkit-line-clamp:2; }
  html body .pt_new_home_feat_vidd .feature_channel_wrap,
  html body .pt_new_home_feat_vidd .feature_channel_wrap .left_wrap{ justify-content:flex-start !important; text-align:left !important; width:100% !important; }
  html body .pt_new_home_feat_vidd .feature_channel_wrap .left_wrap > a{ flex:1 1 auto; justify-content:center; }
}

/* ================= Phase 2 · "Your channels" row ================= */
html body .abv-your-channels{ padding:6px 0 26px; }
html body .abv-your-channels[hidden]{ display:none !important; }
html body .abv-your-channels .abv-row-head{ display:flex; align-items:baseline; gap:14px; margin:0 0 14px; }
html body .abv-your-channels .abv-row-head h2{
  margin:0 !important; font-family:var(--font-body) !important; font-size:19px !important; font-weight:500 !important;
  letter-spacing:-0.01em !important; color:var(--color-text) !important;
}
html body .abv-your-channels .abv-row-head a{ font-size:13px !important; color:var(--color-accent-300) !important; }
html body .abv-your-channels .abv-row-head a:hover{ color:var(--color-accent-200) !important; }
html body .abv-ch-track{
  display:flex; gap:22px; overflow-x:auto; scrollbar-width:none; padding:6px 4px 4px;
  scroll-snap-type:x proximity;
}
html body .abv-ch-track::-webkit-scrollbar{ display:none; }
html body .abv-ch{
  flex:none; width:96px; display:flex; flex-direction:column; align-items:center; gap:10px;
  text-decoration:none !important; scroll-snap-align:start;
}
html body .abv-ch-av{
  width:76px; height:76px; border-radius:50%; overflow:hidden; display:block;
  background:var(--color-surface);
  box-shadow:0 0 0 2px var(--color-bg), 0 0 0 3px var(--color-divider);
  transition:transform .2s ease, box-shadow .2s ease;
}
html body .abv-ch-av img{ width:100%; height:100%; object-fit:cover; display:block; }
html body .abv-ch:hover .abv-ch-av{
  transform:scale(1.06);
  box-shadow:0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-accent), 0 0 18px rgba(209,73,58,0.45);
}
html body .abv-ch-name{
  font-size:12px; line-height:1.3; text-align:center; color:var(--color-neutral-200) !important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-width:96px;
}
@media (max-width: 767px){
  html body .abv-ch-track{ gap:16px; }
  html body .abv-ch{ width:76px; }
  html body .abv-ch-av{ width:64px; height:64px; }
}

html body .abv-ch-av.abv-noimg{ display:grid; place-items:center; background:linear-gradient(135deg, var(--color-section), var(--color-surface)); }
html body .abv-ch-av.abv-noimg::before{ content:attr(data-initial); font-size:26px; font-weight:500; color:var(--color-neutral-200); }

/* ================= Phase 2 · "Continue watching" row ================= */
html body .abv-cw{ padding:0 0 30px; }
html body .abv-cw .abv-row-head{ display:flex; align-items:center; gap:14px; margin:0 0 4px; }
html body .abv-cw .abv-row-head h2{
  margin:0 !important; font-family:var(--font-body) !important; font-size:19px !important; font-weight:500 !important;
  letter-spacing:-0.01em !important; color:var(--color-text) !important;
}
html body .abv-row-sub{ font-size:13px; color:var(--color-neutral-400); }
html body .abv-cw .abv-row-head > a{ font-size:13px !important; color:var(--color-accent-300) !important; display:inline-flex; align-items:center; gap:4px; }
html body .abv-cw .abv-row-head > a::after{ content:"\203A"; font-size:15px; line-height:1; }
html body .abv-row-nav{ margin-left:auto; display:flex; gap:8px; }
html body .abv-nav-btn{
  width:32px; height:32px; border-radius:50%; display:inline-grid; place-items:center; padding:0; cursor:pointer;
  background:transparent !important; color:var(--color-text) !important; border:1px solid var(--color-divider) !important;
}
html body .abv-nav-btn:hover{ background:rgba(var(--ink-rgb),0.07) !important; }
html body .abv-cw-track{
  display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x mandatory;
  padding:14px 2px 10px; margin:0 -2px;
}
html body .abv-cw-track::-webkit-scrollbar{ display:none; }
html body .abv-cw-item{
  flex:0 0 clamp(248px,21vw,330px); scroll-snap-align:start; text-decoration:none !important; display:block; min-width:0;
}
html body .abv-cw-thumb{
  position:relative; display:block; aspect-ratio:16/9; border-radius:var(--radius-md); overflow:hidden;
  background:var(--color-surface); transition:transform .25s ease, box-shadow .25s ease;
}
html body .abv-cw-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 5s ease-out; }
html body .abv-cw-thumb::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg, rgba(var(--bg-rgb),0.85), transparent 45%);
}
html body .abv-cw-dur{
  position:absolute; right:8px; bottom:8px; z-index:1; font-size:11px; font-weight:500; padding:2px 6px; border-radius:4px;
  background:rgba(var(--bg-rgb),0.8); color:var(--color-text);
}
html body .abv-cw-play{
  position:absolute; left:10px; bottom:10px; z-index:1; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; opacity:0; transform:translateY(4px); transition:opacity .2s ease, transform .2s ease;
  background:rgba(var(--bg-rgb),0.7); color:var(--color-accent-200);
  box-shadow:0 0 0 1px var(--color-accent), 0 0 14px rgba(209,73,58,0.5);
}
html body .abv-cw-item:hover .abv-cw-thumb{
  transform:translateY(-4px);
  box-shadow:0 0 0 1px var(--color-accent), 0 18px 36px rgba(0,0,0,0.55), 0 0 22px rgba(209,73,58,0.25);
}
html body .abv-cw-item:hover .abv-cw-thumb img{ transform:scale(1.06); }
html body .abv-cw-item:hover .abv-cw-play{ opacity:1; transform:none; }
html body .abv-cw-meta{ display:flex; gap:10px; padding:10px 2px 0; min-width:0; }
html body .abv-cw-av{ width:28px; height:28px; border-radius:50%; object-fit:cover; flex:none; }
html body .abv-cw-text{ min-width:0; display:flex; flex-direction:column; }
html body .abv-cw-title{
  font-size:14px; font-weight:500; line-height:1.3; color:var(--color-text) !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html body .abv-cw-sub{
  font-size:12px; margin-top:3px; color:var(--color-neutral-400) !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
@media (max-width: 767px){
  html body .abv-cw-item{ flex-basis:72vw; }
  html body .abv-row-nav{ display:none; }
}

/* ================= Phase 2 · existing home rows: design row header + round arrows + sideways Trending ================= */
html body .home-page-categories.pt_hmpg_vidlst{ position:relative !important; }
html body .home-page-categories.pt_hmpg_vidlst > .title{ padding-right:88px !important; }
html body .home-page-categories.pt_hmpg_vidlst .videos,
html body .home-page-categories.pt_hmpg_vidlst .videos > .slick-slider{ position:static !important; }
/* See all */
html body .home-page-categories .title h4{ justify-content:flex-start !important; }
html body .home-page-categories .title .view_more_link{ display:inline-flex !important; width:auto !important; height:auto !important; opacity:1 !important; visibility:visible !important; overflow:visible !important; margin:0 !important; float:none !important; position:static !important; }
html body .home-page-categories .title .view_more_link a{ visibility:visible !important; opacity:1 !important; }
html body .home-page-categories .title .view_more_link a{
  display:inline-flex !important; align-items:center; width:auto !important; height:auto !important;
  font-size:13px !important; font-weight:400 !important; color:var(--color-accent-300) !important; letter-spacing:0 !important;
  background:none !important;
}
html body .home-page-categories .title .view_more_link a::before{ content:"See all \203A"; }
html body .home-page-categories .title .view_more_link a:hover{ color:var(--color-accent-200) !important; }
/* round arrows, top-right of each row */
@media (min-width: 768px){
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow{
    position:absolute !important; top:0 !important; bottom:auto !important; left:auto !important;
    width:32px !important; height:32px !important; min-height:0 !important; margin:0 !important; padding:0 !important;
    border-radius:50% !important; border:1px solid var(--color-divider) !important;
    background:transparent !important; box-shadow:none !important; opacity:1;
    display:grid !important; place-items:center !important; cursor:pointer; z-index:5 !important;
    color:var(--color-text) !important; transform:none !important; visibility:visible !important;
  }
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow > *,
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow::after{ display:none !important; }
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow::before,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow::before{
    content:"" !important; display:block !important; width:8px; height:8px; opacity:1 !important;
    border-top:2px solid currentColor; border-right:2px solid currentColor; font-size:0 !important;
  }
  html body .home-page-categories.pt_hmpg_vidlst .slick-prev::before,
  html body .home-page-categories.pt_hmpg_vidlst .explore_more.prev::before,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow.prev::before{ transform:translateX(2px) rotate(-135deg); }
  html body .home-page-categories.pt_hmpg_vidlst .slick-next::before,
  html body .home-page-categories.pt_hmpg_vidlst .explore_more.next::before,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow.next::before{ transform:translateX(-2px) rotate(45deg); }
  html body .home-page-categories.pt_hmpg_vidlst .slick-prev,
  html body .home-page-categories.pt_hmpg_vidlst .explore_more.prev,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow.prev{ right:42px !important; }
  html body .home-page-categories.pt_hmpg_vidlst .slick-next,
  html body .home-page-categories.pt_hmpg_vidlst .explore_more.next,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow.next{ right:0 !important; }
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow:hover,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow:hover{ background:rgba(var(--ink-rgb),0.07) !important; }
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow.slick-disabled{ opacity:.35 !important; cursor:default; }
}
@media (max-width: 767px){
  html body .home-page-categories.pt_hmpg_vidlst .slick-arrow,
  html body .home-page-categories.pt_hmpg_vidlst .abv-arrow{ display:none !important; }
  html body .home-page-categories.pt_hmpg_vidlst > .title{ padding-right:0 !important; }
}
/* Trending: one sideways row instead of a wrapping grid */
html body .home-page-categories .videos > .row.pt_no_vid_found_trend{
  display:flex !important; flex-wrap:nowrap !important; overflow-x:auto !important; scrollbar-width:none;
  scroll-snap-type:x mandatory; margin:0 -7px !important; padding:10px 0 !important;
}
html body .home-page-categories .videos > .row.pt_no_vid_found_trend::-webkit-scrollbar{ display:none; }
html body .home-page-categories .videos > .row.pt_no_vid_found_trend > div{
  flex:0 0 auto !important; width:clamp(262px,calc(21vw + 14px),344px) !important; min-width:0 !important; max-width:none !important; float:none !important;
  padding:0 7px !important; scroll-snap-align:start;
}
html body .home-page-categories .videos > .row.pt_no_vid_found_trend > div > *{ width:100% !important; min-width:0 !important; max-width:100% !important; }
html body .home-page-categories .videos > .row.pt_no_vid_found_trend img{ max-width:100% !important; }
@media (max-width: 767px){
  html body .home-page-categories .videos > .row.pt_no_vid_found_trend > div{ width:calc(72vw + 14px) !important; }
}

/* ================= Light mode =================
   PlayTube's own switch loads css/night-mode.css for dark and removes it for light.
   Dark tokens live in :root (also the fallback for browsers without :has());
   light tokens apply whenever night-mode.css is NOT on the page. */
html:not(:has(link.night-mode-css)){
  color-scheme:light;
  --color-bg:#f5f6fa;
  --color-surface:#ffffff;
  --color-surface-2:#eef0f6;
  --color-text:#161826;
  --ink-rgb:22,24,38;
  --bg-rgb:255,255,255;
  --color-divider:rgba(22,24,38,0.12);
  --color-neutral-200:#2b2e3d;
  --color-neutral-300:#3f424d;
  --color-neutral-400:#595d6c;
  --color-neutral-500:#75798c;
  --color-neutral-600:#9397ab;
  --color-neutral-700:#b2b6ca;
  --color-neutral-800:#cfd3e5;
  --color-accent-200:#6b4e12;
  --color-accent-300:#8a6516;
  --color-accent-600:#9c3025;
  --color-accent-800:#fad0cd;
  --color-section:#e7e5fe;
  --hero-glow:rgba(231,229,254,0.55);
  --shadow-md:0 0 0 1px rgba(22,24,38,0.08), 0 6px 18px rgba(22,24,38,0.12);
  --shadow-lg:0 0 0 1px rgba(22,24,38,0.08), 0 16px 40px rgba(22,24,38,0.18);
}
/* badges and scrims that sit on top of thumbnails stay dark in both modes */
html:not(:has(link.night-mode-css)) body .abv-cw-thumb::after{ background:linear-gradient(0deg, rgba(0,0,0,0.45), transparent 45%); }
html:not(:has(link.night-mode-css)) body .abv-cw-dur,
html:not(:has(link.night-mode-css)) body .video-list .video-duration,
html:not(:has(link.night-mode-css)) body .video-list .duration{ background:rgba(10,12,20,0.8) !important; color:#fff !important; }
html:not(:has(link.night-mode-css)) body .badge_live,
html:not(:has(link.night-mode-css)) body span.live,
html:not(:has(link.night-mode-css)) body .live-badge{ background:rgba(10,12,20,0.8) !important; color:#fad0cd !important; }
html:not(:has(link.night-mode-css)) body .abv-cw-play{ background:rgba(10,12,20,0.7); color:#fad0cd; }

/* ================= both modes: text on photos stays white; buttons keep brand colors ================= */
html body .video-info .name_artcile,
html body .video-info .name_artcile *{ color:#fff !important; text-shadow:0 1px 8px rgba(0,0,0,0.45); }
html body .video-info .name_artcile_views,
html body .video-info .name_artcile_views *{ color:rgba(255,255,255,0.78) !important; }
html body .btn-main,
html body a.btn.btn-main{ color:#fff !important; }
html body .btn-subscribe,
html body .subscribe-btn-container button.btn-subscribe,
html body .profile-container .pt_chnl_info .btn-subscribe{
  background:var(--color-accent) !important; border:1px solid var(--color-accent) !important; color:#fff !important;
}
html body .btn-subscribed,
html body .subscribe-btn-container button.btn-subscribed,
html body .profile-container .pt_chnl_info .btn-subscribed{
  background:rgba(var(--tint-rgb),0.14) !important; border:1px solid var(--color-accent) !important; color:var(--color-accent-300) !important;
}
html body .btn-subscribed svg, html body .btn-subscribe svg{ color:inherit !important; fill:currentColor; }

html body .pt_article_h_list .video-info,
html body .pt_article_h_list .video-info *{ color:#fff !important; text-shadow:0 1px 8px rgba(0,0,0,0.45); }
html body .pt_article_h_list .video-info .name_artcile_views,
html body .pt_article_h_list .video-info .name_artcile_views *{ color:rgba(255,255,255,0.78) !important; }

/* ================= Polish pass (2026-09-24): one type family, one button system, one red ================= */
:root{
  accent-color:var(--color-accent);
  --btn-h:40px;
  --focus-ring:0 0 0 3px rgba(209,73,58,0.38);
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* 1 · Typography — Inter everywhere (icon fonts excluded) */
html body :is(h1,h2,h3,h4,h5,h6,p,a,span,div,li,label,button,input,textarea,select,small,strong,b,em,td,th,figcaption,blockquote,summary):not(.fa):not([class^="fa-"]):not([class*=" fa-"]):not(.glyphicon):not([class^="glyphicon-"]):not([class*=" glyphicon-"]):not(.material-icons):not([class^="icon-"]):not([class*=" icon-"]):not(.ph):not([class^="ph-"]):not([class*=" ph-"]):not(.twa):not([class*="emoji"]):not([class*="mejs"]):not([class*="plyr"]){
  font-family:var(--font-body) !important;
}
html body{ font-size:15px; line-height:1.55; text-rendering:optimizeLegibility; }
html body h1, html body h2, html body h3{ letter-spacing:-0.02em !important; line-height:1.15; }
html body h4, html body h5{ letter-spacing:-0.01em !important; }

/* 2 · Focus — visible, on-brand, keyboard only */
html body :is(a,button,input,select,textarea,[tabindex]):focus{ outline:none; }
html body :is(a,button,[role="button"],summary,.btn):focus-visible{
  outline:2px solid var(--color-accent) !important; outline-offset:2px !important; border-radius:var(--radius-md);
}
html body :is(input,select,textarea,.form-control):focus-visible{ outline:none !important; box-shadow:var(--focus-ring) !important; border-color:var(--color-accent) !important; }

/* 3 · Buttons — primary (solid crimson), secondary (quiet surface), subscribed (tinted) */
html body :is(.btn-primary,.btn-main,a.btn-main,button.btn-main,.subscribe_btn,.follow_btn,.btn-subscribe,.button_go_live,.wow_go_live_btn,.lv-schedule-btn,#submit.btn,#publishBtn){
  display:inline-flex !important; align-items:center; justify-content:center; gap:8px;
  min-height:var(--btn-h); padding:0 18px !important;
  background:var(--color-accent) !important; background-image:none !important;
  border:1px solid var(--color-accent) !important; color:#fff !important;
  border-radius:var(--radius-md) !important;
  font-size:14px !important; font-weight:500 !important; letter-spacing:0 !important; text-transform:none !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.12), 0 6px 18px -6px rgba(209,73,58,0.55) !important;
  transition:background-color .15s var(--ease), box-shadow .2s var(--ease), transform .15s var(--ease);
  text-shadow:none !important;
}
html body :is(.btn-primary,.btn-main,a.btn-main,button.btn-main,.subscribe_btn,.follow_btn,.btn-subscribe,.button_go_live,.wow_go_live_btn,.lv-schedule-btn,#submit.btn,#publishBtn):hover{
  background:var(--color-accent-600) !important; border-color:var(--color-accent-600) !important; color:#fff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.12), 0 10px 24px -8px rgba(209,73,58,0.65) !important;
}
html body :is(.btn-primary,.btn-main,.button_go_live,.btn-subscribe,.btn):active{ transform:translateY(1px); }
html body :is(.btn-primary,.btn-main,.button_go_live,.btn-subscribe) svg,
html body :is(.btn-primary,.btn-main,.button_go_live,.btn-subscribe) img{ filter:none; }
html body :is(.btn-secondary,.btn-default,.btn-outline,.btn_outline){
  min-height:var(--btn-h); padding:0 16px !important;
  background:var(--color-surface) !important; border:1px solid var(--color-divider) !important; color:var(--color-text) !important;
  border-radius:var(--radius-md) !important; font-weight:500 !important; box-shadow:none !important;
  transition:background-color .15s var(--ease), border-color .15s var(--ease);
}
html body :is(.btn-secondary,.btn-default,.btn-outline,.btn_outline):hover{
  background:rgba(var(--ink-rgb),0.06) !important; border-color:rgba(var(--ink-rgb),0.28) !important;
}
html body :is(.btn-subscribed,.subscribe-btn-container button.btn-subscribed,.profile-container .pt_chnl_info .btn-subscribed){
  min-height:34px; padding:0 14px !important; border-radius:var(--radius-md) !important;
  background:rgba(var(--tint-rgb),0.12) !important; border:1px solid rgba(var(--tint-rgb),0.6) !important;
  color:var(--color-accent-300) !important; box-shadow:none !important; font-weight:500 !important;
}
html body .subs-amount{
  background:rgba(var(--ink-rgb),0.08) !important; color:var(--color-neutral-300) !important;
  border:0 !important; border-radius:6px !important; font-weight:500 !important;
}
/* hero Watch: solid primary with brand glow */
html body .button_watch{
  background:var(--color-accent) !important; border-color:var(--color-accent) !important; color:#fff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.14), 0 10px 30px -8px rgba(209,73,58,0.7) !important;
}
html body .button_watch:hover{ background:var(--color-accent-600) !important; color:#fff !important; }
html body .button_watch img{ filter:brightness(0) invert(1); }

/* 4 · One red — PlayTube's #DF0430 / #C00000 mapped onto the brand crimson scale */
html body #new-messages, html body #new-notifications,
html body .live_counter{ background:var(--color-accent) !important; color:#fff !important; box-shadow:0 0 0 2px var(--color-bg) !important; }
html body input:checked + .slider, html body .slider.round:has(~ input:checked){ background:var(--color-accent) !important; }
html body .switch input:checked + .slider.round{ background:var(--color-accent) !important; }
html body a.hash, html body .hash{ color:var(--color-accent-300) !important; }
html body .tab-btn.lv-active{ background:var(--color-accent) !important; color:#fff !important; border-color:var(--color-accent) !important; }
html body .lv-rtmp-block{ background:rgba(var(--tint-rgb),0.10) !important; border-color:rgba(var(--tint-rgb),0.5) !important; color:var(--color-text) !important; }

/* 5 · Listing cards — avatar no longer collides with the title */
html body .video_channel_details{ display:flex !important; align-items:flex-start !important; gap:10px !important; }
html body .video_channel_details > a{ flex:0 0 36px !important; width:36px !important; height:36px !important; margin:0 !important; }
html body .video_channel_details > a img{ width:36px !important; height:36px !important; border-radius:50% !important; object-fit:cover; }
html body .video_channel_details .channel_details{ min-width:0 !important; flex:1 1 auto; }
html body .video_channel_details .channel_details > a,
html body .video_channel_details .video_channel_title{
  display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:14px !important; font-weight:500 !important; line-height:1.35 !important; color:var(--color-text) !important; white-space:normal !important;
}

/* 6 · Header logo at a legible size */
html body .header-layout .navbar-brand.logo-img{ display:inline-flex !important; align-items:center; height:auto !important; padding:0 8px !important; }
html body .header-layout .navbar-brand.logo-img img{ height:34px !important; width:auto !important; max-width:150px !important; max-height:none !important; object-fit:contain; }

/* 7 · Surfaces — softer edges, consistent elevation */
html body :is(.box_light_black,.padding_box_light_black,.new_box_color,.article-categories,.popular_below_wrap){
  box-shadow:0 0 0 1px rgba(var(--ink-rgb),0.06), 0 12px 32px -18px rgba(0,0,0,0.45) !important;
}
html body :is(.dropdown-menu,.ani-acc-menu,.notfi-dropdown,.pt-create-menu){ border-radius:12px !important; }
html body hr{ border-color:var(--color-divider) !important; opacity:1; }

/* 8 · Motion — respect reduced-motion */
@media (prefers-reduced-motion: reduce){
  html body *, html body *::before, html body *::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* 6b · Header fit — search shrinks instead of overlapping; long names truncate */
html body #header_change .navbar-header .search-header{ flex:1 1 200px !important; min-width:0 !important; width:auto !important; }
html body #header_change .navbar-header .search-header .form-group,
html body #header_change .navbar-header .search-header input{ width:100% !important; min-width:0 !important; }
html body .header-layout .name_loggedin_user{
  display:inline-block !important; max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;
}
@media (max-width: 1240px){ html body .header-layout .name_loggedin_user{ display:none !important; } }

html body .sidebar_video_bottom, html body .sidebar_video_bottom *,
html body .related-videos .video-views, html body .pt_video_side_vids .video-views{ color:var(--color-neutral-400) !important; }

@media (max-width: 767px){
  html body .abv-row-sub{ display:none !important; }
  html body .abv-cw .abv-row-head h2, html body .abv-your-channels .abv-row-head h2{ white-space:nowrap; font-size:18px !important; }
  html body .abv-cw .abv-row-head > a{ white-space:nowrap; }
}

/* ================= Gold secondary accent (2026-09-24): no pink — crimson = action/live, gold = links, states, highlights ================= */
html body .yp_side_drawer ul.sections li.active > a{ box-shadow:inset 2px 0 0 var(--color-accent-2) !important; }
html body .yp_side_drawer ul.sections li.active > a::before{ background:var(--color-accent-2) !important; box-shadow:0 0 8px var(--color-accent-2) !important; }
html body .badge_live, html body span.live, html body .live-badge,
html:not(:has(link.night-mode-css)) body .badge_live,
html:not(:has(link.night-mode-css)) body span.live,
html:not(:has(link.night-mode-css)) body .live-badge{
  background:var(--color-accent) !important; color:#fff !important; box-shadow:0 0 12px rgba(209,73,58,0.45) !important;
}
html body .abv-cw-play, html:not(:has(link.night-mode-css)) body .abv-cw-play{ color:#fff !important; box-shadow:0 0 0 1px rgba(255,255,255,0.35), 0 6px 16px rgba(0,0,0,0.4) !important; }
html body .abv-ch:hover .abv-ch-av{ box-shadow:0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-accent-2), 0 0 18px rgba(193,147,44,0.45) !important; }
html body .pt_new_home_feat_vidd .feature_wrap > h4::before{ background:var(--color-accent-2) !important; box-shadow:0 0 10px rgba(193,147,44,0.6) !important; }
