*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: -apple-system, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif; background: #0d1021; color: #b8bdd0; line-height: 1.55; }
h1, h2 { color: #e8eaf2; font-weight: 700; letter-spacing: 0.05em; }
a { color: inherit; text-decoration: none; }
a[data-contract="site-name"] { color: #f5c16c; text-decoration: none; font-weight: 700; }
a.runtime-category { color: #b8bdd0; text-decoration: none; white-space: nowrap; padding: 0.25rem 0.75rem; border-radius: 20px; transition: background 0.2s, color 0.2s; }
a[data-runtime="recommendation"] { color: #e8eaf2; text-decoration: none; }
a[data-contract="footer-home"], a[data-contract="footer-sitemap"] { color: #8a90a8; text-decoration: none; }
a.runtime-friend-link { color: #8a90a8; text-decoration: none; }
header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem 1rem; padding: 0.75rem 1.25rem; background: #141830; border-bottom: 1px solid #2a2f4a; position: sticky; top: 0; z-index: 100; }
.site-brand { font-size: 1.15rem; letter-spacing: 0.08em; }
.category-strip { display: flex; flex-wrap: wrap; gap: 0.25rem; align-items: center; }
.cinema-unit { background: #141830; border-radius: 0; border-bottom: 1px solid #2a2f4a; padding: 1rem 1.25rem 1.5rem; }
.hero-panel { display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: 1rem; align-items: start; }
.poster-media { width: 100%; }
.main-poster-img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; display: block; border-radius: 4px; }
.hero-content { display: flex; flex-direction: column; gap: 0.75rem; min-width: 0; }
.film-title { font-size: 1.4rem; line-height: 1.3; color: #f5f6fa; }
.film-tagline { color: #f5c16c; font-size: 0.95rem; letter-spacing: 0.02em; }
.cast-strip { display: flex; align-items: flex-start; gap: 0.75rem; }
.cast-label { color: #8a90a8; font-size: 0.85rem; padding-top: 0.5rem; white-space: nowrap; }
.cast-cards { display: flex; gap: 0.75rem; overflow-x: auto; padding-bottom: 0.25rem; }
.cast-card { display: flex; flex-direction: column; align-items: center; gap: 0.3rem; min-width: 64px; }
.avatar-placeholder { width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, #2a2f4a, #3a3f5c); border: 1px solid #3a3f5c; }
.cast-card figcaption { font-size: 0.8rem; color: #b8bdd0; text-align: center; }
.synopsis-block { margin-top: 0.25rem; }
.block-heading { font-size: 1rem; margin-bottom: 0.5rem; color: #f5c16c; letter-spacing: 0.1em; }
.synopsis-para { font-size: 0.88rem; color: #9ea3b8; margin-bottom: 0.4rem; line-height: 1.6; }
.episode-status-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.status-chip { background: #1c2038; border: 1px solid #2a2f4a; color: #c9cdd8; padding: 0.2rem 0.6rem; border-radius: 12px; font-size: 0.8rem; }
.detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 0.35rem 0.75rem; border-top: 1px solid #2a2f4a; border-bottom: 1px solid #2a2f4a; padding: 0.5rem 0; }
.detail-item { display: flex; flex-direction: column; }
.detail-label { font-size: 0.7rem; color: #6b7088; text-transform: uppercase; letter-spacing: 0.05em; }
.detail-value { font-size: 0.85rem; color: #d0d4e0; }
.player-shell { margin-top: 0.25rem; }
video { display: block; }
.player-controls { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.4rem; background: #1c2038; padding: 0.4rem; border-radius: 4px; flex-wrap: wrap; }
.player-controls button { background: #2a2f4a; color: #d0d4e0; border: none; padding: 0.2rem 0.5rem; border-radius: 3px; font-size: 0.75rem; cursor: pointer; }
.player-controls input[type="range"] { flex: 1; min-width: 80px; accent-color: #f5c16c; }
.timeline-wrapper { margin-top: 1.25rem; }
.timeline-track { display: flex; gap: 0.75rem; overflow-x: auto; padding: 0.5rem 0 0.75rem; border-top: 1px solid #2a2f4a; }
.timeline-node { flex: 0 0 auto; width: 160px; padding: 0.5rem 0.75rem; background: #1c2038; border-radius: 4px; border-left: 2px solid #f5c16c; }
.timeline-node time { font-size: 0.8rem; font-weight: 700; color: #f5c16c; display: block; margin-bottom: 0.2rem; }
.timeline-node p { font-size: 0.75rem; color: #9ea3b8; line-height: 1.4; }
.episode-list { padding: 1rem 1.25rem; border-bottom: 1px solid #2a2f4a; }
.episode-list .block-heading { margin-bottom: 0.75rem; }
.episode-item { display: grid; grid-template-columns: 40px 1fr auto; gap: 0.4rem 0.75rem; align-items: baseline; padding: 0.5rem 0; border-bottom: 1px solid #242840; }
.episode-item:last-child { border-bottom: none; }
.ep-number { font-weight: 700; color: #f5c16c; font-size: 1rem; }
.ep-title { color: #e8eaf2; font-weight: 600; }
.ep-duration { font-size: 0.8rem; color: #6b7088; justify-self: end; }
.ep-summary { grid-column: 2 / -1; font-size: 0.8rem; color: #8a90a8; line-height: 1.5; }
.comments-grid { padding: 1rem 1.25rem; display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; border-bottom: 1px solid #2a2f4a; }
.comments-grid .block-heading { grid-column: 1 / -1; margin-bottom: 0.25rem; }
.comment-bubble { background: #1c2038; border-radius: 8px; padding: 0.6rem 0.75rem; position: relative; border: 1px solid #2a2f4a; }
.comment-bubble::after { content: ""; position: absolute; bottom: -6px; left: 14px; width: 10px; height: 10px; background: #1c2038; border-right: 1px solid #2a2f4a; border-bottom: 1px solid #2a2f4a; transform: rotate(45deg); }
.comment-user { display: block; font-size: 0.8rem; color: #f5c16c; margin-bottom: 0.2rem; font-weight: 600; }
.comment-bubble p { font-size: 0.8rem; color: #b8bdd0; line-height: 1.5; }
.rec-region { padding: 1rem 1.25rem; border-bottom: 1px solid #2a2f4a; }
.rec-title { font-size: 0.95rem; margin-bottom: 0.6rem; color: #f5c16c; letter-spacing: 0.08em; }
.rec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.rec-grid a[data-runtime="recommendation"] { display: flex; flex-direction: column; background: #1c2038; border-radius: 4px; padding: 0.4rem; border: 1px solid #242840; transition: border-color 0.2s; }
.rec-grid a[data-runtime="recommendation"]:hover { border-color: #f5c16c; }
.rec-grid img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; }
.rec-grid [data-runtime="name"] { font-size: 0.8rem; font-weight: 600; color: #e8eaf2; margin-top: 0.3rem; }
.rec-grid [data-runtime="blurb"] { font-size: 0.72rem; color: #8a90a8; line-height: 1.4; }
.rec-stack { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
.rec-stack a[data-runtime="recommendation"] { display: flex; background: #1c2038; border-radius: 4px; padding: 0.4rem; border: 1px solid #242840; gap: 0.5rem; align-items: center; }
.rec-stack img { width: 80px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; flex-shrink: 0; }
.rec-stack [data-runtime="name"] { display: block; font-size: 0.78rem; font-weight: 600; color: #e8eaf2; }
.rec-stack [data-runtime="blurb"] { display: block; font-size: 0.72rem; color: #8a90a8; line-height: 1.4; }
.rec-vertical { display: flex; flex-direction: column; gap: 0.5rem; }
.rec-vertical a[data-runtime="recommendation"] { display: flex; gap: 0.75rem; background: #1c2038; border-radius: 4px; padding: 0.4rem; border: 1px solid #242840; align-items: center; }
.rec-vertical img { width: 110px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; flex-shrink: 0; }
.rec-vertical [data-runtime="name"] { display: block; font-size: 0.8rem; font-weight: 600; color: #e8eaf2; }
.rec-vertical [data-runtime="blurb"] { display: block; font-size: 0.72rem; color: #8a90a8; line-height: 1.4; }
footer { padding: 1rem 1.25rem; background: #10131f; border-top: 1px solid #2a2f4a; display: grid; grid-template-columns: 1fr auto; gap: 0.75rem; align-items: start; }
.footer-disclaimer { font-size: 0.72rem; color: #6b7088; line-height: 1.6; }
.footer-links { display: flex; gap: 0.75rem; font-size: 0.8rem; justify-content: flex-end; }
.footer-links a { color: #8a90a8; }
.footer-links a:hover { color: #f5c16c; }
.friend-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: center; border-top: 1px solid #242840; padding-top: 0.5rem; }
.friend-label { font-size: 0.72rem; color: #6b7088; }
.runtime-friend-link { font-size: 0.75rem; }
.runtime-friend-link:hover { color: #f5c16c; }
.theater-mode { position: fixed; z-index: 9999; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90vw; height: auto; background: #000; }
body.cinema-light { background: #1a1e33; }
body.cinema-light .hero-panel { background: #1f2440; }
@media (max-width: 960px) {.hero-panel { grid-template-columns: minmax(160px, 200px) minmax(0, 1fr); }
.rec-grid { grid-template-columns: repeat(2, 1fr); }
.rec-stack { grid-template-columns: 1fr; }}
@media (max-width: 720px) {header { padding: 0.5rem 0.75rem; }
.cinema-unit, .episode-list, .comments-grid, .rec-region, footer { padding-left: 0.75rem; padding-right: 0.75rem; }
.hero-panel { grid-template-columns: 1fr; }
.poster-media { max-width: 240px; }
.detail-grid { grid-template-columns: repeat(2, 1fr); }
.comments-grid { grid-template-columns: 1fr; }
.rec-grid { grid-template-columns: 1fr; }
.rec-stack { grid-template-columns: 1fr; }
footer { grid-template-columns: 1fr; }
.footer-links { justify-content: flex-start; }}
@media (max-width: 480px) {.film-title { font-size: 1.15rem; }
.cast-cards { gap: 0.5rem; }
.episode-item { grid-template-columns: 30px 1fr; }
.ep-duration { grid-column: 2; justify-self: start; }
.ep-summary { grid-column: 1 / -1; }
.player-controls { gap: 0.25rem; }}
.category-strip a.runtime-category { font-size: 0.8rem; }
.category-strip a.runtime-category:hover { background: #2a2f4a; color: #f5c16c; }
.player-shell { min-width: 0; }
.hero-content .player-shell { width: 100%; min-width: 0; }
.hero-panel { min-width: 0; }
.cinema-unit { min-width: 0; }

footer{text-align:center!important}
footer *{justify-content:center!important}
footer :is(div,nav,ul,ol,p,section,address){margin-left:auto!important;margin-right:auto!important}