/* flux4 - Netflix红色卡片风格 */
:root{--red:#B71C1C;--red-l:#EF5350;--bg:#141414;--bg2:#181818;--bg3:#202020;--txt:#fff;--muted:#EF5350;--bor:rgba(183,28,28,0.3);--sh:0 4px 20px rgba(183,28,28,0.3)}
*{margin:0;padding:0;box-sizing:border-box}
body{font:14px/1.5 -apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--txt)}
a{color:inherit;text-decoration:none}
[class~="wrap"]{max-width:1400px;margin:0 auto;padding:0 16px}
[class~="skip-link"]{position:absolute;top:-40px;left:0;background:var(--red);color:#fff;padding:8px;z-index:9999}
[class~="skip-link"]:focus{top:0}

/* Header */
[class~="hdr"]{position:fixed;top:0;left:0;right:0;z-index:100;background:linear-gradient(180deg,rgba(20,20,20,0.9) 0%,transparent 100%);padding:16px 0;transition:background 0.3s}
[class~="hdr"][class~="scrolled"]{background:var(--bg)}
[class~="hdr"] [class~="wrap"]{display:flex;align-items:center;gap:20px}
[class~="logo"]{font-size:2rem;font-weight:900;color:var(--red)}
nav{display:flex;gap:20px;flex:1}
nav a{font-size:0.9rem;opacity:0.8;transition:0.2s}
nav a:hover,nav a[class~="on"]{opacity:1;color:var(--red)}
[class~="sch"]{display:flex;gap:8px}
[class~="sch"] input{background:rgba(0,0,0,0.5);border:1px solid var(--bor);padding:8px 12px;border-radius:4px;color:#fff;width:150px}
[class~="sch"] button{background:var(--red);border:none;padding:8px 16px;border-radius:4px;color:#fff;cursor:pointer}

/* Hero */
[class~="hero"]{padding:120px 0 60px;background:linear-gradient(180deg,rgba(0,0,0,0.4) 0%,var(--bg) 100%)}
[class~="hero"] h1{font-size:3rem;font-weight:700;margin-bottom:10px}
[class~="hero"] p{color:var(--muted);font-size:1.1rem}

/* Sections */
[class~="row"]{padding:30px 0}
[class~="row"] h2{font-size:1.3rem;margin-bottom:16px}
[class~="rank"] [class~="wrap"]{display:grid;grid-template-columns:1fr 1fr;gap:30px}
@media(max-width:768px){[class~="rank"] [class~="wrap"]{grid-template-columns:1fr}}
[class~="col"]{background:var(--bg3);border-radius:8px;padding:20px}
[class~="col"] h2{color:var(--red)}

/* Cards - 系统生成的 pic-list 结构适配 */
[class~="cards"]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
[class~="cards"] ul[class~="pic-list"]{list-style:none;padding:0;margin:0;display:contents}
[class~="cards"] [class~="pic-list"] li{margin:0;padding:0}
[class~="cards"][class~="scroll"]{display:flex;overflow-x:auto;gap:10px;padding-bottom:10px;scrollbar-width:none}
[class~="cards"][class~="scroll"]::-webkit-scrollbar{display:none}
[class~="cards"][class~="scroll"] ul[class~="pic-list"]{display:flex;gap:10px}
[class~="cards"][class~="scroll"] [class~="pic-list"] li{flex:0 0 150px}
[class~="cards"][class~="grid"]{grid-template-columns:repeat(3,1fr)}
@media(min-width:640px){[class~="cards"][class~="grid"]{grid-template-columns:repeat(4,1fr)}}
@media(min-width:768px){[class~="cards"][class~="grid"]{grid-template-columns:repeat(5,1fr)}}
@media(min-width:1024px){[class~="cards"][class~="grid"]{grid-template-columns:repeat(6,1fr)}}

/* Card Elements - Netflix 风格卡片 */
[class~="pic-img"]{display:block;position:relative;border-radius:4px;overflow:hidden;aspect-ratio:2/3;background:var(--bg3)}
[class~="pic-img"] img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s}
[class~="pic-img"]:hover img{transform:scale(1.05)}
[class~="pic-img"] [class~="score"]{position:absolute;top:6px;left:6px;background:var(--red);color:#fff;font-size:0.7rem;font-weight:700;padding:2px 6px;border-radius:3px}
[class~="pic-img"] [class~="tips"]{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,0.8));color:#fff;font-size:0.75rem;padding:20px 6px 6px}
[class~="pic-img"] [class~="hits"]{position:absolute;top:6px;right:6px;background:rgba(0,0,0,0.7);color:#fff;font-size:0.7rem;padding:2px 6px;border-radius:3px}
[class~="pic-list"] li p{margin-top:6px;font-size:0.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[class~="pic-list"] li a:hover{color:var(--red)}

/* Play */
[class~="play"] [class~="wrap"]{display:grid;gap:20px}
@media(min-width:1024px){[class~="play"] [class~="wrap"]{grid-template-columns:2fr 1fr}}
[class~="ply-l"]{order:2}
@media(min-width:1024px){[class~="ply-l"]{order:1}}
[class~="vid"]{background:#000;border-radius:8px;overflow:hidden}
[class~="vid"] video{width:100%;aspect-ratio:16/9;display:block}
[class~="eps"]{background:var(--bg3);border-radius:8px;padding:16px;margin-top:16px}
[class~="eps"] h3{margin-bottom:12px;color:var(--red)}
[class~="ep-list"]{display:flex;flex-wrap:wrap;gap:8px}
[class~="inf"]{background:var(--bg3);border-radius:8px;padding:20px}
[class~="poster"]{width:100%;border-radius:8px;margin-bottom:16px}
[class~="inf"] h1{font-size:1.5rem;margin-bottom:16px}
[class~="meta"] p{margin-bottom:8px;color:var(--muted);font-size:0.9rem}
[class~="meta"] b{color:#fff}
[class~="sc"]{color:var(--red);font-weight:700;font-size:1.2rem}
[class~="syn"]{margin-top:16px;padding-top:16px;border-top:1px solid var(--bor)}
[class~="syn"] h3{margin-bottom:8px;color:var(--red)}

/* Breadcrumb/Filter/Other */
[class~="crumb"]{padding:80px 0 20px;color:var(--muted);font-size:0.85rem}
[class~="crumb"] a{color:#fff}
[class~="flt"]{background:var(--bg3);padding:16px;border-radius:8px;margin-bottom:20px;display:flex;flex-wrap:wrap;gap:16px;font-size:0.9rem}
[class~="flt"] span{color:var(--muted)}
[class~="stat"]{color:var(--muted);margin-bottom:16px}
[class~="pg"]{display:flex;justify-content:center;gap:8px;margin-top:24px}
[class~="map"]{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
@media(min-width:768px){[class~="map"]{grid-template-columns:repeat(4,1fr)}}
[class~="map"] div{background:var(--bg3);padding:16px;border-radius:8px}
[class~="map"] h2{font-size:1rem;color:var(--red);margin-bottom:12px}
[class~="map"] ul{list-style:none}
[class~="map"] li{margin-bottom:8px}
[class~="map"] a{color:var(--muted);font-size:0.9rem}
[class~="tabs"]{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
[class~="tabs"] a{padding:6px 16px;background:var(--bg3);border-radius:20px;font-size:0.9rem}
[class~="tabs"] a[class~="on"],[class~="tabs"] a:hover{background:var(--red)}
[class~="nws"]{display:grid;gap:16px}
[class~="art"]{background:var(--bg3);padding:24px;border-radius:8px}
[class~="art"] h1{font-size:1.5rem;margin-bottom:12px}
[class~="art"] [class~="meta"]{color:var(--muted);margin-bottom:16px;font-size:0.9rem}
[class~="cnt"]{line-height:1.8}
[class~="e404"]{text-align:center;padding:60px 0}
[class~="e404"] h1{font-size:8rem;color:var(--red);line-height:1}
[class~="e404"] p{font-size:1.5rem;margin-bottom:20px}
[class~="btn"]{display:inline-block;padding:10px 24px;background:var(--red);color:#fff;border-radius:4px}

/* Footer */
[class~="ftr"]{background:var(--bg2);padding:40px 0 20px;margin-top:40px;border-top:1px solid var(--bor)}
[class~="lnks"]{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-bottom:20px}
[class~="lnks"] a{color:var(--muted);font-size:0.85rem}
[class~="lnks"] a:hover{color:#fff}
[class~="xml"],[class~="prt"]{text-align:center;font-size:0.85rem;color:var(--muted);padding:10px 0;border-top:1px solid var(--bor)}
[class~="xml"] span,[class~="prt"] span{color:#fff;font-weight:500}
[class~="xml"] a,[class~="prt"] a{margin:0 6px}
[class~="xml"] a:hover,[class~="prt"] a:hover{color:var(--red)}
[class~="cp"]{text-align:center;padding-top:16px;font-size:0.85rem;color:var(--muted)}
[class~="cp"] p{margin:4px 0}

:focus{outline:2px solid var(--red);outline-offset:2px}

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

/* ===== Detail Page Styles ===== */
[class~="detail-main"] { padding: 20px 0; }
[class~="detail-container"] { display: flex; gap: 30px; max-width: 1200px; margin: 0 auto; padding: 0 15px; flex-wrap: wrap; }
[class~="detail-poster"] { flex-shrink: 0; width: 200px; }
[class~="detail-poster"] img { width: 100%; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
[class~="detail-info"] { flex: 1; min-width: 280px; }
[class~="detail-title"] { font-size: 1.8rem; font-weight: bold; margin-bottom: 15px; line-height: 1.3; }
[class~="detail-meta"] { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 20px; font-size: 14px; color: #666; }
[class~="meta-item"] strong { color: #333; }
[class~="detail-synopsis"] { margin-bottom: 20px; line-height: 1.8; }
[class~="detail-synopsis"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 8px; }
[class~="detail-play-btn"] { margin: 20px 0; }
[class~="btn-play-now"] { display: inline-block; padding: 12px 32px; background: #e53935; color: #fff !important; border-radius: 4px; text-decoration: none; font-size: 16px; font-weight: bold; transition: background 0.2s; }
[class~="btn-play-now"]:hover { background: #c62828; }
[class~="detail-episodes"] { max-width: 1200px; margin: 24px auto; padding: 0 15px; }
[class~="detail-episodes"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 12px; }
[class~="detail-related"] { max-width: 1200px; margin: 24px auto; padding: 0 15px; }
[class~="detail-related"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 12px; }
[class~="breadcrumb"] { max-width: 1200px; margin: 12px auto; padding: 0 15px; font-size: 13px; color: #888; }
[class~="breadcrumb"] a { color: #666; text-decoration: none; }
[class~="breadcrumb"] a:hover { text-decoration: underline; }
@media (max-width: 768px) {
    [class~="detail-container"] { flex-direction: column; }
    [class~="detail-poster"] { width: 140px; margin: 0 auto; }
    [class~="detail-title"] { font-size: 1.4rem; }
    [class~="btn-play-now"] { width: 100%; text-align: center; box-sizing: border-box; }
}