*, *::before, *::after {box-sizing:border-box;margin:0;padding:0}
html {font-size:14px;line-height:1.5;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body {
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  background:#111315;
  color:#cfd2d0;
  font-weight:500;
  letter-spacing:.02em;
  overflow-x:hidden;
}
img, video {display:block;max-width:100%;height:auto}
a {color:inherit;text-decoration:none;cursor:pointer}
button, input, select {font:inherit;color:inherit;background:none;border:none;outline:none}
button {cursor:pointer}
::selection {background:#5a6b52;color:#f0e6d2}
a[data-contract="site-name"] {
  color:#e8e0d0;
  font-size:1.15rem;
  font-weight:900;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-decoration:none;
  padding:.6rem 1.4rem;
  border-left:3px solid #8a7b5c;
  transition:color .2s ease;
}
a[data-contract="site-name"]:hover {color:#b8a77e}
header {
  position:sticky;top:0;z-index:100;
  background:rgba(17,19,21,.96);
  backdrop-filter:blur(6px);
  border-bottom:1px solid #2a2e2c;
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;
  padding:.5rem 1.8rem;
}
[data-contract="categories"] {
  display:flex;flex-wrap:wrap;justify-content:flex-end;
  align-items:center;gap:.35rem;
}
a.runtime-category {
  display:inline-block;
  padding:.3rem .8rem;
  font-size:.78rem;
  font-weight:800;
  color:#c9c6b8;
  background:#1c1f1e;
  border:1px solid #333836;
  border-radius:2px;
  white-space:nowrap;
  letter-spacing:.08em;
  transition:all .2s ease;
  clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%);
}
a.runtime-category:hover {
  background:#2a2f2b;
  color:#e8dfc8;
  border-color:#5a6b52;
}
main {
  max-width:1400px;margin:0 auto;
  padding:0 1.2rem 3rem;
}
.movie-info-shell {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  grid-template-areas:
    "hero hero"
    "content player";
  gap:1.2rem 1.8rem;
  margin:1.2rem auto 1.8rem;
  padding:1.2rem;
  background:linear-gradient(145deg,#1a1e1c 0%,#141716 60%,#111413 100%);
  border:1px solid #2c332e;
  box-shadow:0 8px 24px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.04);
  position:relative;
}
.movie-info-shell::before {
  content:"";
  position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,#4a5a48,#8a7b5c,#4a5a48);
  opacity:.7;
}
.hero-section {
  grid-area:hero;
  display:grid;
  grid-template-columns:minmax(0,34%) minmax(0,1fr);
  gap:1.4rem;
  align-items:center;
  padding-bottom:.8rem;
  border-bottom:1px solid #2c332e;
}
.hero-media {
  position:relative;
  width:100%;
  max-width:340px;
  justify-self:end;
}
.hero-media img {
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  border:1px solid #3a423a;
  box-shadow:0 10px 30px rgba(0,0,0,.6);
  filter:saturate(.85) contrast(1.05);
}
.hero-media::after {
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(10,12,11,.65) 100%);
  pointer-events:none;
  border:1px solid rgba(138,123,92,.2);
}
.hero-title {
  padding:.4rem 0 .4rem 1rem;
  border-left:3px solid #8a7b5c;
}
.hero-title h1 {
  font-size:clamp(1.6rem,4vw,2.6rem);
  font-weight:900;
  line-height:1.2;
  color:#e8e0d0;
  letter-spacing:.05em;
  text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.tagline {
  margin-top:.8rem;
  font-size:1rem;
  color:#9a9c8a;
  font-weight:700;
  letter-spacing:.35em;
  text-transform:uppercase;
}
.player-wrapper {
  grid-area:player;
  width:100%;
  min-width:0;
  margin-top:.2rem;
}
.player-wrapper video {
  width:100%;
  background:#000;
  border:1px solid #3a423a;
  box-shadow:0 6px 20px rgba(0,0,0,.5);
}
.player-controls {
  display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;
  background:#1a1e1c;
  border:1px solid #2c332e;
  border-top:none;
  padding:.45rem .6rem;
  margin-top:-4px;
}
.player-btn {
  font-size:.72rem;
  padding:.25rem .55rem;
  background:#222725;
  border:1px solid #3a423a;
  color:#cfd2d0;
  border-radius:2px;
  transition:all .15s ease;
  white-space:nowrap;
}
.player-btn:hover {background:#2c332e;color:#e8dfc8;border-color:#5a6b52}
.player-progress, .player-volume {
  -webkit-appearance:none;appearance:none;
  height:4px;background:#333836;border-radius:2px;
  min-width:80px;flex:1;max-width:200px;
}
.player-progress::-webkit-slider-thumb, .player-volume::-webkit-slider-thumb {
  -webkit-appearance:none;appearance:none;
  width:12px;height:12px;background:#8a7b5c;border-radius:50%;cursor:pointer;
}
.player-speed {
  background:#222725;border:1px solid #3a423a;padding:.2rem .4rem;font-size:.75rem;
}
.movie-info-content {
  grid-area:content;
  display:flex;flex-direction:column;gap:1rem;
  min-width:0;
}
.synopsis-panel, .cast-panel, .episode-status-panel, .details-panel {
  background:transparent;
  border-bottom:1px solid #2c332e;
  padding-bottom:.8rem;
}
.synopsis-panel h2, .cast-panel h2, .episode-status-panel h2, .details-panel h2 {
  font-size:1rem;font-weight:900;color:#b8a77e;
  letter-spacing:.15em;margin-bottom:.5rem;
  display:flex;align-items:center;gap:.5rem;
}
.synopsis-panel h2::before, .cast-panel h2::before, .episode-status-panel h2::before, .details-panel h2::before {
  content:"▸";color:#6a7b5a;font-size:.9rem;
}
.synopsis-text p {
  font-size:.85rem;line-height:1.7;color:#b8bcb4;
  margin-bottom:.5rem;
}
.synopsis-text p:last-child {margin-bottom:0}
.cast-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.5rem;
}
.cast-card {
  background:#1c201e;
  border:1px solid #2c332e;
  padding:.6rem .4rem;
  text-align:center;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  transition:background .2s ease;
}
.cast-card:hover {background:#242a26;border-color:#5a6b52}
.actor-name {
  display:block;font-weight:900;color:#e0dcc8;font-size:.9rem;margin-bottom:.2rem;
}
.actor-role {
  display:block;font-size:.72rem;color:#8a8f82;letter-spacing:.1em;
}
.episode-meta {
  display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;
  margin-bottom:.4rem;
}
.episode-current {
  font-size:.85rem;font-weight:800;color:#d8d2b8;
  background:#222725;padding:.2rem .6rem;border-left:2px solid #8a7b5c;
}
.episode-total {
  font-size:.8rem;color:#8a8f82;
}
.episode-count span {
  font-size:.8rem;color:#6a7b5a;background:#1a1e1c;
  padding:.2rem .5rem;border:1px solid #2c332e;
}
.details-list {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.4rem .6rem;
}
.detail-item {
  display:flex;flex-direction:column;gap:.1rem;
  background:#1a1e1c;padding:.4rem .55rem;border-left:2px solid #3a423a;
}
.detail-item dt {
  font-size:.68rem;color:#8a8f82;text-transform:uppercase;letter-spacing:.08em;
}
.detail-item dd {
  font-size:.85rem;font-weight:700;color:#d8d2c8;
}
.timeline-panel {
  margin:1.6rem auto;
  padding:1.2rem 1.4rem;
  background:linear-gradient(180deg,#1a1e1c,#141716);
  border:1px solid #2c332e;
  position:relative;
}
.timeline-panel h2 {
  font-size:1.1rem;font-weight:900;color:#b8a77e;
  letter-spacing:.15em;margin-bottom:1rem;
  display:flex;align-items:center;gap:.6rem;
}
.timeline-panel h2::before {
  content:"◢";color:#6a7b5a;font-size:1rem;
}
.timeline-list {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.5rem;
  position:relative;
}
.timeline-list::before {
  content:"";
  position:absolute;top:0;bottom:0;left:1.2rem;width:2px;
  background:repeating-linear-gradient(180deg,#4a5a48 0 6px,transparent 6px 12px);
  opacity:.5;
}
.timeline-item {
  position:relative;
  padding-left:2.4rem;
  display:flex;flex-direction:column;gap:.3rem;
}
.timeline-item::before {
  content:"";
  position:absolute;left:.9rem;top:.3rem;
  width:10px;height:10px;
  background:#8a7b5c;
  transform:rotate(45deg);
  border:1px solid #cfd2d0;
}
.timecode {
  font-weight:900;font-size:.8rem;color:#d8d2b8;
  background:#222725;padding:.15rem .5rem;
  clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,0 100%);
  display:inline-block;width:fit-content;
}
.label {
  font-size:.78rem;color:#a8ac9e;line-height:1.5;
}
.episodes-panel {
  margin:1.6rem auto;
  padding:1.2rem 0;
  border-top:1px solid #2c332e;
  border-bottom:1px solid #2c332e;
}
.episodes-panel h2 {
  font-size:1.1rem;font-weight:900;color:#b8a77e;
  letter-spacing:.15em;margin-bottom:1rem;
  padding:0 1.4rem;
  display:flex;align-items:center;gap:.6rem;
}
.episodes-panel h2::before {
  content:"▣";color:#6a7b5a;
}
.episode-scroll {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:.5rem;
  overflow-x:visible;
  padding:0 1.4rem;
}
.episode-card {
  background:#1a1e1c;
  border:1px solid #2c332e;
  padding:.8rem .6rem;
  display:flex;flex-direction:column;gap:.4rem;
  position:relative;
  transition:border-color .2s ease,transform .2s ease;
}
.episode-card:hover {border-color:#5a6b52;transform:translateY(-2px)}
.episode-number {
  position:absolute;top:.4rem;right:.5rem;
  font-size:2rem;font-weight:900;color:#2c332e;
  line-height:1;z-index:0;
  font-family:Georgia,serif;
}
.episode-card h3 {
  font-size:.9rem;font-weight:800;color:#e0dcc8;
  position:relative;z-index:1;
  padding-right:1.6rem;
}
.episode-card p {
  font-size:.72rem;line-height:1.6;color:#9a9c8a;flex:1;
}
.episode-duration {
  font-size:.68rem;color:#6a7b5a;font-weight:700;letter-spacing:.05em;
  border-top:1px solid #2c332e;padding-top:.3rem;
}
.comments-panel {
  margin:1.6rem auto;
  padding:1.2rem 1.4rem;
  background:linear-gradient(145deg,#1a1e1c,#141716);
  border:1px solid #2c332e;
}
.comments-panel h2 {
  font-size:1.1rem;font-weight:900;color:#b8a77e;
  letter-spacing:.15em;margin-bottom:1rem;
  display:flex;align-items:center;gap:.6rem;
}
.comments-panel h2::before {
  content:"❝";color:#6a7b5a;font-size:1.3rem;
}
.comments-waterfall {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.5rem;
  align-items:start;
}
.comment-card {
  background:#1c201e;
  border:1px solid #2c332e;
  padding:.7rem .8rem;
  display:flex;flex-direction:column;gap:.4rem;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
.nickname {
  font-size:.78rem;font-weight:800;color:#d8d2b8;
  letter-spacing:.08em;
  display:flex;align-items:center;gap:.4rem;
}
.nickname::before {
  content:"▲";font-size:.5rem;color:#6a7b5a;
}
.comment-card p {
  font-size:.8rem;line-height:1.6;color:#a8ac9e;
}
.recommendation-region {
  margin:1.6rem auto;
  padding:0 0 1rem;
  border-bottom:1px solid #2c332e;
}
.recommendation-region h2 {
  font-size:1.1rem;font-weight:900;color:#b8a77e;
  letter-spacing:.15em;margin-bottom:.8rem;
  padding:0 1.4rem;
  display:flex;align-items:center;gap:.6rem;
}
.recommendation-region h2::before {
  content:"▸";color:#6a7b5a;
}
.recommendation-scroll {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.6rem;
  padding:0 1.4rem;
}
.recommendation-region:nth-of-type(2) .recommendation-scroll {
  grid-template-columns:repeat(3,minmax(0,1fr));
}
a.recommendation-item {
  display:flex;flex-direction:column;gap:.3rem;
  background:#1a1e1c;
  border:1px solid #2c332e;
  padding:.5rem;
  transition:all .2s ease;
  text-decoration:none;color:inherit;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
}
a.recommendation-item:hover {
  border-color:#5a6b52;background:#202523;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,.4);
}
[data-runtime="recommendation"] img {
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  background:#2c332e;
  border:1px solid #333836;
}
[data-runtime="recommendation"] [data-runtime="name"] {
  font-size:.82rem;font-weight:800;color:#e0dcc8;
  line-height:1.3;
}
[data-runtime="recommendation"] [data-runtime="blurb"] {
  font-size:.7rem;color:#8a8f82;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
footer {
  background:#0e1011;
  border-top:3px solid #2c332e;
  padding:1.6rem 1.4rem 2rem;
  margin-top:2rem;
}
[data-contract="disclaimer"] {
  font-size:.72rem;color:#6a6f63;line-height:1.6;
  max-width:900px;margin:0 auto .8rem;
  text-align:center;
}
.footer-links {
  display:flex;justify-content:center;gap:1.2rem;
  margin-bottom:1rem;
}
a[data-contract="footer-home"], a[data-contract="footer-sitemap"] {
  color:#8a8f82;font-size:.82rem;font-weight:700;
  text-decoration:none;
  padding:.2rem .4rem;
  border-bottom:1px solid transparent;
  transition:all .2s ease;
}
a[data-contract="footer-home"]:hover, a[data-contract="footer-sitemap"]:hover {
  color:#b8a77e;border-color:#8a7b5c;
}
[data-contract="friend-links"] {
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:.4rem;max-width:900px;margin:0 auto;
}
.friend-links-label {
  font-size:.75rem;color:#6a6f63;font-weight:700;letter-spacing:.1em;
  white-space:nowrap;
}
a.runtime-friend-link {
  display:inline-block;
  font-size:.72rem;color:#8a8f82;
  text-decoration:none;
  padding:.15rem .5rem;
  border:1px solid #2c332e;
  border-radius:2px;
  background:#1a1e1c;
  transition:all .2s ease;
  white-space:nowrap;
}
a.runtime-friend-link:hover {
  color:#d8d2b8;border-color:#5a6b52;background:#222725;
}
.theater-mode video {
  border-color:#8a7b5c;
  box-shadow:0 0 40px rgba(138,123,92,.3);
}
.theater-mode {
  grid-column:1 / -1;
}
.lights-off main, .lights-off header, .lights-off footer {
  filter:brightness(.55) contrast(1.1);
  transition:filter .4s ease;
}
.player.playing .player-btn[data-player-action="play"] {
  background:#4a5a48;border-color:#6a7b5a;
}
.pause {opacity:.7}
.mute {opacity:.6}
.speed {background:#2c332e}
.progress {accent-color:#8a7b5c}
.volume {accent-color:#8a7b5c}
.change {transition:all .2s ease}
.click {cursor:pointer}
.fullscreen video {
  object-fit:contain;
}
.pip video {
  border:2px solid #8a7b5c;
}
.input {outline:1px solid #5a6b52}
.lights-off {background:#050606}
.timeupdate {transition:none}
@media (max-width:1100px){.movie-info-shell {
    grid-template-columns:1fr;
    grid-template-areas:
      "hero"
      "player"
      "content";
  }
.hero-section {
    grid-template-columns:minmax(0,30%) 1fr;
  }
.player-wrapper {
    max-width:100%;
  }
.cast-grid {grid-template-columns:repeat(4,1fr)}
.details-list {grid-template-columns:repeat(4,1fr)}
.timeline-list {grid-template-columns:repeat(3,1fr);gap:1rem .5rem}
.timeline-list::before {left:1rem}
.timeline-item {padding-left:2.2rem}
.episode-scroll {grid-template-columns:repeat(3,1fr)}
.comments-waterfall {grid-template-columns:repeat(2,1fr)}
.recommendation-scroll {grid-template-columns:repeat(3,1fr)}
.recommendation-region:nth-of-type(2) .recommendation-scroll {grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){html {font-size:13px}
header {padding:.5rem 1rem;flex-direction:column;align-items:flex-start;gap:.4rem}
[data-contract="categories"] {justify-content:flex-start}
main {padding:0 .6rem 2rem}
.movie-info-shell {padding:.8rem;margin:.8rem auto 1.2rem}
.hero-section {
    grid-template-columns:1fr;
    gap:.8rem;
  }
.hero-media {max-width:240px;justify-self:center}
.hero-title {padding:.6rem 0 0;border-left:none;border-top:2px solid #8a7b5c;text-align:center}
.tagline {letter-spacing:.2em}
.player-wrapper {min-width:0}
.player-controls {gap:.3rem}
.player-progress, .player-volume {min-width:50px;flex:1}
.cast-grid {grid-template-columns:repeat(2,1fr)}
.details-list {grid-template-columns:repeat(2,1fr)}
.timeline-list {grid-template-columns:1fr;gap:.6rem}
.timeline-list::before {left:.8rem}
.timeline-item {padding-left:2rem}
.episode-scroll {grid-template-columns:repeat(2,1fr);overflow-x:auto;padding:0 .6rem}
.episodes-panel h2 {padding:0 .6rem}
.comments-waterfall {grid-template-columns:1fr}
.recommendation-scroll {grid-template-columns:repeat(2,1fr);padding:0 .6rem}
.recommendation-region:nth-of-type(2) .recommendation-scroll {grid-template-columns:repeat(2,1fr)}
.recommendation-region h2 {padding:0 .6rem}
.footer-links {flex-direction:column;align-items:center;gap:.4rem}
[data-contract="friend-links"] {justify-content:flex-start;padding-left:1rem}}
@media (max-width:480px){.episode-scroll {grid-template-columns:1fr}
.recommendation-scroll {grid-template-columns:1fr}
.recommendation-region:nth-of-type(2) .recommendation-scroll {grid-template-columns:1fr}
.cast-grid {grid-template-columns:1fr 1fr}
.details-list {grid-template-columns:1fr 1fr}
.hero-media {max-width:200px}
.player-controls {padding:.3rem}
.player-btn {font-size:.65rem;padding:.2rem .4rem}}

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}
