*, *::before, *::after {margin:0;padding:0;box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {
  background:#0a0e1a;
  color:#f5ead6;
  font-family:"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  line-height:1.6;
  font-size:15px;
}
img, video {display:block;max-width:100%;height:auto;}
a {color:inherit;text-decoration:none;}
button, input {font:inherit;color:inherit;background:none;border:none;}
.site-header {
  background:#0d1322;
  border-bottom:1px solid #3a1f2b;
  position:sticky;
  top:0;
  z-index:100;
}
.header-shell {
  max-width:1440px;
  margin:0 auto;
  padding:10px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
a[data-contract="site-name"] {
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.35rem;
  font-weight:700;
  letter-spacing:0.06em;
  color:#d9a441;
  text-shadow:0 0 8px rgba(217,164,65,0.4);
  white-space:nowrap;
}
.categories-nav {
  display:flex;
  gap:6px;
  overflow-x:auto;
  max-width:70%;
}
.categories-nav:empty::before {
  content:"";
}
a.runtime-category {
  display:inline-block;
  padding:4px 12px;
  border:1px solid #3a2a3a;
  border-radius:2px;
  font-size:0.82rem;
  color:#cbb8a0;
  background:rgba(26,22,38,0.6);
  white-space:nowrap;
  transition:border-color 0.2s,color 0.2s;
}
a.runtime-category:hover {
  border-color:#8a3b4a;
  color:#f5ead6;
}
.main-content {
  max-width:1440px;
  margin:0 auto;
  padding:24px 20px 40px;
}
.movie-overview {
  display:grid;
  grid-template-columns:minmax(260px,360px) minmax(0,1fr);
  gap:28px;
  background:linear-gradient(145deg,#101624 0%,#0b0f1a 100%);
  border:1px solid #2a1e2e;
  border-radius:4px;
  padding:28px;
  box-shadow:0 4px 30px rgba(0,0,0,0.6);
}
.overview-poster-wrapper {
  align-self:start;
}
img.main-poster {
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  border-radius:3px;
  box-shadow:0 8px 24px rgba(0,0,0,0.7);
}
.overview-info {
  display:flex;
  flex-direction:column;
  gap:20px;
  min-width:0;
}
.movie-title {
  font-family:Georgia,"Times New Roman",serif;
  font-size:2rem;
  font-weight:700;
  line-height:1.3;
  color:#f5ead6;
  text-shadow:0 0 12px rgba(217,164,65,0.35);
  letter-spacing:0.03em;
}
.movie-tagline {
  font-size:0.95rem;
  color:#b8a58e;
  font-style:italic;
  border-left:3px solid #8a3b4a;
  padding-left:12px;
}
.cast-section, .movie-details, .episode-status, .synopsis-section {
  display:flex;
  flex-direction:column;
  gap:12px;
}
.section-title {
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.2rem;
  font-weight:600;
  color:#d9a441;
  letter-spacing:0.05em;
  border-bottom:1px solid #2a1e2e;
  padding-bottom:6px;
}
.cast-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.cast-card {
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
}
.cast-photo-frame {
  width:100%;
  aspect-ratio:3/4;
  background:linear-gradient(135deg,#1a2032,#0e1424);
  border:1px solid #2a1e2e;
  border-radius:2px;
  position:relative;
  overflow:hidden;
}
.cast-photo-frame::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(10,14,26,0.4),transparent 40%);
}
.cast-info {
  display:flex;
  flex-direction:column;
  gap:2px;
}
.actor-name {
  font-size:0.95rem;
  font-weight:600;
  color:#f5ead6;
}
.actor-role {
  font-size:0.8rem;
  color:#8a7a68;
}
.details-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px 20px;
}
.detail-item {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:5px 0;
  border-bottom:1px dashed #1e2436;
  font-size:0.88rem;
}
.detail-item dt {
  color:#8a7a68;
  white-space:nowrap;
}
.detail-item dd {
  color:#e8dcc8;
  text-align:right;
}
.rating-value {
  color:#d9a441;
  font-weight:700;
}
.status-row {
  display:flex;
  align-items:baseline;
  gap:12px;
}
.episode-label {
  font-size:0.85rem;
  color:#8a7a68;
}
.episode-value {
  font-size:0.95rem;
  color:#f5ead6;
  font-weight:500;
}
.progress-track {
  height:4px;
  background:#1e2436;
  border-radius:2px;
  overflow:hidden;
}
.progress-fill {
  width:12.5%;
  height:100%;
  background:linear-gradient(90deg,#8a3b4a,#d9a441);
  border-radius:2px;
}
.player-shell {
  width:100%;
  min-width:0;
  background:#05070d;
  border:1px solid #2a1e2e;
  border-radius:3px;
  overflow:hidden;
}
video[data-contract="player"] {
  display:block;
  width:100%;
  background:#000;
}
.player-controls {
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  background:#0d1322;
  border-top:1px solid #1e2436;
  flex-wrap:wrap;
}
.control-btn {
  font-size:0.8rem;
  color:#cbb8a0;
  padding:4px 10px;
  border:1px solid #2a1e2e;
  border-radius:2px;
  cursor:pointer;
  transition:all 0.2s;
  white-space:nowrap;
}
.control-btn:hover {
  border-color:#8a3b4a;
  color:#f5ead6;
}
.control-progress {
  flex:1;
  min-width:120px;
  height:4px;
  accent-color:#d9a441;
  cursor:pointer;
}
.control-volume {
  width:70px;
  height:4px;
  accent-color:#d9a441;
  cursor:pointer;
}
.synopsis-paragraphs {
  display:flex;
  flex-direction:column;
  gap:10px;
}
.synopsis-text {
  font-size:0.92rem;
  color:#d8c9b4;
  text-indent:2em;
  line-height:1.8;
}
.timeline-section {
  margin-top:36px;
  padding:24px 0 8px;
}
.timeline-section .section-title {
  margin-bottom:18px;
}
.timeline-container {
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
  padding-left:0;
}
.timeline-container::before {
  content:"";
  position:absolute;
  top:12px;
  bottom:12px;
  left:0;
  right:0;
  border-top:1px solid #3a1f2b;
  z-index:0;
}
.timeline-item {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:1;
}
.timeline-time {
  font-family:Georgia,serif;
  font-size:0.9rem;
  font-weight:700;
  color:#d9a441;
  background:#0a0e1a;
  padding-right:8px;
  display:inline-block;
  align-self:flex-start;
}
.timeline-content {
  display:flex;
  flex-direction:column;
  gap:8px;
}
.timeline-thumb {
  width:100%;
  aspect-ratio:16/9;
  background:linear-gradient(135deg,#1a2032,#0e1424);
  border:1px solid #2a1e2e;
  border-radius:2px;
  position:relative;
}
.timeline-thumb::after {
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(to bottom,transparent 0 6px,rgba(138,59,74,0.12) 6px 7px);
}
.timeline-label {
  font-size:0.82rem;
  color:#b8a58e;
  line-height:1.5;
}
.episodes-section {
  margin-top:36px;
  padding:24px 0 8px;
}
.episodes-section .section-title {
  margin-bottom:18px;
}
.episodes-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.episode-card {
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px 16px;
  background:#0e1424;
  border:1px solid #1e2436;
  border-left:3px solid #8a3b4a;
  border-radius:2px;
  transition:transform 0.2s,border-color 0.2s;
}
.episode-card:hover {
  transform:translateY(-2px);
  border-color:#2a1e2e;
}
.episode-number {
  font-family:Georgia,serif;
  font-size:1.1rem;
  font-weight:700;
  color:#d9a441;
  opacity:0.8;
}
.episode-title {
  font-size:1rem;
  font-weight:600;
  color:#f5ead6;
  font-family:Georgia,serif;
}
.episode-summary {
  font-size:0.82rem;
  color:#8a7a68;
  line-height:1.5;
  flex:1;
}
.episode-duration {
  font-size:0.78rem;
  color:#5a4a3a;
  border-top:1px solid #1e2436;
  padding-top:6px;
}
.comments-section {
  margin-top:36px;
  padding:24px 0 8px;
}
.comments-section .section-title {
  margin-bottom:18px;
}
.comments-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.comment-card {
  display:flex;
  gap:12px;
  padding:12px 14px;
  background:#0e1424;
  border:1px solid #1e2436;
  border-radius:2px;
  align-items:flex-start;
}
.comment-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  background:linear-gradient(135deg,#3a1f2b,#1a2032);
  border:1px solid #2a1e2e;
  flex-shrink:0;
  position:relative;
}
.comment-avatar::after {
  content:"";
  position:absolute;
  inset:8px;
  border-radius:50%;
  background:rgba(217,164,65,0.15);
}
.comment-body {
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.comment-nickname {
  font-size:0.88rem;
  font-weight:600;
  color:#d9a441;
}
.comment-text {
  font-size:0.84rem;
  color:#b8a58e;
  line-height:1.5;
}
.recommendation-region {
  margin-top:36px;
  padding:24px 0 8px;
}
.recommendation-region .section-title {
  margin-bottom:18px;
}
.recommendation-scroll {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:14px;
  overflow-x:auto;
  padding-bottom:8px;
}
a.recommendation-card {
  display:flex;
  flex-direction:column;
  gap:8px;
  background:#0e1424;
  border:1px solid #1e2436;
  border-radius:2px;
  padding:10px;
  transition:border-color 0.2s,transform 0.2s;
  min-width:0;
}
a.recommendation-card:hover {
  border-color:#8a3b4a;
  transform:translateY(-2px);
}
[data-runtime="recommendation"] img {
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  border-radius:1px;
  background:#1a2032;
}
[data-runtime="name"] {
  font-size:0.9rem;
  font-weight:600;
  color:#f5ead6;
  line-height:1.3;
}
[data-runtime="blurb"] {
  font-size:0.78rem;
  color:#8a7a68;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.site-footer {
  background:#0d1322;
  border-top:1px solid #2a1e2e;
  margin-top:48px;
  padding:28px 20px 20px;
}
.footer-shell {
  max-width:1440px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.footer-disclaimer {
  font-size:0.78rem;
  color:#5a4a3a;
  line-height:1.6;
}
.footer-nav {
  display:flex;
  gap:20px;
}
a.footer-link {
  font-size:0.85rem;
  color:#b8a58e;
  transition:color 0.2s;
}
a.footer-link:hover {
  color:#d9a441;
}
.friend-links {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 14px;
}
.friend-links-label {
  font-size:0.82rem;
  color:#8a7a68;
  font-weight:600;
}
a.runtime-friend-link {
  font-size:0.78rem;
  color:#8a7a68;
  transition:color 0.2s;
  white-space:nowrap;
}
a.runtime-friend-link:hover {
  color:#d9a441;
}
body.lights-off {
  background:#000;
}
body.lights-off .main-content, body.lights-off .site-header, body.lights-off .site-footer {
  filter:brightness(0.55);
}
.player.theater-mode {
  position:fixed;
  inset:0;
  z-index:999;
  background:#000;
  display:flex;
  align-items:center;
  justify-content:center;
}
.player.theater-mode video {
  width:100%;
  height:100%;
  object-fit:contain;
}
.player.click {
  cursor:pointer;
}
.player.play .control-btn:first-child {
  color:#d9a441;
  border-color:#d9a441;
}
.player.mute .control-volume {
  accent-color:#8a3b4a;
}
.player.progress .control-progress {
  accent-color:#d9a441;
}
.player.speed .control-btn:nth-child(4) {
  color:#d9a441;
  border-color:#d9a441;
}
.player.pip .control-btn:nth-child(5) {
  color:#d9a441;
  border-color:#d9a441;
}
.player.fullscreen .control-btn:nth-child(6) {
  color:#d9a441;
  border-color:#d9a441;
}
.player.theater .control-btn:nth-child(7) {
  color:#d9a441;
  border-color:#d9a441;
}
.player.light .control-btn:nth-child(8) {
  color:#d9a441;
  border-color:#d9a441;
}
.player.timeupdate .control-progress {
  transition:none;
}
.player.volume .control-volume {
  cursor:grab;
}
.player.input .control-progress {
  cursor:ew-resize;
}
@media (max-width:1100px){.movie-overview {
    grid-template-columns:minmax(220px,300px) minmax(0,1fr);
    padding:20px;
  }
.cast-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.episodes-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
.timeline-container {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
.recommendation-scroll {
    grid-template-columns:repeat(4,minmax(0,1fr));
  }}
@media (max-width:900px){.movie-overview {
    grid-template-columns:1fr;
    gap:20px;
  }
.overview-poster-wrapper {
    max-width:320px;
  }
.comments-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.episodes-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.timeline-container {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }}
@media (max-width:640px){.main-content {
    padding:16px 12px;
  }
.header-shell {
    padding:8px 12px;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
.categories-nav {
    max-width:100%;
    width:100%;
  }
.movie-overview {
    padding:16px 12px;
    border-radius:0;
    border-left:none;
    border-right:none;
  }
.movie-title {
    font-size:1.5rem;
  }
.details-list {
    grid-template-columns:1fr;
  }
.cast-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
.player-controls {
    gap:4px;
    padding:8px;
  }
.control-btn {
    padding:3px 8px;
    font-size:0.75rem;
  }
.control-progress {
    min-width:80px;
    order:10;
    flex-basis:100%;
  }
.control-volume {
    width:50px;
  }
.episodes-grid {
    grid-template-columns:1fr;
  }
.timeline-container {
    grid-template-columns:1fr;
    padding-left:0;
  }
.timeline-container::before {
    border-top:none;
    border-left:1px solid #3a1f2b;
    left:12px;
    right:auto;
    top:0;
    bottom:0;
  }
.timeline-item {
    padding-left:30px;
  }
.timeline-time {
    align-self:flex-start;
  }
.comments-grid {
    grid-template-columns:1fr;
  }
.recommendation-scroll {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.friend-links {
    gap:6px 10px;
  }}
@media (max-width:400px){.cast-grid {
    grid-template-columns:1fr;
  }
.recommendation-scroll {
    grid-template-columns:1fr;
  }}
.recommendation-region:nth-of-type(2) .recommendation-scroll {
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.recommendation-region:nth-of-type(3) .recommendation-scroll {
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:900px){.recommendation-region:nth-of-type(2) .recommendation-scroll, .recommendation-region:nth-of-type(3) .recommendation-scroll {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }}
@media (max-width:640px){.recommendation-region:nth-of-type(2) .recommendation-scroll, .recommendation-region:nth-of-type(3) .recommendation-scroll {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }}
@media (max-width:400px){.recommendation-region:nth-of-type(2) .recommendation-scroll, .recommendation-region:nth-of-type(3) .recommendation-scroll {
    grid-template-columns:1fr;
  }}

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}