/*--- BASE STYLES ---*/
*,*::before,*::after{box-sizing:border-box}
body,button,input,textarea{color:black;font-family:"Asap",sans-serif;font-size:16px;line-height:1.8}
body{background-color:#ededed;margin:0}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0}

/* HEADER */
[class~="site-header"]{background-color:black;display:flex;flex-flow:column}
[class~="site-info"]{flex-grow:1;display:flex;flex-flow:column;justify-content:center;padding:2em 0;min-height:120px}
[class~="site-title"]{margin:0;font-size:2.5em;font-weight:300;text-align:center;color:white;text-transform:uppercase}
[class~="site-description"]{text-align:center;color:#f6d200;font-size:1.1em;margin-top:-0.5em;font-style:italic}
@media screen and (min-width:1120px){[class~="site-title"]{font-size:4em}}

/* NAV */
[class~="main-menu"]{color:black;background-color:#f6d200}
[class~="main-menu"] ul{list-style-type:none;padding:0;margin:0}
[class~="main-menu"] li a{text-decoration:none;color:#000;font-size:1.1em;font-weight:bold;padding:0.6em 1em;display:block;transition:all 0.3s ease}
[class~="main-menu"] li a:hover,[class~="main-menu"] li[class~="active"] a{background-color:black;color:#f6d200}
@media screen and (min-width:810px){[class~="main-menu"] ul{display:flex;justify-content:center;flex-wrap:wrap;text-align:center}[class~="main-menu"] ul li{flex-grow:0;flex-basis:auto}}

/* LAYOUT */
[class~="container"]{max-width:1200px;margin:0 auto;padding:0 1em}
[class~="content-area"]{display:flex;gap:0}
[class~="main-content-area"]{flex:1;padding:2em;min-width:0}
@media screen and (min-width:1120px){[class~="sidebar-right"]{flex:0 0 300px}}

/* POSTS GRID */
[class~="posts"]{display:flex;flex-wrap:wrap;gap:1em}
[class~="post"]{background-color:white;overflow:hidden;flex-basis:100%}
[class~="post"] a{color:black;text-decoration:none}
[class~="post-content"]{padding:0 20px 20px}
[class~="post-content"] h2{background-color:#f6d200;color:black;padding:15px 20px;text-align:center;margin:0 -20px 20px;font-size:1em}
@media screen and (min-width:810px){[class~="post"]{flex-basis:calc(50% - 0.5em)}}
@media screen and (min-width:1120px){[class~="post-one-third"]{flex-basis:calc(33.33% - 0.67em)}[class~="post-half"]{flex-basis:calc(50% - 0.5em)}[class~="post-full"]{flex-basis:100%}}

/* SECTION HEADER */
[class~="section-header"]{color:black;font-size:2em;text-align:center;border-bottom:4px solid #f6d200;padding-bottom:0.3em;margin-bottom:1em}

/* WATCH / DETAIL CARD */
[class~="watch-card"],[class~="detail-card"]{margin-bottom:1.5em;display:flex;flex-direction:column}
[class~="watch-content"],[class~="detail-content"]{background-color:black;color:white;padding:2em}
[class~="watch-content"] h2,[class~="detail-content"] h1{font-size:1.8em;font-weight:300;margin:0 0 0.5em;text-transform:capitalize;color:white}
[class~="movie-info"]{font-weight:bold;margin-bottom:1em}
[class~="movie-info"] span{padding-right:1em;color:#f6d200}
[class~="movie-story"],[class~="movie-desc"]{margin:1em 0;color:#ccc}
[class~="btn-play"],[class~="btn-watch"]{display:inline-block;background:#f6d200;color:#000;padding:0.5em 1.5em;font-weight:bold;text-decoration:none;margin-top:1em}
[class~="btn-play"]:hover,[class~="btn-watch"]:hover{background:white}
@media screen and (min-width:810px){[class~="watch-card"],[class~="detail-card"]{flex-direction:row}[class~="watch-img"],[class~="detail-img"]{flex:0 0 40%}[class~="watch-content"],[class~="detail-content"]{flex:1;display:flex;flex-flow:column;justify-content:center}[class~="img-right"]{order:2}}

/* EPISODE LIST */
[class~="episode-list"]{margin-top:1.5em}
[class~="episode-list"] h3{color:black;border-left:4px solid #f6d200;padding-left:0.5em;margin-bottom:0.8em}
[class~="episode-links"]{display:flex;flex-wrap:wrap;gap:0.4em}
[class~="episode-links"] a{display:inline-block;padding:0.3em 0.8em;background:#f6d200;color:#000;font-size:0.85em;text-decoration:none}
[class~="episode-links"] a:hover,[class~="episode-links"] a[class~="active"]{background:#000;color:#f6d200}

/* PLAYER */
[class~="player-wrap"]{position:relative;padding-bottom:56.25%;height:0;background:#000;margin-bottom:1.5em}
[class~="player-wrap"] iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

/* SEARCH */
[class~="search-form"]{display:flex;margin-bottom:1.5em}
[class~="search-form"] input[type="text"]{flex:1;padding:0.6em 1em;border:2px solid #f6d200;border-right:0;font-size:1em;outline:none}
[class~="search-form"] button{padding:0.6em 1.2em;background:#f6d200;border:none;cursor:pointer;font-weight:bold;font-size:1em}
[class~="search-form"] button:hover{background:#000;color:#f6d200}

/* PAGINATION */
[class~="pagination"]{display:flex;list-style:none;padding:0;justify-content:center;gap:0.3em;margin:2em 0}
[class~="pagination"] a,[class~="pagination"] span{display:block;padding:0.4em 0.9em;background:white;color:#000;text-decoration:none;font-weight:bold;border:1px solid #ddd}
[class~="pagination"] a:hover,[class~="pagination"] [class~="active"] a,[class~="pagination"] [class~="current"]{background:#000;color:#f6d200;border-color:#000}

/* RANK PAGE */
[class~="rank-list"]{margin-top:1em}
[class~="rank-item"]{display:flex;align-items:center;background:white;padding:0.8em 1em;margin-bottom:0.5em;gap:1em}
[class~="rank-num"]{flex:0 0 30px;font-size:1.2em;font-weight:900;color:#f6d200}
[class~="rank-item"]:nth-child(-n+3) [class~="rank-num"]{color:red}
[class~="rank-title"]{flex:1;font-weight:bold}
[class~="rank-score"]{color:#f6d200;font-weight:bold}

/* SIDEBAR */
[class~="sidebar-right"]{background-color:#ededed;padding:2em}
[class~="widget"]{background-color:#fff;margin-bottom:2em}
[class~="widget-content"]{padding:0.5em 1.5em 1.5em}
[class~="widget-content"] h3{color:black;border-bottom:3px solid #f6d200;padding-bottom:0.3em}
[class~="sidebar-right"] ul{list-style-type:none;padding-left:0}
[class~="sidebar-right"] ul a{display:block;padding:0.3em 0;color:black;text-decoration:none;font-weight:bold;border-bottom:1px solid #eee}
[class~="sidebar-right"] ul a:hover{color:#c00;padding-left:0.5em}
@media screen and (min-width:810px) and (max-width:1120px){[class~="sidebar-right"]{display:flex;flex-wrap:wrap;justify-content:space-between}[class~="widget"]{flex-basis:48.8%}}

/* NEWS */
[class~="news-article"]{background:white;padding:2em;margin-bottom:1.5em}
[class~="news-article"] h1{font-size:1.6em;color:black;margin-bottom:0.5em}
[class~="news-meta"]{color:#888;font-size:0.9em;margin-bottom:1em}
[class~="news-content"]{line-height:1.9}
[class~="news-list-item"]{background:white;display:flex;gap:1em;padding:1em;margin-bottom:0.8em}
[class~="news-list-item"] img{flex:0 0 120px;height:80px;object-fit:cover}
[class~="news-list-item"] h3{font-size:1em;margin:0 0 0.3em}
[class~="news-list-item"] h3 a{color:black;text-decoration:none}
[class~="news-list-item"] h3 a:hover{color:#c00}

/* SITEMAP */
[class~="sitemap-section"]{background:white;padding:1.5em;margin-bottom:1.5em}
[class~="sitemap-section"] h3{border-left:4px solid #f6d200;padding-left:0.5em;margin-bottom:1em}
[class~="sitemap-section"] ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:0.5em}
[class~="sitemap-section"] ul a{display:inline-block;padding:0.3em 0.8em;background:#f6d200;color:#000;font-size:0.85em;text-decoration:none}
[class~="sitemap-section"] ul a:hover{background:#000;color:#f6d200}

/* 404 */
[class~="error-section"]{text-align:center;padding:4em 2em;background:white;margin:2em 0}
[class~="error-section"] h1{font-size:6em;color:red;margin:0}
[class~="error-section"] p{color:#555;font-size:1.2em;margin:0.5em 0 2em}
[class~="error-section"] [class~="btn-home"]{display:inline-block;background:#f6d200;color:#000;padding:0.6em 2em;font-weight:bold;text-decoration:none}
[class~="error-section"] [class~="btn-home"]:hover{background:#000;color:#f6d200}

/* FOOTER */
[class~="site-footer"]{background-color:black;color:white;text-align:center;padding:1.5em;font-size:0.9em}
[class~="site-footer"] a{color:#f6d200}
[class~="friendly-links"]{margin-top:0.8em;font-size:0.85em;color:#aaa}
[class~="friendly-links"] a{color:#ccc;margin:0 0.3em;text-decoration:none}

/* site-slogan: 随机口号展示栏 */
[class~="site-slogan"] {
    text-align: center;
    padding: 6px 16px;
    font-size: 13px;
    opacity: 0.65;
    background: transparent;
    pointer-events: none;
}
[class~="site-slogan"] p { margin: 0; line-height: 1.4; }


/* pic-list grid fix: .posts wraps ul.pic-list */
[class~="posts"] { display: block !important; }
[class~="posts"] ul[class~="pic-list"] { display: grid !important; list-style: none; padding: 0; margin: 0; gap: 12px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 576px)  { [class~="posts"] ul[class~="pic-list"] { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px)  { [class~="posts"] ul[class~="pic-list"] { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { [class~="posts"] ul[class~="pic-list"] { grid-template-columns: repeat(6, 1fr); } }
[class~="posts"] ul[class~="pic-list"] li { list-style: none; }
[class~="posts"] ul[class~="pic-list"] [class~="pic-img"] img { width: 100%; aspect-ratio: 2/3; object-fit: cover; display: block; border-radius: 4px; }
/* sidebar reset: prevent grid from affecting widget lists */
[class~="sidebar-right"] ul[class~="pic-list"] { display: block !important; grid-template-columns: none !important; }
[class~="widget-content"] ul[class~="pic-list"] { display: block !important; grid-template-columns: none !important; }

/* Logo text fallback */
[class~="logo-text"] {
    font-size: 1.5rem;
    font-weight: 700;
    color: inherit;
    text-decoration: none;
    display: inline-block;
}

/* 相关推荐网格布局 */
[class~="detail-related"] .pic-list,
[class~="detail-related"] [class*="pic-list"] {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 12px !important;
}
[class~="detail-related"] .pic-list li,
[class~="detail-related"] [class*="pic-list"] li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}
[class~="detail-related"] .pic-img,
[class~="detail-related"] [class*="pic-img"] {
    display: block !important;
    position: relative !important;
    aspect-ratio: 2/3 !important;
    overflow: hidden !important;
    border-radius: 6px !important;
}
[class~="detail-related"] .pic-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
[class~="detail-related"] .movie-title {
    font-size: 0.85rem !important;
    padding: 4px 0 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
[class~="detail-related"] .movie-title a {
    text-decoration: none !important;
}
@media (max-width: 768px) {
    [class~="detail-related"] .pic-list,
    [class~="detail-related"] [class*="pic-list"] {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}
