  bodyx {
    margin: 0; font-family: Arial, sans-serif; background: #f9f9f9; overflow-x: hidden; }

  /*Scrolling Destination*/
    .sectionsc {display: flex;justify-content: center;align-items: center;font-size: 12px;}

    .btn-scroll {padding: 7px 20px;background: #007bff;color: white;border: none;border-radius: 2px;cursor: pointer;font-size: 12px;}
.btn-scroll:active {background: #213641;transform: scale(0.95);}
  
  /* Download Widget */
  .download-widget { text-align: center; padding: 20px;}

  .download-widget h4 { margin-bottom: 20px;}

  #downloadBtn { padding: 10px 20px; font-size: 16px; cursor: pointer; border: none; border-radius: 5px; background-color: #3498db; color: white; }

  #downloadBtn:disabled { opacity: 0.6; cursor: not-allowed; }

  #customAdBlock { margin-top: 20px; display: none;  max-width: 300px; margin-left: auto; margin-right: auto; }
    /* Sliding Panel (Media Drive) */
 #mediaDrivePanel {position: fixed; top: 0; right: -100%; width: 100%; height: 100%; background: #fff; box-shadow: -2px 0 5px rgba(0,0,0,0); /* -2px 0 5px rgba(0,0,0,0.1); */ z-index: 1000; transition: right 0.5s ease; overflow-x: auto; /* allow scrolling */ -webkit-overflow-scrolling: touch;}

  #mediaDrivePanel.active { right : 0;  }

  #mediaDriveHeader { display: flex; align-items: center; background: #0078d4; color: white; padding: 10px;  }

  #backBtn { background: #fff; color: #0078d4;  border: none; padding: 6px 12px; border-radius: 5px;  cursor: pointer; margin-right: 10px; font-weight: bold; font-size: 90%; }

  #video-info-bar {display: flex; align-items: center; justify-content: space-between; padding: 10px; background: #fff; border-bottom: 1px solid #ddd; }

  #video-name { font-family: Arial, sans-serif;font-weight: bold;font-size: 15px; }
#video-namemovie {font-family: Arial, sans-serif;font-weight: bold;font-size: 15px;}
  #video-list-container {flex-grow: 1; overflow-y: auto; max-height: 50vh; /* optional: limit list to 50% of screen height */ padding: 10px; background: #fff; scroll-behavior: smooth; -webkit-overflow-scrolling: touch;}

#video-list {display: grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap: 10px;

  /* allow internal scrolling if needed */
  overflow-y: auto;
}

  .video-btn {  font-family: Arial, sans-serif;  padding: 12px; background: #0078d4; color: white;  border: none; border-radius: 6px; cursor: pointer; text-align: center; /*display: flex;*/  justify-content: space-between; -webkit-tap-highlight-color: transparent; }

  .video-btn.active {background-color: #005a9e; box-shadow: 0 0 8px #005a9e; font-weight: bold;}
ttle { font-size: 100%;font-weight: bold;}
/* Transparent overlay to block &quot;Open in Drive&quot; click */

#player-container { position: relative; width: 100%; padding-top: 56.25%; background: #000; flex-shrink: 0; /* prevent flex-grow causing oversize */}
  
  #invisible-block {position: absolute;top: 0;left: 0;width: 50px;height: 50px;background: transparent;pointer-events: all; /* Absorbs clicks */
    z-index: 10000;}
#video-list-containermovie {padding: 10px;background: #fff;text-align: center;}
    .download-btnmovie {font-family: Arial, sans-serif;display: inline-block;margin: 8px;padding: 10px 20px;color: black;background: white;border: 1px solid;border-radius: 6px;cursor: pointer;font-size: 14px;font-weight: bold;text-decoration: none;-webkit-overflow-scrolling: touch;-webkit-tap-highlight-color: transparent;}
  .download-btnmovie:active {background-color: #0078d4;font-weight: bold;color: white;text-decoration: none !important;}
  
/* make sure iframe can receive touch events */
#player-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; pointer-events: auto; /* allow touch */}

#channel-icon-overlay { position: absolute; top: 9px; right: 9px; z-index: 10; display: block; width: 50px; /* adjust size if needed */ height: 50px; /* adjust size if needed */
 border-radius: 1px; overflow: hidden;  padding: 3px;  cursor: default;
  pointer-events: auto; /* blocks Drive click */}

#channel-icon-overlay img { width: 40px; height: 40px; object-fit: cover; border-radius: 1px;}

#video-list-container { padding: 10px; background: #fff;
  /* remove flex-grow so content height is natural */
}
#download-btn {font-family: Arial, sans-serif; padding: 1px 4px; display: flex; align-items: center; justify-content: center; position: relative; min-width: 50px; height: 40px; font-size: 15px; text-decoration: none; background: #0078d4; color: white; border-radius: 5px; transition: background 0.2s ease; font-weight: bold;
  transform: rotate(0deg); /* no rotation on the full button */
  -webkit-tap-highlight-color: transparent;}

#download-btn:active { background: #213641; transform: scale(0.95); }

#download-btn .arrow {transform: rotate(90deg);}

#download-btn .countdown-text {transform: rotate(0deg); font-size: 14px; display: none;}

.collapse-quote-box { position: relative; border: 1px solid #ccc; border-left: 4px solid #2196F3; background: #f1f8ff; padding: 10px 15px 30px 15px; margin: 1em 0; border-radius: 6px; font-family: Arial, sans-serif; overflow: hidden;}
.collapse-quote-box summary { cursor: pointer; display: flex; justify-content: space-between; align-items: center; -webkit-tap-highlight-color: transparent;
}
.collapse-quote-box summary::-webkit-details-marker {display: none;}
.label-line { display: flex; align-items: center; font-weight: bold; font-size: 14px; color: #333;}
.info-icon { width: 18px; height: 18px; background: #e3f2fd; border-radius: 50%; margin-right: 6px; display: flex; align-items: center; justify-content: center;}
.info-icon svg { width: 20px; height: 20px; fill: #2196F3;}
.toggle-icon { position: absolute; bottom: 8px; right: 12px; width: 16px; height: 16px;
}
.toggle-icon svg { width: 150%; height: 150%; fill: #2196F3; transition: transform 0.3s;}
details[open] .arrow-down { display: none; }
details:not([open]) .arrow-up { display: none; }
#synopsisBox { font-size: 13px; line-height: 1.4; color: #333; margin-top: 12px;}
#synopsisBox h3 { font-size: 15px; font-weight: bold; margin: 10px 0 6px;}
#synopsisBox strong {font-weight: bold;}
  
  .private-box {
  border: 1px solid black;
  border-radius: 2px;
  background: black;
  padding: 0 1px;
  font-size: 12px;
  font-weight: bold;
}