/* 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(233,233,237,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:#fad0cd;
  --color-accent-300:#f2a29b;
  --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;

  /* 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(233,233,237,0.3);
  --abv-crimson:var(--color-accent);
  --abv-crimson-hover:var(--color-accent-600);
  --abv-crimson-light:rgba(209,73,58,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(209,73,58,0.3); }

/* ================= 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(233,233,237,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(233,233,237,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(209,73,58,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(233,233,237,0.14) !important;
  color:var(--color-text) !important;
}
html body .sec_lay_hdr > li > a:hover{ background:rgba(233,233,237,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(233,233,237,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(233,233,237,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(233,233,237,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(209,73,58,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(209,73,58,0.24) !important; color:var(--color-accent-200) !important; }
html body .feat_vid_big_play_btn .btn.btn-main{
  background:rgba(22,24,38,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(233,233,237,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(233,233,237,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(209,73,58,0.12) !important; color:var(--color-accent-200) !important;
  box-shadow:inset 0 0 0 1px rgba(209,73,58,0.55) !important;
}
/* legacy pill selector */
html body .pt_sec_nav_slide a{
  color:var(--color-text) !important;
  background:rgba(233,233,237,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(233,233,237,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(22,24,38,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(22,24,38,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(209,73,58,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(209,73,58,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(233,233,237,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:#3f424d; border-radius:6px; }
html body ::-webkit-scrollbar-thumb:hover{ background:#595d6c; }

/* ================= 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:#3f424d !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(233,233,237,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:#161826; --bg-surface:#232532; --bg-sidebar:#232532; --text:#e9e9ed;
  --border:rgba(233,233,237,0.12);
  --text-muted:rgba(233,233,237,0.6); --text-dim:rgba(233,233,237,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(22,24,38,0), var(--color-bg)) !important; }
html body .movie_slider.artcile_before::after{ background:linear-gradient(rgba(22,24,38,0) 0%, rgba(22,24,38,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%, rgba(38,42,96,0.55), transparent 70%),
    linear-gradient(0deg, var(--color-bg) 0%, rgba(22,24,38,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(22,24,38,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(22,24,38,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(22,24,38,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(233,233,237,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(22,24,38,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(22,24,38,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(22,24,38,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(233,233,237,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; }
}
