:root {
  --abyss:#05090c;
  --deep:#081218;
  --deep-2:#0b1a21;
  --panel:#0a151b;
  --panel-2:#0d1d25;
  --line:#16323c;
  --line-soft:#122730;
  --ink:#c3d2d5;
  --ink-dim:#7d9199;
  --ink-faint:#556a72;
  --gold:#c9a24a;
  --gold-hi:#e6c477;
  --gold-deep:#8a6c26;
  --scale:#1e5a5e;
  --scale-hi:#2f8b86;
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif CJK SC","SimSun",serif;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  --gap:clamp(8px,1.1vw,14px);
  --tight:clamp(4px,0.6vw,8px);
  --pad:clamp(8px,1vw,14px);
}
*, *::before, *::after {box-sizing:border-box;}
html, body {margin:0;padding:0;}
ul, ol, li, h1, h2, p {margin:0;padding:0;}
ul, ol {list-style:none;}
img, video {display:block;max-width:100%;}
a {color:inherit;text-decoration:none;}
table {border-collapse:collapse;width:100%;}
button {font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
h1, h2 {font-weight:600;}
html {-webkit-text-size-adjust:100%;}
body {
  background:
    radial-gradient(120% 60% at 20% -10%, #0d232b 0%, rgba(6,12,16,0) 60%),
    radial-gradient(90% 50% at 100% 0%, #10262c 0%, rgba(6,12,16,0) 55%),
    var(--abyss);
  color:var(--ink);
  font-family:var(--sans);
  font-size:13px;
  line-height:1.5;
  letter-spacing:.01em;
  min-height:100vh;
  overflow-x:hidden;
}
body.lights-dim {filter:brightness(.62) contrast(1.04);}
.site-header {
  position:sticky;
  top:0;
  z-index:40;
  background:linear-gradient(180deg, rgba(5,9,12,.96), rgba(5,9,12,.78));
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(6px);
}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--gap);
  padding:6px clamp(10px,2vw,26px);
  max-width:1560px;
  margin:0 auto;
  flex-wrap:wrap;
}
a[data-contract="site-name"] {
  font-family:var(--serif);
  font-size:17px;
  letter-spacing:.16em;
  color:var(--gold-hi);
  text-decoration:none;
  text-shadow:0 0 14px rgba(201,162,74,.28);
  position:relative;
  padding-left:12px;
}
a[data-contract="site-name"]::before {
  content:"";
  position:absolute;
  left:0;top:50%;
  width:5px;height:14px;
  transform:translateY(-50%);
  background:linear-gradient(180deg,var(--gold-hi),var(--scale));
  clip-path:polygon(50% 0,100% 22%,100% 78%,50% 100%,0 78%,0 22%);
}
.categories-bar {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
a.runtime-category {
  white-space:nowrap;
  font-size:12px;
  padding:3px 10px;
  color:var(--ink-dim);
  text-decoration:none;
  border:1px solid var(--line-soft);
  background:rgba(16,38,44,.35);
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);
  transition:color .18s, border-color .18s, background .18s;
}
a.runtime-category:hover {
  color:var(--gold-hi);
  border-color:var(--gold-deep);
  background:rgba(201,162,74,.08);
}
.page-main {
  max-width:1560px;
  margin:0 auto;
  padding:var(--gap) clamp(10px,2vw,26px) clamp(18px,3vw,40px);
  display:flex;
  flex-direction:column;
  gap:var(--gap);
}
.player-deck {
  display:flex;
  flex-direction:column;
  gap:var(--tight);
  width:100%;
}
.player-frame {
  width:100%;
  border:1px solid var(--line);
  background:#020506;
  box-shadow:0 0 0 1px rgba(201,162,74,.06), 0 14px 40px rgba(0,0,0,.6);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  overflow:hidden;
}
.player-frame video {
  display:block;
  background:#000;
}
.player-deck.is-theater {
  position:relative;
  z-index:30;
}
.player-deck.is-theater .player-frame {
  border-color:var(--gold-deep);
  box-shadow:0 0 0 1px rgba(201,162,74,.25), 0 0 60px rgba(201,162,74,.12);
}
.player-control-bar {
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  padding:5px 6px;
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line-soft);
}
.ctrl-btn {
  font-size:11.5px;
  letter-spacing:.05em;
  padding:4px 11px;
  color:var(--ink-dim);
  border:1px solid var(--line);
  background:rgba(10,24,30,.7);
  clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);
  transition:color .16s,border-color .16s,background .16s;
}
.ctrl-btn:hover {color:var(--ink);border-color:var(--scale);}
.ctrl-btn.is-active {
  color:#06100f;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold));
  border-color:var(--gold);
  box-shadow:0 0 12px rgba(201,162,74,.35);
}
.timeline-strip {
  background:linear-gradient(180deg, rgba(11,26,33,.9), rgba(7,16,21,.9));
  border:1px solid var(--line-soft);
  border-left:2px solid var(--gold-deep);
  padding:var(--tight) var(--pad);
}
.timeline-heading {
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.22em;
  color:var(--gold);
  padding-bottom:var(--tight);
  margin-bottom:var(--tight);
  border-bottom:1px solid var(--line-soft);
}
.timeline-rail {
  display:flex;
  flex-wrap:nowrap;
  gap:0;
  overflow-x:auto;
  scrollbar-width:thin;
  padding-bottom:2px;
}
.timeline-node {
  flex:1 0 auto;
  min-width:0;
  position:relative;
  padding:6px 12px 6px 16px;
  border-right:1px solid var(--line-soft);
  display:flex;
  flex-direction:column;
  gap:1px;
  color:var(--ink-faint);
  --node-accent:var(--scale);
}
.timeline-node::before {
  content:"";
  position:absolute;
  left:4px;top:9px;
  width:7px;height:7px;
  background:var(--node-accent);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  box-shadow:0 0 8px rgba(47,139,134,.5);
}
.timeline-node:last-child {border-right:0;}
.node-timecode {
  font-size:10.5px;
  letter-spacing:.12em;
  color:var(--ink-faint);
  text-transform:uppercase;
}
.node-label {
  font-family:var(--serif);
  font-size:12.5px;
  color:var(--ink);
  white-space:nowrap;
}
.timeline-node[data-node="tide-pause"] {
  --node-accent:var(--gold-hi);
  background:linear-gradient(90deg, rgba(201,162,74,.09), rgba(201,162,74,0));
  margin:0 6px;
}
.timeline-node[data-node="tide-pause"]::before {
  background:var(--gold-hi);
  box-shadow:0 0 10px rgba(230,196,119,.7);
}
.timeline-node[data-node="tide-pause"] .node-label {color:var(--gold-hi);}
.timeline-node[data-node="tide-pause"] .node-timecode {color:var(--gold-deep);}
.movie-overview {
  display:flex;
  flex-direction:column;
  gap:var(--gap);
}
.overview-main {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:var(--gap);
  align-items:start;
}
.hero-portrait {
  position:relative;
  grid-column:1;
  grid-row:1 / span 2;
  overflow:hidden;
  border:1px solid var(--line);
  background:#04090c;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.hero-media-layer {
  position:relative;
  z-index:1;
}
.hero-media-layer img {
  width:100%;
  height:auto;
  object-fit:cover;
  display:block;
  filter:saturate(.92) contrast(1.06) brightness(.86);
}
.hero-scale-glow {
  position:absolute;
  inset:auto 0 0 0;
  height:62%;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(120% 100% at 50% 118%, rgba(47,139,134,.55) 0%, rgba(30,90,94,.22) 38%, rgba(5,9,12,0) 74%),
    repeating-linear-gradient(115deg, rgba(201,162,74,.10) 0 2px, rgba(5,9,12,0) 2px 11px);
  mix-blend-mode:screen;
  animation:scale-drift 7s ease-in-out infinite;
}
@keyframes scale-drift{
  0%,100%{opacity:.72;transform:translateY(0);}
  50%{opacity:1;transform:translateY(-8px);}
}
.hero-ripple-overlay {
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(120,200,205,.07) 0 1px, rgba(0,0,0,0) 1px 7px),
    repeating-linear-gradient(90deg, rgba(120,200,205,.05) 0 1px, rgba(0,0,0,0) 1px 9px);
  opacity:.75;
  animation:ripple 9s linear infinite;
}
@keyframes ripple{
  0%{background-position:0 0,0 0;}
  100%{background-position:0 -56px, 36px 0;}
}
.hero-silhouette {
  position:absolute;
  top:5%;
  right:4%;
  width:38%;
  max-width:190px;
  aspect-ratio:3 / 4;
  z-index:4;
  pointer-events:none;
  opacity:.5;
  filter:blur(2.5px) brightness(.5);
}
.silhouette-umbrella {
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  height:34%;
  background:radial-gradient(60% 100% at 50% 100%, #0a1216 0%, #05090c 70%, rgba(5,9,12,0) 100%);
  clip-path:polygon(50% 0,88% 62%,100% 100%,0 100%,12% 62%);
}
.silhouette-figure {
  position:absolute;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:34%;
  height:62%;
  background:linear-gradient(180deg, #0a1317, #04080a);
  clip-path:polygon(42% 0,58% 0,66% 16%,72% 46%,64% 100%,36% 100%,28% 46%,34% 16%);
}
.hero-title-block {
  grid-column:2;
  grid-row:1;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:var(--pad);
  background:linear-gradient(180deg, rgba(13,29,37,.92), rgba(7,16,21,.92));
  border:1px solid var(--line-soft);
  border-left:2px solid var(--gold-deep);
}
.movie-title {
  font-family:var(--serif);
  font-size:clamp(19px,2vw,27px);
  letter-spacing:.1em;
  color:var(--gold-hi);
  line-height:1.25;
  text-shadow:0 0 20px rgba(201,162,74,.22);
}
.movie-tagline {
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.14em;
  color:var(--scale-hi);
  padding-bottom:6px;
  border-bottom:1px solid var(--line-soft);
}
.movie-seo {
  font-size:12px;
  line-height:1.72;
  color:var(--ink-dim);
  text-align:justify;
}
.info-column {
  grid-column:2;
  grid-row:2;
  display:flex;
  flex-direction:column;
  gap:var(--gap);
  align-items:start;
}
.details-panel {
  width:100%;
  padding:var(--pad);
  background:rgba(10,21,27,.86);
  border:1px solid var(--line-soft);
}
.details-heading, .status-heading, .cast-heading, .synopsis-heading, .episodes-heading, .comments-heading {
  font-family:var(--serif);
  font-size:12.5px;
  letter-spacing:.2em;
  color:var(--gold);
  padding-bottom:5px;
  margin-bottom:7px;
  border-bottom:1px solid var(--line-soft);
  position:relative;
}
.details-heading::after, .status-heading::after, .cast-heading::after, .synopsis-heading::after, .episodes-heading::after, .comments-heading::after {
  content:"";
  position:absolute;
  left:0;bottom:-1px;
  width:34px;height:1px;
  background:var(--gold-hi);
}
.details-table {
  font-size:11.5px;
  line-height:1.42;
}
.detail-row {
  border-bottom:1px solid rgba(22,50,60,.55);
}
.detail-row:last-child {border-bottom:0;}
.detail-key {
  text-align:left;
  font-weight:400;
  color:var(--ink-faint);
  letter-spacing:.08em;
  padding:3px 8px 3px 0;
  width:5.4em;
  vertical-align:top;
  white-space:nowrap;
}
.detail-value {
  color:var(--ink);
  padding:3px 0;
  vertical-align:top;
}
.episode-status-panel {
  width:100%;
  padding:var(--pad);
  background:rgba(10,21,27,.86);
  border:1px solid var(--line-soft);
}
.status-line {
  font-size:11.5px;
  color:var(--ink-dim);
  margin-bottom:7px;
}
.status-progress-track {
  height:6px;
  width:100%;
  background:rgba(30,90,94,.22);
  border:1px solid var(--line);
  overflow:hidden;
  clip-path:polygon(3px 0,100% 0,100% calc(100% - 3px),calc(100% - 3px) 100%,0 100%,0 3px);
}
.status-progress-fill {
  display:block;
  height:100%;
  width:50%;
  background:linear-gradient(90deg,var(--scale),var(--scale-hi) 55%,var(--gold));
  box-shadow:0 0 10px rgba(201,162,74,.4);
}
.status-progress-fill[data-progress="18"] {width:50%;}
.cast-panel {
  grid-column:1 / -1;
  padding:var(--pad);
  background:linear-gradient(180deg, rgba(13,29,37,.9), rgba(7,16,21,.9));
  border:1px solid var(--line-soft);
}
.cast-row {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--tight);
  align-items:start;
}
.cast-card {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:3px;
  padding:6px 4px;
  border:1px solid transparent;
  transition:border-color .18s,background .18s;
}
.cast-card:hover {
  border-color:var(--line);
  background:rgba(30,90,94,.12);
}
.cast-avatar {
  width:44px;
  height:44px;
  border-radius:50%;
  background:
    radial-gradient(circle at 34% 28%, rgba(230,196,119,.35), rgba(0,0,0,0) 62%),
    linear-gradient(150deg,var(--scale) 0%, var(--deep-2) 70%);
  border:1px solid var(--gold-deep);
  box-shadow:inset 0 0 12px rgba(0,0,0,.7), 0 0 10px rgba(201,162,74,.12);
  position:relative;
  flex:0 0 auto;
}
.cast-avatar::after {
  content:"";
  position:absolute;
  inset:6px;
  border-radius:50%;
  background:linear-gradient(180deg, rgba(195,210,213,.16), rgba(0,0,0,0));
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
}
.cast-name {
  font-family:var(--serif);
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--ink);
}
.cast-role {
  font-size:10.5px;
  color:var(--ink-faint);
  line-height:1.3;
}
.synopsis-panel {
  grid-column:1 / -1;
  padding:var(--pad);
  background:rgba(10,21,27,.86);
  border:1px solid var(--line-soft);
}
.synopsis-para {
  font-size:12px;
  line-height:1.78;
  color:var(--ink-dim);
  text-align:justify;
  margin-bottom:7px;
  padding-left:9px;
  border-left:1px solid var(--line-soft);
}
.synopsis-para:last-child {margin-bottom:0;border-left-color:var(--gold-deep);color:var(--ink);}
.episodes-panel {
  padding:var(--pad);
  background:linear-gradient(180deg, rgba(11,26,33,.9), rgba(6,14,18,.9));
  border:1px solid var(--line-soft);
}
.episode-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(12px,2vw,28px);
}
.episode-row {
  display:grid;
  grid-template-columns:1.9em minmax(6em,auto) minmax(0,1fr) auto;
  align-items:baseline;
  gap:8px;
  padding:3px 0;
  border-bottom:1px solid rgba(22,50,60,.5);
  line-height:1.4;
}
.episode-number {
  font-family:var(--serif);
  font-size:11px;
  color:var(--gold-deep);
  letter-spacing:.05em;
  text-align:right;
}
.episode-title {
  font-family:var(--serif);
  font-size:12.5px;
  color:var(--ink);
  letter-spacing:.05em;
  white-space:nowrap;
}
.episode-summary {
  font-size:11.5px;
  color:var(--ink-faint);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.episode-duration {
  font-size:10.5px;
  color:var(--scale-hi);
  letter-spacing:.05em;
  white-space:nowrap;
  padding-left:6px;
  border-left:1px solid var(--line-soft);
}
.comments-panel {
  padding:var(--pad);
  background:rgba(9,19,25,.9);
  border:1px solid var(--line-soft);
}
.comments-masonry {
  column-count:2;
  column-gap:clamp(12px,2vw,26px);
}
.comment-card {
  break-inside:avoid;
  display:inline-flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  width:100%;
  margin:0 0 var(--tight);
  padding:6px 9px;
  background:rgba(13,29,37,.6);
  border:1px solid var(--line-soft);
  border-left:2px solid var(--scale);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);
}
.comment-avatar {
  width:16px;
  height:16px;
  border-radius:50%;
  flex:0 0 auto;
  background:linear-gradient(150deg,var(--scale-hi),var(--deep-2));
  border:1px solid var(--scale);
}
.comment-nickname {
  font-family:var(--serif);
  font-size:11.5px;
  color:var(--gold);
  letter-spacing:.05em;
}
.comment-text {
  flex:1 0 100%;
  font-size:11.5px;
  line-height:1.6;
  color:var(--ink-dim);
  text-align:justify;
}
.rec-region {
  padding:var(--pad);
  background:linear-gradient(180deg, rgba(11,26,33,.86), rgba(6,14,18,.86));
  border:1px solid var(--line-soft);
  border-top:2px solid var(--line);
}
.page-main > .rec-region {
  display:flex;
  flex-direction:column;
  gap:var(--tight);
}
.rec-heading {
  font-family:var(--serif);
  font-size:12.5px;
  letter-spacing:.18em;
  color:var(--gold);
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rec-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(0,1fr));
  gap:var(--tight);
  align-items:start;
}
a.rec-card {
  display:flex;
  flex-direction:column;
  gap:2px;
  text-decoration:none;
  color:var(--ink);
  background:rgba(8,18,24,.75);
  border:1px solid var(--line-soft);
  padding:4px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);
  transition:border-color .18s,background .18s,transform .18s;
}
a.rec-card:hover {
  border-color:var(--gold-deep);
  background:rgba(201,162,74,.07);
  transform:translateY(-2px);
}
[data-runtime="recommendation"] img, .rec-thumb {
  width:100%;
  aspect-ratio:16 / 10;
  height:auto;
  object-fit:cover;
  display:block;
  filter:saturate(.9) brightness(.82) contrast(1.05);
  background:#04090c;
}
a.rec-card:hover .rec-thumb {filter:saturate(1) brightness(.95);}
.rec-name {
  font-family:var(--serif);
  font-size:12px;
  color:var(--ink);
  letter-spacing:.04em;
  text-align:right;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rec-blurb {
  font-size:10.5px;
  line-height:1.45;
  color:var(--ink-faint);
  text-align:right;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.site-footer {
  max-width:1560px;
  margin:0 auto;
  padding:clamp(10px,1.6vw,20px) clamp(10px,2vw,26px) clamp(20px,3vw,34px);
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:var(--tight);
  background:linear-gradient(180deg, rgba(5,9,12,0), rgba(8,18,24,.7));
}
.footer-disclaimer {
  font-size:10.5px;
  line-height:1.6;
  color:var(--ink-faint);
  max-width:78ch;
}
.footer-nav {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
a[data-contract="footer-home"], a[data-contract="footer-sitemap"] {
  font-size:11.5px;
  color:var(--ink-dim);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .16s,border-color .16s;
}
a[data-contract="footer-home"]:hover, a[data-contract="footer-sitemap"]:hover {
  color:var(--gold-hi);
  border-bottom-color:var(--gold-deep);
}
.friend-links {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 12px;
  padding-top:var(--tight);
  border-top:1px dashed var(--line-soft);
}
.friend-links-label {
  font-family:var(--serif);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--gold-deep);
}
a.runtime-friend-link {
  font-size:11px;
  color:var(--ink-faint);
  text-decoration:none;
  white-space:nowrap;
  transition:color .16s;
}
a.runtime-friend-link:hover {color:var(--scale-hi);}
@media (max-width:1180px){.overview-main {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.hero-portrait {grid-row:1 / span 2;}
.cast-row {grid-template-columns:repeat(3,minmax(0,1fr));}
.rec-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:900px){.overview-main {grid-template-columns:1fr;}
.hero-portrait {grid-column:1;grid-row:auto;}
.hero-title-block {grid-column:1;grid-row:auto;}
.info-column {grid-column:1;grid-row:auto;}
.episode-list {grid-template-columns:1fr;}
.comments-masonry {column-count:1;}}
@media (max-width:680px){body {font-size:12.5px;}
.cast-row {grid-template-columns:repeat(2,minmax(0,1fr));}
.rec-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
.episode-row {
    grid-template-columns:1.8em minmax(0,1fr) auto;
    grid-template-areas:
      "num title dur"
      ". summary summary";
    row-gap:2px;
  }
.episode-number {grid-area:num;}
.episode-title {grid-area:title;white-space:normal;}
.episode-duration {grid-area:dur;}
.episode-summary {grid-area:summary;white-space:normal;text-overflow:clip;}
.hero-silhouette {width:44%;max-width:150px;}
.player-control-bar {gap:3px;}
.ctrl-btn {padding:4px 8px;font-size:11px;}}
@media (max-width:480px){.rec-grid {grid-template-columns:1fr;}
.cast-row {grid-template-columns:repeat(2,minmax(0,1fr));}
.timeline-node {padding-right:9px;}
.movie-title {font-size:19px;}}

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}
