:root {
  --rust:#1a0f0c;
  --rust-2:#241310;
  --rust-3:#2e1a15;
  --rust-line:#3d2620;
  --ink:#f0e6e0;
  --ink-dim:#b39a90;
  --ink-faint:#7d6a63;
  --blue:#3d6bff;
  --blue-glow:rgba(61,107,255,.55);
  --violet:#a34dff;
  --violet-glow:rgba(163,77,255,.5);
  --cyan:#28e0d8;
  --cyan-glow:rgba(40,224,216,.45);
  --hot:#ff5a3c;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --gap:10px;
}
*, *::before, *::after {box-sizing:border-box;}
html, body {margin:0;padding:0;}
html {-webkit-text-size-adjust:100%;}
body {
  font-family:var(--sans);
  font-size:14px;
  line-height:1.6;
  color:var(--ink);
  background:
    linear-gradient(180deg,#150c0a 0%,#1a0f0c 40%,#120a08 100%);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img {max-width:100%;display:block;}
a {color:inherit;}
h1, h2, h3, p, dl, dd, dt, ol, ul, li, figure {margin:0;padding:0;}
ol, ul {list-style:none;}
button {font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
.site-header {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:8px 14px;
  background:linear-gradient(180deg,#200f0c,#170c0a);
  border-bottom:1px solid var(--rust-line);
  position:relative;
  z-index:20;
}
.header-brand {display:flex;align-items:center;}
a[data-contract="site-name"].site-name {
  font-size:15px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--cyan);
  text-decoration:none;
  text-shadow:0 0 10px var(--cyan-glow);
  white-space:nowrap;
}
a[data-contract="site-name"].site-name:hover {
  color:#8ffcf6;
  text-decoration:underline;
}
.categories-shell {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-left:auto;
  min-width:0;
}
a.runtime-category {
  display:inline-block;
  white-space:nowrap;
  font-size:11px;
  letter-spacing:.08em;
  padding:3px 9px;
  color:var(--ink-dim);
  text-decoration:none;
  border:1px solid var(--rust-line);
  background:#1d100d;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
  transition:color .15s,border-color .15s,box-shadow .15s;
}
a.runtime-category:hover {
  color:var(--blue);
  border-color:var(--blue);
  box-shadow:0 0 12px var(--blue-glow);
  text-decoration:underline;
}
.page-main {
  max-width:1180px;
  margin:0 auto;
  padding:12px 14px 30px;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.panel-heading {
  font-size:13px;
  font-weight:700;
  letter-spacing:.28em;
  color:var(--ink);
  padding-bottom:6px;
  margin-bottom:8px;
  border-bottom:1px solid var(--rust-line);
  position:relative;
  text-transform:uppercase;
}
.panel-heading::before {
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:42px;
  height:2px;
  background:var(--cyan);
  box-shadow:0 0 10px var(--cyan-glow);
}
.movie-overview {
  display:flex;
  flex-direction:column;
  gap:14px;
}
.overview-hero {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:18px;
  align-items:start;
  padding:16px 4px 22px;
  border-bottom:1px solid var(--rust-line);
}
.hero-side {position:relative;}
.poster-column.hero-side-left {
  max-width:290px;
  justify-self:center;
  width:100%;
}
.poster-frame {
  position:relative;
  display:block;
  margin:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);
  border:1px solid var(--rust-line);
  background:#0d0705;
  box-shadow:0 0 26px rgba(61,107,255,.28),0 0 60px rgba(61,107,255,.14) inset;
}
.poster-frame img {
  width:100%;
  height:auto;
  object-fit:cover;
  filter:saturate(1.15) contrast(1.08);
}
.overview-titles.hero-side-right {
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:6px;
  justify-content:flex-start;
}
.hero-figure-note {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.22em;
  color:var(--ink-faint);
  white-space:nowrap;
}
.overview-titles .hero-figure-note:nth-child(1) {
  color:var(--blue);
  text-shadow:0 0 8px var(--blue-glow);
}
.overview-titles .hero-figure-note:nth-child(2) {
  color:var(--violet);
  text-shadow:0 0 8px var(--violet-glow);
  align-self:flex-end;
}
.movie-title {
  font-size:clamp(26px,5vw,52px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:.03em;
  margin-top:10px;
  color:#fff;
  text-shadow:0 0 24px var(--blue-glow),0 0 60px rgba(163,77,255,.3);
}
.movie-tagline {
  font-size:13px;
  color:var(--ink-dim);
  letter-spacing:.06em;
  border-left:2px solid var(--blue);
  padding-left:9px;
  margin-top:4px;
}
.player-panel {
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px;
  background:linear-gradient(180deg,#1f110e,#180d0b);
  border:1px solid var(--rust-line);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
}
.player-shell {
  position:relative;
  width:100%;
  background:#000;
  border:1px solid var(--rust-line);
  box-shadow:0 0 26px rgba(0,0,0,.7);
}
.player-shell video {
  display:block;
  width:100%;
  height:auto;
  background:#000;
}
.player-shell.lights-off video {
  filter:brightness(.35) contrast(1.2);
}
.player-shell.lights-off {
  box-shadow:0 0 0 1px var(--blue),0 0 30px var(--blue-glow);
}
.player-controls {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.ctrl {
  font-size:11px;
  letter-spacing:.1em;
  padding:4px 10px;
  color:var(--ink-dim);
  background:#241310;
  border:1px solid var(--rust-line);
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);
  transition:color .15s,border-color .15s,box-shadow .15s,background .15s;
  white-space:nowrap;
}
.ctrl:hover {
  color:var(--ink);
  border-color:var(--blue);
  box-shadow:0 0 10px var(--blue-glow);
}
.ctrl.is-active, .ctrl.play.is-active, .ctrl.pause.is-active {
  color:#0a0605;
  background:var(--blue);
  border-color:var(--blue);
  box-shadow:0 0 14px var(--blue-glow);
}
body.theater-mode .player-panel, .theater-mode .player-panel {
  box-shadow:0 0 0 1px var(--violet),0 0 40px var(--violet-glow);
  border-color:var(--violet);
}
.episode-status {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-self:flex-start;
}
.status-chip {
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.12em;
  padding:3px 11px;
  border:1px solid var(--rust-line);
  background:#1c100d;
  white-space:nowrap;
}
.status-current {
  color:var(--hot);
  border-color:rgba(255,90,60,.5);
  box-shadow:0 0 12px rgba(255,90,60,.25);
}
.status-total {
  color:var(--ink-dim);
}
.movie-details {
  padding:12px 14px;
  background:linear-gradient(180deg,#1e110e,#180d0b);
  border:1px solid var(--rust-line);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
}
.detail-list {
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}
.detail-row {
  display:flex;
  gap:10px;
  align-items:baseline;
  padding:4px 0;
  border-bottom:1px dashed rgba(61,38,32,.7);
}
.detail-row:last-child {border-bottom:0;}
.detail-key {
  flex:0 0 84px;
  font-size:11px;
  letter-spacing:.1em;
  color:var(--ink-faint);
}
.detail-value {
  flex:1 1 auto;
  min-width:0;
  font-size:13px;
  color:var(--ink);
}
.detail-row:nth-child(even) .detail-value {
  color:var(--ink-dim);
}
.movie-synopsis {
  padding:12px 14px;
  background:linear-gradient(180deg,#1c100e,#160c0a);
  border:1px solid var(--rust-line);
  border-left:2px solid var(--cyan);
}
.synopsis-paragraph {
  font-size:13px;
  color:var(--ink-dim);
  line-height:1.75;
  margin-bottom:8px;
}
.synopsis-paragraph:last-child {margin-bottom:0;}
.synopsis-paragraph::first-letter {
  color:var(--cyan);
  font-weight:700;
}
.movie-cast {
  padding:12px 14px;
  background:#190e0c;
  border:1px solid var(--rust-line);
}
.cast-list {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.cast-item {
  display:flex;
  align-items:center;
  gap:7px;
  padding:3px 11px 3px 3px;
  background:#241310;
  border:1px solid var(--rust-line);
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%);
  transition:border-color .15s,box-shadow .15s;
}
.cast-item:hover {
  border-color:var(--cyan);
  box-shadow:0 0 10px var(--cyan-glow);
}
.cast-avatar {
  width:22px;
  height:22px;
  flex:0 0 22px;
  border-radius:2px;
  background:linear-gradient(135deg,var(--blue),var(--violet));
  clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%);
  box-shadow:0 0 8px var(--blue-glow) inset;
}
.cast-name {
  font-size:12px;
  letter-spacing:.06em;
  color:var(--ink);
  white-space:nowrap;
}
.movie-timeline {
  padding:12px 14px;
  background:linear-gradient(180deg,#1b0f0d,#150b09);
  border:1px solid var(--rust-line);
  border-top:1px solid rgba(61,107,255,.4);
}
.timeline-track {
  display:flex;
  flex-direction:column;
  gap:0;
  position:relative;
  padding-left:14px;
  border-left:1px solid var(--rust-line);
}
.timeline-node {
  position:relative;
  display:grid;
  grid-template-columns:76px 1fr;
  gap:4px 10px;
  padding:6px 0 6px 12px;
  border-bottom:1px dashed rgba(61,38,32,.55);
}
.timeline-node:last-child {border-bottom:0;}
.node-timecode {
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--cyan);
  white-space:nowrap;
  grid-row:1;
}
.node-mark {
  position:absolute;
  left:-20px;
  top:11px;
  width:9px;
  height:9px;
  background:var(--blue);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  box-shadow:0 0 10px var(--blue-glow),0 0 20px var(--blue-glow);
}
.timeline-node:nth-child(3n) .node-mark {
  background:var(--violet);
  box-shadow:0 0 10px var(--violet-glow),0 0 20px var(--violet-glow);
}
.timeline-node:nth-child(3n/**/+1) .node-mark {
  background:var(--cyan);
  box-shadow:0 0 10px var(--cyan-glow),0 0 20px var(--cyan-glow);
}
.node-label {
  grid-column:2;
  grid-row:1;
  font-size:12px;
  color:var(--ink-dim);
  line-height:1.55;
}
.movie-episodes {
  padding:12px 14px;
  background:linear-gradient(180deg,#1c110e,#160c0a);
  border:1px solid var(--rust-line);
}
.episode-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:var(--gap);
  align-items:start;
}
.episode-card {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:9px 10px 10px;
  background:#22120f;
  border:1px solid var(--rust-line);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  transition:border-color .15s,box-shadow .15s,transform .15s;
}
.episode-card:hover {
  border-color:var(--blue);
  box-shadow:0 0 16px rgba(61,107,255,.3);
  transform:translateY(-2px);
}
.episode-barcode {
  display:block;
  height:8px;
  width:100%;
  background:
    repeating-linear-gradient(90deg,
      var(--hot) 0 2px,#3a1c16 2px 4px,
      var(--blue) 4px 5px,#3a1c16 5px 8px,
      #ffb03c 8px 9px,#3a1c16 9px 12px);
  opacity:.85;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%);
}
.episode-number {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  color:var(--ink-faint);
}
.episode-title {
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--ink);
}
.episode-summary {
  font-size:11.5px;
  line-height:1.6;
  color:var(--ink-dim);
}
.episode-duration {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  color:var(--cyan);
  margin-top:auto;
  padding-top:5px;
  border-top:1px solid rgba(61,38,32,.6);
}
.episode-card-active {
  border-color:var(--hot);
  box-shadow:0 0 0 1px rgba(255,90,60,.4),0 0 22px rgba(255,90,60,.3);
  background:linear-gradient(180deg,#2a1310,#1e0f0c);
}
.episode-card-active .episode-number {
  color:var(--hot);
}
.episode-card-active .episode-barcode {
  opacity:1;
  background:
    repeating-linear-gradient(90deg,
      #ff7a3c 0 2px,#4a1c12 2px 4px,
      #ff5a3c 4px 5px,#4a1c12 5px 8px,
      #ffb03c 8px 9px,#4a1c12 9px 12px);
}
.movie-comments {
  padding:12px 14px;
  background:linear-gradient(180deg,#1a0f0d,#140b09);
  border:1px solid var(--rust-line);
}
.comment-columns {
  display:grid;
  grid-template-columns:1fr;
  gap:var(--gap);
  align-items:start;
}
.comment-column {
  display:flex;
  flex-direction:column;
  gap:7px;
}
.comment-column-left {
  padding-right:0;
}
.comment-column-right {
  padding-left:0;
}
.comment-card {
  padding:8px 10px;
  background:#23120f;
  border:1px solid var(--rust-line);
  border-left:2px solid var(--blue);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
}
.comment-column-left .comment-card:nth-child(even) {
  border-left-color:var(--violet);
  margin-left:10px;
}
.comment-column-right .comment-card {
  border-left-color:var(--cyan);
}
.comment-column-right .comment-card:nth-child(even) {
  border-left-color:var(--hot);
  margin-left:10px;
}
.comment-nickname {
  display:block;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  color:var(--cyan);
  margin-bottom:3px;
}
.comment-column-left .comment-card:nth-child(even) .comment-nickname {color:var(--violet);}
.comment-column-right .comment-card:nth-child(even) .comment-nickname {color:var(--hot);}
.comment-text {
  font-size:12px;
  line-height:1.65;
  color:var(--ink-dim);
}
.recommend-region {
  padding:12px 14px;
  border:1px solid var(--rust-line);
  background:linear-gradient(180deg,#1a0f0d,#140b09);
  position:relative;
}
.region-blue {border-top:2px solid var(--blue);}
.region-violet {border-top:2px solid var(--violet);}
.region-cyan {border-top:2px solid var(--cyan);}
.recommend-heading {
  font-size:13px;
  font-weight:700;
  letter-spacing:.2em;
  padding-bottom:6px;
  margin-bottom:9px;
  border-bottom:1px solid var(--rust-line);
}
.region-blue .recommend-heading {color:var(--blue);text-shadow:0 0 12px var(--blue-glow);}
.region-violet .recommend-heading {color:var(--violet);text-shadow:0 0 12px var(--violet-glow);}
.region-cyan .recommend-heading {color:var(--cyan);text-shadow:0 0 12px var(--cyan-glow);}
.recommend-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:var(--gap);
  align-items:start;
}
a.recommend-card {
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:6px;
  background:#22120f;
  border:1px solid var(--rust-line);
  text-decoration:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
  transition:border-color .15s,box-shadow .15s,transform .15s;
}
[data-runtime="recommendation"] img {
  width:100%;
  height:auto;
  aspect-ratio:16 / 10;
  object-fit:cover;
  display:block;
  background:#0d0705;
  filter:saturate(1.1) contrast(1.05);
}
a.recommend-card [data-runtime="name"] {
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--ink);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
a.recommend-card [data-runtime="blurb"] {
  font-size:10.5px;
  line-height:1.5;
  color:var(--ink-faint);
}
a.recommend-card:hover {
  transform:translateY(-2px);
  text-decoration:underline;
}
.region-blue a.recommend-card:hover {border-color:var(--blue);box-shadow:0 0 16px rgba(61,107,255,.35);}
.region-violet a.recommend-card:hover {border-color:var(--violet);box-shadow:0 0 16px rgba(163,77,255,.35);}
.region-cyan a.recommend-card:hover {border-color:var(--cyan);box-shadow:0 0 16px rgba(40,224,216,.35);}
.site-footer {
  max-width:1180px;
  margin:0 auto;
  padding:14px 14px 26px;
  display:flex;
  flex-direction:column;
  gap:9px;
  border-top:1px solid var(--rust-line);
}
.footer-disclaimer {
  font-size:11px;
  line-height:1.7;
  color:var(--ink-faint);
  letter-spacing:.02em;
}
.footer-nav {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
a[data-contract="footer-home"].footer-link, a[data-contract="footer-sitemap"].footer-link {
  font-size:11px;
  letter-spacing:.16em;
  text-decoration:none;
  color:var(--ink-dim);
  white-space:nowrap;
  border-bottom:1px solid transparent;
  transition:color .15s,border-color .15s;
}
a[data-contract="footer-home"].footer-link {color:var(--blue);}
a[data-contract="footer-sitemap"].footer-link {color:var(--cyan);}
a[data-contract="footer-home"].footer-link:hover, a[data-contract="footer-sitemap"].footer-link:hover {
  text-decoration:underline;
  border-bottom-color:currentColor;
}
.friend-links {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:5px 10px;
  padding-top:7px;
  border-top:1px dashed rgba(61,38,32,.6);
}
.friend-links-label {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.2em;
  color:var(--ink-faint);
  white-space:nowrap;
}
a.runtime-friend-link {
  font-size:11px;
  color:var(--ink-dim);
  text-decoration:none;
  white-space:nowrap;
  transition:color .15s,text-shadow .15s;
}
a.runtime-friend-link:hover {
  color:var(--violet);
  text-decoration:underline;
  text-shadow:0 0 10px var(--violet-glow);
}
@media (min-width:560px){.detail-list {grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;}
.comment-columns {grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;}
.comment-column-left {padding-right:8px;}
.comment-column-right {padding-left:8px;}
.comment-column-right {padding-top:14px;}}
@media (min-width:720px){.episode-grid {grid-template-columns:repeat(auto-fill,minmax(230px,1fr));}
.recommend-grid {grid-template-columns:repeat(auto-fill,minmax(160px,1fr));}
.movie-overview {gap:16px;}}
@media (min-width:960px){.overview-hero {grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:26px;}
.poster-column.hero-side-left {max-width:300px;}
.page-main {padding:16px 20px 36px;gap:24px;}
.site-header {padding:9px 20px;}
.site-footer {padding:16px 20px 30px;}
.detail-list {grid-template-columns:repeat(3,minmax(0,1fr));}
.episode-grid {grid-template-columns:repeat(auto-fill,minmax(240px,1fr));}
.recommend-grid {grid-template-columns:repeat(auto-fill,minmax(170px,1fr));}
.timeline-track {padding-left:18px;}
.timeline-node {grid-template-columns:88px 1fr;}}
@media (min-width:1200px){.episode-grid {grid-template-columns:repeat(4,minmax(0,1fr));}
.recommend-grid {grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (max-width:480px){.overview-hero {grid-template-columns:1fr;gap:14px;}
.poster-column.hero-side-left {max-width:230px;}
.overview-titles .hero-figure-note:nth-child(2) {align-self:flex-start;}
.movie-title {font-size:26px;}
.timeline-node {grid-template-columns:64px 1fr;}
.detail-key {flex:0 0 66px;}
.ctrl {font-size:10.5px;padding:3px 8px;}
.episode-grid {grid-template-columns:1fr;}
.recommend-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:360px){.recommend-grid {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}
