/* ITAHUKA Video Platform v5.0.7 — mobile UX correction.
   Structural mobile-only fixes: single professional header identity, working
   off-canvas navigation, readable community tabs, collision-free schedule,
   and one-card-at-a-time media shelves. Desktop remains unchanged. */

:root {
  --it-mobile-drawer-width: min(320px, 88vw);
}

/* Use the runtime mobile class so iPadOS "Request Desktop Website" still
   receives the application layout even when its CSS viewport is wide. */
body.it-mobile-app,
html.it-mobile-shell body.public-area {
  overflow-x: clip !important;
}

/* ---------- One professional mobile header ---------- */
body.it-mobile-app .site-header.yt-header,
html.it-mobile-shell body.public-area .site-header.yt-header {
  height: calc(64px + env(safe-area-inset-top)) !important;
  min-height: calc(64px + env(safe-area-inset-top)) !important;
}
body.it-mobile-app .site-header.yt-header .nav-shell,
html.it-mobile-shell body.public-area .site-header.yt-header .nav-shell {
  display: grid !important;
  grid-template-columns: 52px minmax(72px, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: none !important;
  height: 64px !important;
  padding: 0 max(10px, env(safe-area-inset-right)) 0 max(10px, env(safe-area-inset-left)) !important;
}
body.it-mobile-app .site-header.yt-header .header-left,
html.it-mobile-shell body.public-area .site-header.yt-header .header-left {
  display: contents !important;
}
body.it-mobile-app .site-header.yt-header .menu-button,
html.it-mobile-shell body.public-area .site-header.yt-header .menu-button {
  grid-column: 1 !important;
  justify-self: start !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  border-radius: 14px !important;
}
body.it-mobile-app .site-header.yt-header .brand.yt-brand,
html.it-mobile-shell body.public-area .site-header.yt-header .brand.yt-brand {
  grid-column: 2 !important;
  justify-self: center !important;
  width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}
body.it-mobile-app .site-header.yt-header .brand-logo-image,
body.it-mobile-app .site-header.yt-header .brand-logo-image img,
html.it-mobile-shell body.public-area .site-header.yt-header .brand-logo-image,
html.it-mobile-shell body.public-area .site-header.yt-header .brand-logo-image img {
  display: block !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  object-fit: contain !important;
}
body.it-mobile-app .site-header.yt-header .site-logo-text,
html.it-mobile-shell body.public-area .site-header.yt-header .site-logo-text {
  display: none !important;
}
body.it-mobile-app .site-header.yt-header .account-links,
html.it-mobile-shell body.public-area .site-header.yt-header .account-links {
  grid-column: 3 !important;
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
}
/* The bottom You tab and drawer provide account access. Hiding the header
   avatar removes the duplicated ITAHUKA logo visible in the screenshots. */
body.it-mobile-app .site-header.yt-header .account-menu,
html.it-mobile-shell body.public-area .site-header.yt-header .account-menu {
  display: none !important;
}
body.it-mobile-app .site-header.yt-header .mobile-search-button,
body.it-mobile-app .site-header.yt-header .notification-link,
html.it-mobile-shell body.public-area .site-header.yt-header .mobile-search-button,
html.it-mobile-shell body.public-area .site-header.yt-header .notification-link {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  color: var(--it-app-text, #101114) !important;
}
body.it-mobile-app .site-header.yt-header .mobile-search-button svg,
body.it-mobile-app .site-header.yt-header .notification-link svg,
html.it-mobile-shell body.public-area .site-header.yt-header .mobile-search-button svg,
html.it-mobile-shell body.public-area .site-header.yt-header .notification-link svg {
  width: 27px !important;
  height: 27px !important;
  fill: currentColor !important;
}
body.it-mobile-app .site-header.yt-header .sign-in-button,
html.it-mobile-shell body.public-area .site-header.yt-header .sign-in-button {
  display: inline-grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 72px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border: 1px solid var(--it-app-border, #e1e3e8) !important;
  border-radius: 14px !important;
  background: var(--it-app-surface-alt, #f3f4f6) !important;
  color: var(--it-app-text, #101114) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
}
body.it-mobile-app .channel-tabs > a[aria-label="Search channel"],
html.it-mobile-shell body.public-area .channel-tabs > a[aria-label="Search channel"] {
  display: none !important;
}

/* ---------- Functional off-canvas drawer ---------- */
body.it-mobile-app .public-sidebar.yt-sidebar,
html.it-mobile-shell body.public-area .public-sidebar.yt-sidebar {
  display: block !important;
  position: fixed !important;
  z-index: 2200 !important;
  inset: 0 auto 0 0 !important;
  width: var(--it-mobile-drawer-width) !important;
  min-width: var(--it-mobile-drawer-width) !important;
  max-width: var(--it-mobile-drawer-width) !important;
  height: 100dvh !important;
  padding: max(14px, env(safe-area-inset-top)) 12px calc(28px + env(safe-area-inset-bottom)) !important;
  overflow-y: auto !important;
  transform: translate3d(-105%, 0, 0) !important;
  transition: transform .22s ease !important;
  border-right: 1px solid var(--it-app-border, #e1e3e8) !important;
  background: var(--it-app-surface, #fff) !important;
  box-shadow: 16px 0 44px rgba(15, 23, 42, .22) !important;
  visibility: visible !important;
}
body.it-mobile-app.sidebar-open .public-sidebar.yt-sidebar,
html.it-mobile-shell body.public-area.sidebar-open .public-sidebar.yt-sidebar {
  transform: translate3d(0, 0, 0) !important;
}
body.it-mobile-app.sidebar-open,
html.it-mobile-shell body.public-area.sidebar-open {
  overflow: hidden !important;
}
body.it-mobile-app .navigation-backdrop,
html.it-mobile-shell body.public-area .navigation-backdrop {
  display: block !important;
  position: fixed !important;
  z-index: 2150 !important;
  inset: 0 !important;
  background: rgba(15, 23, 42, .48) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
body.it-mobile-app.sidebar-open .navigation-backdrop,
html.it-mobile-shell body.public-area.sidebar-open .navigation-backdrop {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.mobile-drawer-head {
  position: sticky;
  top: calc(-1 * max(14px, env(safe-area-inset-top)));
  z-index: 2;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  margin: 0 -4px 10px;
  padding: max(8px, env(safe-area-inset-top)) 4px 8px;
  border-bottom: 1px solid var(--it-app-border, #e1e3e8);
  background: var(--it-app-surface, #fff);
}
.mobile-drawer-head img { width: 42px; height: 42px; object-fit: contain; border-radius: 50%; }
.mobile-drawer-head strong { overflow: hidden; color: var(--it-app-text, #101114); font-size: 18px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.mobile-drawer-close { width: 44px; height: 44px; border: 0; border-radius: 12px; background: var(--it-app-surface-alt, #f3f4f6); color: var(--it-app-text, #101114); font-size: 26px; }
body.it-mobile-app .public-sidebar nav > a,
html.it-mobile-shell body.public-area .public-sidebar nav > a {
  min-height: 48px !important;
  border-radius: 12px !important;
  color: var(--it-app-text, #101114) !important;
  font-size: 15px !important;
}
body.it-mobile-app .public-sidebar nav > a.active,
html.it-mobile-shell body.public-area .public-sidebar nav > a.active {
  background: color-mix(in srgb, var(--it-app-accent, #e60017) 10%, transparent) !important;
  color: var(--it-app-accent, #e60017) !important;
}

/* ---------- Community tabs: never hide labels behind a red block ---------- */
body.it-mobile-app .it-community-chat--functional .it-community-chat__tabs,
html.it-mobile-shell body.public-area .it-community-chat--functional .it-community-chat__tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--it-app-border, #e1e3e8) !important;
  background: var(--it-app-surface-alt, #f3f4f6) !important;
}
body.it-mobile-app .it-community-chat--functional .it-community-chat__tabs button,
html.it-mobile-shell body.public-area .it-community-chat--functional .it-community-chat__tabs button {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--it-app-text, #101114) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  opacity: .72;
}
body.it-mobile-app .it-community-chat--functional .it-community-chat__tabs button.is-active,
body.it-mobile-app .it-community-chat--functional .it-community-chat__tabs button[aria-selected="true"],
html.it-mobile-shell body.public-area .it-community-chat--functional .it-community-chat__tabs button.is-active,
html.it-mobile-shell body.public-area .it-community-chat--functional .it-community-chat__tabs button[aria-selected="true"] {
  border: 0 !important;
  background: var(--it-app-surface, #fff) !important;
  color: var(--it-app-accent, #e60017) !important;
  opacity: 1 !important;
  box-shadow: inset 0 -3px 0 var(--it-app-accent, #e60017) !important;
}
/* Keep the mobile Live control deck legible and non-overlapping. */
body.it-mobile-app .it-live-action-group,
html.it-mobile-shell body.public-area .it-live-action-group {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 0 0 4px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}
body.it-mobile-app .it-live-action-group::-webkit-scrollbar { display: none; }
body.it-mobile-app .it-live-action,
html.it-mobile-shell body.public-area .it-live-action {
  flex: 0 0 auto !important;
  min-width: 104px !important;
  min-height: 44px !important;
  padding: 0 13px !important;
  white-space: nowrap !important;
  scroll-snap-align: start;
}

/* ---------- Collision-free mobile schedule ---------- */
body.it-mobile-app.schedule-public-page .schedule-page,
html.it-mobile-shell body.schedule-public-page .schedule-page {
  width: 100% !important;
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 12px 10px 28px !important;
}
body.it-mobile-app.schedule-public-page .schedule-page-head,
html.it-mobile-shell body.schedule-public-page .schedule-page-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}
body.it-mobile-app.schedule-public-page .schedule-page-title h1,
html.it-mobile-shell body.schedule-public-page .schedule-page-title h1 {
  margin: 2px 0 4px !important;
  font-size: clamp(28px, 7vw, 40px) !important;
  line-height: 1.05 !important;
}
body.it-mobile-app.schedule-public-page .schedule-timezone,
html.it-mobile-shell body.schedule-public-page .schedule-timezone {
  width: 100% !important;
  max-width: none !important;
  min-height: 48px !important;
}
body.it-mobile-app.schedule-public-page .schedule-week-navigation,
html.it-mobile-shell body.schedule-public-page .schedule-week-navigation {
  grid-template-columns: 42px minmax(0, 1fr) 42px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
body.it-mobile-app.schedule-public-page .schedule-week-strip,
body.it-mobile-app.schedule-public-page .schedule-filters,
body.it-mobile-app.schedule-public-page .schedule-dayparts,
html.it-mobile-shell body.schedule-public-page .schedule-week-strip,
html.it-mobile-shell body.schedule-public-page .schedule-filters,
html.it-mobile-shell body.schedule-public-page .schedule-dayparts {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}
body.it-mobile-app.schedule-public-page :is(.schedule-week-strip,.schedule-filters,.schedule-dayparts)::-webkit-scrollbar { display: none; }
body.it-mobile-app.schedule-public-page .schedule-dashboard,
html.it-mobile-shell body.schedule-public-page .schedule-dashboard {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
}
body.it-mobile-app.schedule-public-page .schedule-side-column,
body.it-mobile-app.schedule-public-page .schedule-now-panel,
body.it-mobile-app.schedule-public-page .schedule-auto-card,
html.it-mobile-shell body.schedule-public-page .schedule-side-column,
html.it-mobile-shell body.schedule-public-page .schedule-now-panel,
html.it-mobile-shell body.schedule-public-page .schedule-auto-card {
  display: none !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-panel,
body.it-mobile-app.schedule-public-page .schedule-world-panel,
html.it-mobile-shell body.schedule-public-page .schedule-list-panel,
html.it-mobile-shell body.schedule-public-page .schedule-world-panel {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: hidden !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-heading,
html.it-mobile-shell body.schedule-public-page .schedule-list-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 52px !important;
  padding: 0 14px !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-heading h2,
html.it-mobile-shell body.schedule-public-page .schedule-list-heading h2 { display: none !important; }
body.it-mobile-app.schedule-public-page .schedule-list-heading strong,
html.it-mobile-shell body.schedule-public-page .schedule-list-heading strong {
  overflow: hidden !important;
  max-width: 100% !important;
  font-size: 15px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body.it-mobile-app.schedule-public-page .schedule-day-list,
html.it-mobile-shell body.schedule-public-page .schedule-day-list {
  position: relative !important;
  min-height: 0 !important;
  padding: 4px 12px 10px !important;
  overflow: visible !important;
}
body.it-mobile-app.schedule-public-page .schedule-day-list::before,
html.it-mobile-shell body.schedule-public-page .schedule-day-list::before {
  left: 84px !important;
  top: 18px !important;
  bottom: 18px !important;
  width: 2px !important;
  background: var(--it-app-border, #e1e3e8) !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-row,
html.it-mobile-shell body.schedule-public-page .schedule-list-row {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: start !important;
  gap: 7px 18px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 96px !important;
  margin: 0 !important;
  padding: 13px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--it-app-border, #e1e3e8) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-row::before,
html.it-mobile-shell body.schedule-public-page .schedule-list-row::before { display: none !important; }
body.it-mobile-app.schedule-public-page .schedule-list-row > time,
html.it-mobile-shell body.schedule-public-page .schedule-list-row > time {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  display: grid !important;
  align-content: start !important;
  justify-items: end !important;
  gap: 1px !important;
  min-width: 0 !important;
  padding-top: 3px !important;
  color: var(--it-app-text, #101114) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  text-align: right !important;
  white-space: normal !important;
}
body.it-mobile-app.schedule-public-page .schedule-timeline-node,
html.it-mobile-shell body.schedule-public-page .schedule-timeline-node {
  left: 65px !important;
  top: 22px !important;
  width: 15px !important;
  height: 15px !important;
  transform: none !important;
  border-width: 3px !important;
  box-shadow: 0 0 0 4px var(--it-app-surface, #fff) !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-copy,
html.it-mobile-shell body.schedule-public-page .schedule-list-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 4px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-copy .schedule-state-chip,
html.it-mobile-shell body.schedule-public-page .schedule-list-copy .schedule-state-chip {
  justify-self: start !important;
  max-width: 100% !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-copy h3,
html.it-mobile-shell body.schedule-public-page .schedule-list-copy h3 {
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--it-app-text, #101114) !important;
  font-size: clamp(15px, 3.8vw, 18px) !important;
  font-weight: 850 !important;
  line-height: 1.24 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-copy > strong,
html.it-mobile-shell body.schedule-public-page .schedule-list-copy > strong {
  overflow: hidden !important;
  color: var(--it-app-muted, #65686f) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-copy p,
html.it-mobile-shell body.schedule-public-page .schedule-list-copy p {
  display: none !important;
}
body.it-mobile-app.schedule-public-page .schedule-row-action,
html.it-mobile-shell body.schedule-public-page .schedule-row-action {
  grid-column: 2 !important;
  grid-row: 2 !important;
  justify-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 40px !important;
  margin: 2px 0 0 !important;
  padding: 0 13px !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
body.it-mobile-app.schedule-public-page .schedule-list-row.is-current,
html.it-mobile-shell body.schedule-public-page .schedule-list-row.is-current {
  margin: 6px 0 !important;
  padding: 13px 10px 13px 0 !important;
  border: 1px solid color-mix(in srgb, var(--it-app-accent, #e60017) 55%, var(--it-app-border, #e1e3e8)) !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--it-app-accent, #e60017) 5%, var(--it-app-surface, #fff)) !important;
}
body.it-mobile-app.schedule-public-page .schedule-now-rail,
html.it-mobile-shell body.schedule-public-page .schedule-now-rail { pointer-events: none !important; }
body.it-mobile-app.schedule-public-page .schedule-now-rail::before,
body.it-mobile-app.schedule-public-page .schedule-now-rail i,
html.it-mobile-shell body.schedule-public-page .schedule-now-rail::before,
html.it-mobile-shell body.schedule-public-page .schedule-now-rail i { left: 74px !important; }
body.it-mobile-app.schedule-public-page .schedule-now-rail span,
html.it-mobile-shell body.schedule-public-page .schedule-now-rail span { display: none !important; }
body.it-mobile-app.schedule-public-page .schedule-world-grid,
html.it-mobile-shell body.schedule-public-page .schedule-world-grid {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(126px, 40vw) !important;
  gap: 8px !important;
  width: 100% !important;
  padding: 10px 12px 13px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}
body.it-mobile-app.schedule-public-page .schedule-world-grid::-webkit-scrollbar { display: none; }
body.it-mobile-app.schedule-public-page .schedule-world-clock,
html.it-mobile-shell body.schedule-public-page .schedule-world-clock {
  min-width: 0 !important;
  min-height: 86px !important;
  scroll-snap-align: start;
}

/* ---------- Professional one-card media presentation ---------- */
body.it-mobile-app.home-page .video-shelf-frame,
html.it-mobile-shell body.home-page .video-shelf-frame {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body.it-mobile-app.home-page .video-shelf-arrow,
html.it-mobile-shell body.home-page .video-shelf-arrow { display: none !important; }
body.it-mobile-app.home-page .video-shelf,
html.it-mobile-shell body.home-page .video-shelf {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: 100% !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 0 !important;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
body.it-mobile-app.home-page .video-shelf::-webkit-scrollbar { display: none; }
body.it-mobile-app.home-page .video-shelf > .video-card,
html.it-mobile-shell body.home-page .video-shelf > .video-card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}
body.it-mobile-app.home-page .video-shelf .video-thumb,
html.it-mobile-shell body.home-page .video-shelf .video-thumb {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 14px !important;
}
.mobile-shelf-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 26px;
  padding: 8px 0 0;
}
.mobile-shelf-pagination button {
  width: 7px;
  height: 7px;
  min-width: 7px;
  min-height: 7px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--it-app-text, #101114) 24%, transparent);
}
.mobile-shelf-pagination button.is-active {
  width: 20px;
  border-radius: 999px;
  background: var(--it-app-accent, #e60017);
}
body.it-mobile-app.video-library-page .library-video-grid,
html.it-mobile-shell body.video-library-page .library-video-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  max-width: 760px !important;
  margin-inline: auto !important;
}
body.it-mobile-app.video-library-page .library-video-card,
html.it-mobile-shell body.video-library-page .library-video-card {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: var(--it-app-surface, #fff) !important;
  box-shadow: 0 6px 22px rgba(15, 23, 42, .07) !important;
  overflow: hidden !important;
}
body.it-mobile-app.video-library-page .library-video-thumb,
html.it-mobile-shell body.video-library-page .library-video-thumb {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 0 !important;
}
body.it-mobile-app.video-library-page .library-video-info-row,
html.it-mobile-shell body.video-library-page .library-video-info-row {
  padding: 12px 14px 15px !important;
}
body.it-mobile-app.video-library-page .library-video-title,
html.it-mobile-shell body.video-library-page .library-video-title {
  font-size: 16px !important;
  line-height: 1.3 !important;
}

@media (max-width: 430px) {
  body.it-mobile-app .site-header.yt-header .nav-shell { grid-template-columns: 48px minmax(48px, 1fr) auto !important; gap: 4px !important; padding-inline: 7px !important; }
  body.it-mobile-app .site-header.yt-header .brand.yt-brand { width: 44px !important; max-width: 44px !important; }
  body.it-mobile-app .site-header.yt-header .brand-logo-image,
  body.it-mobile-app .site-header.yt-header .brand-logo-image img { width: 40px !important; height: 40px !important; min-width: 40px !important; }
  body.it-mobile-app .site-header.yt-header .account-links { gap: 0 !important; }
  body.it-mobile-app .site-header.yt-header .sign-in-button { min-width: 66px !important; padding-inline: 9px !important; }
  body.it-mobile-app.schedule-public-page .schedule-day-list::before { left: 78px !important; }
  body.it-mobile-app.schedule-public-page .schedule-list-row { grid-template-columns: 57px minmax(0, 1fr) !important; gap: 7px 17px !important; }
  body.it-mobile-app.schedule-public-page .schedule-timeline-node { left: 60px !important; }
  body.it-mobile-app.schedule-public-page .schedule-now-rail::before,
  body.it-mobile-app.schedule-public-page .schedule-now-rail i { left: 68px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.it-mobile-app .public-sidebar.yt-sidebar { transition: none !important; }
  body.it-mobile-app.home-page .video-shelf { scroll-behavior: auto !important; }
}