body { font-family: Arial, sans-serif; background: #0f0f0f; color: #fff; margin: 0; padding: 0; }
header { padding: 16px 24px; background: #0f0f0f; border-bottom: 1px solid #222; position: sticky; top: 0; z-index: 100; }
.logo { font-size: 2.1rem; font-weight: bold; background: linear-gradient(90deg, #ff0000, #ff4d4d); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 0; display: inline-block; }
#search-container { position: relative; width: 100%; max-width: 620px; margin: 16px auto 0; }
#search { width: 100%; padding: 12px 20px; font-size: 17px; border: none; border-radius: 999px; background: #222; color: white; }
#suggestions { position: absolute; top: 100%; left: 0; width: 100%; background: #222; border-radius: 0 0 12px 12px; max-height: 300px; overflow-y: auto; z-index: 99; display: none; }
.suggestion { padding: 12px 20px; cursor: pointer; border-bottom: 1px solid #333; }
.suggestion:hover { background: #333; }
#results, #trending, #related { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; max-width: 1400px; margin: 32px auto; padding: 0 20px; }
.video-card { background: #181818; border-radius: 12px; overflow: hidden; cursor: pointer; transition: all 0.2s; }
.video-card:hover { transform: scale(1.05); box-shadow: 0 16px 32px rgba(0,0,0,0.55); }
.thumbnail { width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform 0.3s; }
.video-card:hover .thumbnail { transform: scale(1.1); }
.details { padding: 14px 16px; }
h3 { margin: 0 0 8px; font-size: 1.05em; line-height: 1.38; }
.channel { color: #aaaaaa; font-size: 0.92em; }
#modal { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.94); z-index: 1000; justify-content: center; align-items: center; flex-direction: column; }
iframe { width: 92%; max-width: 1180px; height: 70vh; border: none; border-radius: 16px; }
#backBtn { margin-top: 20px; padding: 10px 20px; background: #ff0000; border: none; color: white; cursor: pointer; border-radius: 999px; font-size: 1rem; }
.section-title { max-width: 1400px; margin: 40px auto 16px; padding: 0 24px; font-size: 1.5rem; }