
#page-channel #channel-banner{width:100%;height:240px;background-size:cover;background-position:center;background-repeat:no-repeat;}
#page-channel .channel-header{display:flex;align-items:center;gap:24px;padding:20px 40px;border-bottom:1px solid #222;}
#page-channel .channel-icon{width:96px;height:96px;border-radius:8px;object-fit:cover;}
#page-channel .channel-meta h1{margin:0;font-size:28px;font-weight:bold;}
#page-channel .channel-meta p{margin:4px 0;color:#ccc;font-size:14px;}
#page-channel .channel-tabs{display:flex;gap:32px;padding:12px 40px;border-bottom:1px solid #222;}
#page-channel .channel-tab{font-size:15px;padding-bottom:8px;cursor:pointer;color:#aaa;border-bottom:2px solid transparent;transition:0.2s;}
#page-channel .channel-tab.active{color:#fff;border-bottom:2px solid #fff;}
#page-channel #channel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;}
#page-channel .video-card{cursor:pointer;transition:0.2s;}
#page-channel .video-card:hover{transform:translateY(-3px);}
#page-channel .thumb-wrapper{width:100%;aspect-ratio: 16 / 9;object-fit:cover;border-radius:2px;background:#000000;}
#page-channel .thumb-wrapper img.video-thumb{ width: 100% !important; height: 100% !important; object-fit: contain !important; transform: none !important;}
#page-channel .thumb-wrapper img.video-thumb{ width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
#page-channel .video-info{padding:10px 4px;}
#page-channel .video-title{font-size:16px;font-weight:bold;margin:4px 0;color:#fff;}
#page-channel .video-date{font-size:13px;color:#aaa;}
#page-channel .modal{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: none; justify-content: center; align-items: center; z-index: 99999;}
#page-channel .modal.show{ display: flex; }
#page-channel .modal-content{ background: rgb(34, 34, 34, 1); padding: 20px; border-radius: 4px; width: 500px; max-height: 80vh; overflow-y: auto;}
#page-channel .modal-close{ float: right; cursor: pointer; font-size: 22px;}
#page-channel #about-social a{ display: block; margin: 4px 0; color: #4fa3ff;}
#page-channel #channel-social{font-size:80%;}
#page-channel #channel-description{max-height:3.6em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#page-channel .channel-desc-row{display:flex;align-items:center;gap:8px;max-width:100%;}
#page-channel #channel-description{flex:1;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#ccc;}
#page-channel .about-btn{flex-shrink:0;font-size:80%;border-radius:6px;cursor:pointer;background-color:#1b1b1b;color:#fff;border:0px;}
#page-channel h3{color:#fff;}


@media (max-width: 480px) {
#page-channel .channel-header{ flex-direction: column; align-items: center; text-align: center;}
#page-channel #channel-grid{ padding: 15px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 16px;}
#page-channel .channel-tabs{ padding: 10px 20px; gap: 18px;}
#page-channel .channels-main{width:100%;margin:0 auto;}
#page-channel .channel-meta{width:100%;}
#page-channel .channels-video{width:100%;margin:0 auto;}
#page-channel .channels-sort-area{display:flex;justify-content:first baseline;padding:6px 10px;}
#page-channel #channels-sort-area{padding:0px 0px 8px 0px;}
}


@media screen and (min-width: 481px) {
#page-channel .channels-main{width:90%;margin:0 auto;}
#page-channel .channel-meta{width:100%;}
#page-channel .channels-video{width:80%;margin:0 auto;}
#page-channel .channels-sort-area{display:flex;justify-content:first baseline;padding:6px 10px;}
#page-channel #channels-sort-area{padding:0px 0px 8px 0px;}
}