:root{--primary: #FB8500;--secondary: #023047;--accent: #FFB703;--bg: #F1FAEE;--text-dark: #1D3557}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--bg);color:var(--text-dark);font-family:Inter,sans-serif;line-height:1.6}.header{background:var(--primary);padding:20px;color:#fff;display:flex;justify-content:space-between;align-items:center;border-bottom:4px solid var(--accent)}.header .logo{font-size:28px;font-weight:700}.header .logo span{color:var(--accent)}.header nav a{color:#fff;margin-left:20px;text-decoration:none;font-weight:700;transition:.2s}.header nav a:hover{color:var(--accent)}.afro-pattern{background-image:url(pattern.svg);background-size:200px;background-repeat:repeat;opacity:.95}.section{padding:40px 20px}.section-title{font-size:26px;font-weight:700;border-left:6px solid var(--primary);padding-left:10px;margin-bottom:20px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px}.card{background:#fff;border-radius:16px;border:2px solid var(--accent);padding:12px;text-align:center;transition:.2s;box-shadow:0 4px 8px #0000001a}.card img{width:100%;border-radius:10px;margin-bottom:8px}.card:hover{transform:translateY(-6px);border-color:var(--primary)}.player-section{padding:40px 20px}video{width:100%;max-width:800px;height:auto;border:4px solid var(--primary);border-radius:12px;display:block;margin:auto;background:#000}body{margin:0;font-family:Poppins,Arial,sans-serif;background:url(/assets/baobab-sojQPEHW.png) no-repeat center center fixed;background-size:cover}.title{color:#fff;font-size:2rem;font-weight:700;background-image:url(/assets/logo-DPdMjN4D.png);background-size:40px 40px;background-repeat:no-repeat;background-position:left center;padding-left:55px}.search-bar{width:90%;padding:12px;margin:15px auto;display:block;font-size:17px;border-radius:10px;border:2px solid #4e8ef7;background:#fff;transition:.25s ease}.search-bar:focus{border-color:#1c6efe;box-shadow:0 0 10px #0003}.container{display:flex;height:calc(100vh - 120px);padding:10px;gap:15px}.sidebar{width:300px;background:#fff;padding:15px;overflow-y:auto;border-radius:12px;box-shadow:0 5px 15px #00000026;animation:slideIn .8s ease-out}details{margin-bottom:12px}summary{cursor:pointer;font-weight:700;padding:10px;font-size:1rem;border-radius:6px;background:#f0f0f0;transition:.2s ease}summary:hover{background:#e5e5e5}.channel-btn{display:block;width:100%;text-align:left;padding:10px;border:none;background:#e9f1ff;color:#0052cc;cursor:pointer;border-radius:6px;margin-top:6px;font-size:.95rem;transition:.25s ease}.channel-btn:hover{background:#d4e3ff;transform:translate(5px)}.video-area{flex:1;display:flex;justify-content:center;align-items:center}video{width:85%;max-width:900px;border-radius:14px;box-shadow:0 8px 22px #00000059;animation:fadeIn 1s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{transform:translate(-40px);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 768px){.container{flex-direction:column;height:auto}.sidebar{width:100%}video{width:100%;margin-top:15px}}@media (max-width: 480px){.title{font-size:1.6rem}summary{font-size:.9rem}.channel-btn{font-size:.85rem}}.logo{height:50px;vertical-align:middle;margin-right:10px}.video-area{flex:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.playlist-bar{width:95%;max-width:1200px;display:flex;flex-wrap:wrap;gap:10px;margin-bottom:15px;background:#ffffffd9;padding:10px;border-radius:8px;justify-content:flex-start}video{width:95%;max-width:1200px;height:auto}@media (max-width: 768px){.playlist-bar{flex-direction:column;align-items:flex-start}}