*, *::before, *::after {box-sizing:border-box;margin:0;padding:0}
html {scroll-behavior:smooth}
body {background:#1a1a1a;color:#e8e4df;font-family:"Source Han Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;font-weight:400;letter-spacing:.01em}
img {display:block;max-width:100%;height:auto}
a {color:inherit;text-decoration:none}
button {font:inherit;color:inherit;background:none;border:none;cursor:pointer}
dl, dd {margin:0}
video {display:block;max-width:100%}
.site-header {display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1rem 2rem;background:rgba(26,26,26,.95);border-bottom:1px solid #2a2a2a;position:sticky;top:0;z-index:100;backdrop-filter:blur(8px)}
a[data-contract="site-name"] {font-size:1.1rem;font-weight:700;letter-spacing:.15em;color:#e8e4df;text-transform:uppercase;text-decoration:none;border-left:3px solid #8b0000;padding-left:.75rem;transition:color .2s}
a[data-contract="site-name"]:hover {color:#a52a2a}
.categories-nav {display:flex;align-items:center;gap:.5rem;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
.categories-nav::-webkit-scrollbar {display:none}
a.runtime-category {display:inline-block;color:#9fa8b0;text-decoration:none;font-size:.85rem;padding:.35rem .8rem;border:1px solid transparent;border-radius:2px;white-space:nowrap;transition:color .2s,border-color .2s;text-transform:uppercase;letter-spacing:.05em}
a.runtime-category:hover {color:#e8e4df;border-color:#3a3a3a;background:#242424}
.main-content {max-width:1440px;margin:0 auto;padding:0 2rem}
.hero-visual {padding:2rem 0 1rem}
.hero-media {display:grid;grid-template-columns:280px 1fr;gap:2rem;background:#1f1f1f;border-left:1px solid #8b0000;padding:1.5rem;position:relative}
.hero-media::after {content:"";position:absolute;top:0;right:0;width:40%;height:100%;background:linear-gradient(135deg,transparent 70%,rgba(139,0,0,.08));pointer-events:none}
.poster-wrapper {grid-row:span 2;align-self:start;width:100%;max-width:280px;position:relative}
.poster-wrapper::before {content:"";display:block;padding-top:150%}
.poster-wrapper img {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border:1px solid #2a2a2a;box-shadow:0 0 20px rgba(0,0,0,.5)}
.hero-content {align-self:start;padding-top:.5rem}
.hero-title {font-size:1.6rem;font-weight:700;color:#f0ece7;margin-bottom:.5rem;letter-spacing:.02em;line-height:1.3;border-left:3px solid #8b0000;padding-left:1rem}
.hero-tagline {color:#8a8a8a;font-size:.95rem;margin-bottom:1.5rem;font-style:italic;letter-spacing:.08em}
.hero-keyword {display:inline-block;background:#8b0000;color:#e8e4df;padding:.4rem 1.2rem;font-size:.9rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;margin-top:.5rem;clip-path:polygon(0 0,100% 0,96% 100%,0 100%)}
.overview-content {grid-column:2;margin-top:0;display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem 2rem;align-items:start;border-top:1px solid #2a2a2a;padding-top:1.5rem}
.synopsis-section, .details-section, .cast-section {border-left:1px solid #333;padding-left:1rem}
.section-heading {font-size:1rem;font-weight:600;color:#c8b8a0;margin-bottom:.8rem;letter-spacing:.15em;text-transform:uppercase;position:relative;display:inline-block}
.section-heading::after {content:"";position:absolute;bottom:-4px;left:0;width:100%;height:1px;background:#8b0000}
.synopsis-list {display:flex;flex-direction:column;gap:.6rem}
.synopsis-item {font-size:.9rem;color:#b0aca7;line-height:1.6;margin:0}
.synopsis-item:first-child {color:#d0ccc7}
.episode-status {grid-column:1;border-left:1px solid #333;padding-left:1rem;display:flex;flex-direction:column;gap:.25rem;margin-top:0}
.episode-status-text {font-size:.9rem;color:#d0ccc7;font-weight:600;letter-spacing:.1em;display:flex;align-items:center;gap:.5rem}
.episode-status-text::before {content:"";width:8px;height:8px;background:#8b0000;display:inline-block;transform:rotate(45deg)}
.episode-status-current {font-size:.8rem;color:#8a8a8a}
.details-section {grid-column:1}
.details-list {display:grid;grid-template-columns:1fr;gap:.35rem 0;max-width:100%}
.detail-item {display:grid;grid-template-columns:4.5em 1fr;gap:0;font-size:.85rem;align-items:baseline;padding:.15rem 0;border-bottom:1px dotted #2f2f2f}
.detail-item dt {color:#7a7a7a;font-weight:400;letter-spacing:.05em}
.detail-item dd {color:#d0ccc7;text-align:right}
.cast-section {grid-column:2;grid-row:span 2}
.cast-list {display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.cast-member {display:flex;flex-direction:column;gap:.15rem;padding:.5rem .75rem;border:1px solid #2a2a2a;background:#222;transition:background .2s,border-color .2s;cursor:default;position:relative;overflow:hidden}
.cast-member::before {content:"";position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,#8b0000,transparent);opacity:0;transition:opacity .2s}
.cast-member:hover {background:#2a2a2a;border-color:#8b0000}
.cast-member:hover::before {opacity:1}
.cast-name {font-size:.9rem;font-weight:600;color:#e0dcd7}
.cast-role {font-size:.75rem;color:#7a7a7a;letter-spacing:.1em}
.player-section {margin:0 0 2rem;position:relative;background:#161616;border:1px solid #2a2a2a;box-shadow:0 4px 20px rgba(0,0,0,.4)}
.player-section video {min-width:0}
.player-controls {display:flex;flex-wrap:wrap;gap:.25rem;padding:.5rem;background:#1f1f1f;border-top:1px solid #2a2a2a}
.player-controls button {font-size:.75rem;padding:.3rem .7rem;background:#242424;border:1px solid #333;color:#9fa8b0;transition:background .2s,color .2s,border-color .2s;letter-spacing:.05em}
.player-controls button:hover {background:#333;color:#e8e4df;border-color:#8b0000}
.theater-mode video {width:100%}
.lights-off video {filter:brightness(.7)}
.timeline-section {margin:2rem 0 1.5rem}
.timeline-scroll {overflow-x:auto;padding:1rem 0;scrollbar-width:thin;scrollbar-color:#8b0000 #2a2a2a}
.timeline-scroll::-webkit-scrollbar {height:6px}
.timeline-scroll::-webkit-scrollbar-track {background:#2a2a2a}
.timeline-scroll::-webkit-scrollbar-thumb {background:#8b0000;border-radius:0}
.timeline-track {display:flex;gap:3rem;min-width:max-content;padding:0 1rem;position:relative;align-items:flex-start}
.timeline-track::before {content:"";position:absolute;top:1.4rem;left:1rem;right:1rem;height:3px;background:linear-gradient(90deg,#3a3a3a,#555,#3a3a3a);box-shadow:0 0 8px rgba(139,0,0,.2)}
.timeline-node {display:flex;flex-direction:column;align-items:center;gap:.5rem;position:relative;z-index:1;min-width:80px;text-align:center}
.timeline-node::before {content:"";width:14px;height:14px;background:#1a1a1a;border:3px solid #8b0000;border-radius:50%;box-shadow:0 0 0 3px #1a1a1a,0 0 10px rgba(139,0,0,.4);transition:transform .2s,box-shadow .2s}
.timeline-node:hover::before {transform:scale(1.3);box-shadow:0 0 0 3px #1a1a1a,0 0 16px rgba(139,0,0,.7)}
.timeline-node:nth-child(3)::before {border-color:#a00;background:#8b0000}
.timeline-timecode {font-size:.8rem;font-weight:600;color:#8b0000;letter-spacing:.1em}
.timeline-label {font-size:.75rem;color:#b0aca7;max-width:100px}
.episodes-section {margin:2rem 0}
.episode-list {display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}
.episode-card {background:#1f1f1f;border:1px solid #2a2a2a;padding:.75rem;transition:border-color .2s,background .2s;height:fit-content}
.episode-card:hover {border-color:#8b0000;background:#242424}
.episode-card-header {display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.episode-number {font-size:1.1rem;font-weight:700;color:#8b0000;min-width:1.5em;font-style:italic}
.episode-title {font-size:.9rem;font-weight:600;color:#d0ccc7;flex:1}
.episode-duration {font-size:.7rem;color:#6a6a6a;letter-spacing:.05em}
.episode-summary {font-size:.8rem;color:#8a8a8a;line-height:1.5;margin:0}
.comments-section {margin:2rem 0}
.comments-grid {display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.comment-card {background:#1f1f1f;border-left:2px solid #8b0000;padding:.75rem 1rem;display:grid;grid-template-columns:auto 1fr;gap:.75rem;align-items:start;height:fit-content}
.comment-nickname {font-size:.8rem;font-weight:600;color:#c8b8a0;white-space:nowrap;writing-mode:horizontal-tb;letter-spacing:.05em;padding-top:.1rem}
.comment-text {font-size:.85rem;color:#b0aca7;line-height:1.5;margin:0}
.recommendation-region {margin:2rem 0}
.recommendation-list {display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
a[data-runtime="recommendation"] {display:flex;flex-direction:column;gap:.35rem;background:#1f1f1f;border:1px solid #2a2a2a;padding:.6rem;transition:border-color .2s,transform .2s;height:fit-content;text-decoration:none;color:inherit}
a[data-runtime="recommendation"]:hover {border-color:#8b0000;transform:translateY(-2px)}
a[data-runtime="recommendation"] img {width:100%;height:auto;object-fit:cover;aspect-ratio:16/9;background:#2a2a2a}
a[data-runtime="recommendation"] [data-runtime="name"] {font-size:.85rem;font-weight:600;color:#d0ccc7;display:block}
a[data-runtime="recommendation"] [data-runtime="blurb"] {font-size:.75rem;color:#7a7a7a;display:block;line-height:1.4}
.site-footer {margin-top:3rem;padding:2rem;background:#161616;border-top:1px solid #2a2a2a;display:grid;grid-template-columns:1fr auto auto;gap:2rem;align-items:start;max-width:1440px;margin-left:auto;margin-right:auto}
.footer-disclaimer {max-width:520px;font-size:.75rem;color:#6a6a6a;line-height:1.6;margin:0}
.footer-nav {display:flex;gap:1.5rem;align-items:center}
a[data-contract="footer-home"], a[data-contract="footer-sitemap"] {font-size:.85rem;color:#9fa8b0;text-decoration:none;transition:color .2s;white-space:nowrap}
a[data-contract="footer-home"]:hover, a[data-contract="footer-sitemap"]:hover {color:#e8e4df}
.friend-links {display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;justify-content:flex-end;max-width:500px}
.friend-links-label {font-size:.75rem;color:#6a6a6a;letter-spacing:.1em;white-space:nowrap}
a.runtime-friend-link {font-size:.75rem;color:#8a8a8a;text-decoration:none;transition:color .2s;white-space:nowrap;border-bottom:1px dotted #333}
a.runtime-friend-link:hover {color:#c8b8a0;border-bottom-color:#8b0000}
@media (max-width:1200px){.episode-list {grid-template-columns:repeat(3,1fr)}
.recommendation-list {grid-template-columns:repeat(2,1fr)}
.hero-media {grid-template-columns:240px 1fr}
.poster-wrapper {max-width:240px}
.overview-content {grid-template-columns:1fr 1fr}}
@media (max-width:900px){.main-content {padding:0 1rem}
.hero-media {grid-template-columns:1fr;gap:1rem}
.poster-wrapper {max-width:200px;grid-row:auto}
.hero-content {grid-column:1}
.overview-content {grid-column:1;grid-template-columns:1fr}
.details-section {grid-column:1}
.cast-section {grid-column:1;grid-row:auto}
.cast-list {grid-template-columns:repeat(3,1fr)}
.episode-status {grid-column:1}
.episode-list {grid-template-columns:repeat(2,1fr)}
.comments-grid {grid-template-columns:1fr}
.site-footer {grid-template-columns:1fr;gap:1.5rem}
.friend-links {justify-content:flex-start}
.player-section video {aspect-ratio:16/9;width:100%}}
@media (max-width:600px){.site-header {padding:.75rem 1rem;flex-direction:column;gap:.5rem;align-items:flex-start}
.categories-nav {width:100%}
.hero-title {font-size:1.3rem}
.hero-media {padding:1rem}
.poster-wrapper {max-width:160px}
.cast-list {grid-template-columns:repeat(2,1fr)}
.episode-list {grid-template-columns:1fr}
.recommendation-list {grid-template-columns:1fr}
.player-controls {justify-content:center}
.player-controls button {flex:1 1 auto;text-align:center;max-width:120px}
.timeline-track {gap:2rem}
.details-list {grid-template-columns:1fr}
.comment-card {grid-template-columns:1fr;gap:.5rem}
.comment-nickname {writing-mode:horizontal-tb}
.footer-nav {flex-wrap:wrap}
a[data-runtime="recommendation"] img {aspect-ratio:16/9}}
@media (max-width:480px){.main-content {padding:0 .5rem}
.hero-visual {padding:1rem 0}
.hero-content, .synopsis-section, .details-section, .cast-section, .episode-status {border-left:none;padding-left:0}
.section-heading {display:block}
.episode-status-text, .episode-status-current {margin-left:0}
.details-section {order:2}
.cast-section {order:3}
.synopsis-section {order:1}
.episode-status {order:0}
.overview-content {display:flex;flex-direction:column;gap:1.5rem}
.details-list {display:block}
.detail-item {display:flex;justify-content:space-between;gap:1rem}
.detail-item dd {text-align:left}}
@media (max-width:400px){.cast-list {grid-template-columns:repeat(2,1fr);gap:.5rem}
.cast-member {padding:.4rem .5rem}
.timeline-track {gap:1.5rem}
.timeline-node {min-width:60px}
.timeline-label {font-size:.65rem}
.player-controls button {font-size:.65rem;padding:.25rem .5rem}}

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}