:root {
  --ink-0:#04070d;
  --ink-1:#080e18;
  --ink-2:#0d1622;
  --ink-3:#132030;
  --ink-4:#1c2c40;
  --line:#22344a;
  --line-soft:#182636;
  --mist:#8fa3ba;
  --mist-2:#a9bdd2;
  --paper:#e7eef7;
  --paper-dim:#c3d0e0;
  --blue:#3f6fa8;
  --blue-bright:#6fa3d8;
  --orange:#ff8a3d;
  --orange-soft:#e0762f;
  --orange-glow:rgba(255,138,61,.28);
  --radius:4px;
  --gap:22px;
  --gap-tight:14px;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*, *::before, *::after {box-sizing:border-box;}
html {-webkit-text-size-adjust:100%;}
body, h1, h2, p, figure, figcaption, dl, dd, dt, ol, ul {margin:0;padding:0;}
ol, ul {list-style:none;}
img, video {display:block;max-width:100%;}
img {height:auto;}
button, input {font:inherit;color:inherit;}
a {color:inherit;text-decoration:none;}
body {
  background:
    radial-gradient(120% 60% at 78% -8%,rgba(255,138,61,.13) 0%,rgba(255,138,61,0) 55%),
    radial-gradient(90% 50% at 12% 6%,rgba(63,111,168,.22) 0%,rgba(63,111,168,0) 60%),
    linear-gradient(180deg,var(--ink-1) 0%,var(--ink-0) 46%,#05090f 100%);
  background-attachment:fixed;
  color:var(--paper);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.62;
  font-weight:400;
  letter-spacing:.01em;
  min-height:100vh;
  overflow-x:hidden;
}
body::after {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:9;
  opacity:.25;
  background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);
}
::selection {background:var(--orange);color:var(--ink-0);}
:focus-visible {outline:2px solid var(--orange);outline-offset:2px;}
.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:linear-gradient(180deg,rgba(6,11,19,.96) 0%,rgba(6,11,19,.86) 100%);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(8px);
}
.header-inner {
  max-width:1240px;
  margin:0 auto;
  padding:12px 24px;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}
a[data-contract="site-name"].site-brand {
  font-size:19px;
  font-weight:800;
  letter-spacing:.16em;
  color:var(--paper);
  text-decoration:none;
  padding-left:12px;
  border-left:3px solid var(--orange);
  line-height:1.1;
  white-space:nowrap;
}
a[data-contract="site-name"].site-brand:hover {
  color:var(--orange);
}
.category-nav {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-left:auto;
  min-width:0;
}
a.runtime-category {
  display:inline-block;
  white-space:nowrap;
  font-size:13px;
  font-weight:500;
  color:var(--mist);
  text-decoration:none;
  padding:5px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(19,32,48,.6);
  transition:color .18s,border-color .18s,background .18s;
}
a.runtime-category:hover {
  color:var(--paper);
  border-color:var(--orange-soft);
  background:rgba(255,138,61,.12);
}
.page-main {
  max-width:1240px;
  margin:0 auto;
  padding:26px 24px 8px;
  display:flex;
  flex-direction:column;
  gap:var(--gap);
}
.section-heading {
  font-size:16px;
  font-weight:800;
  letter-spacing:.1em;
  color:var(--paper);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:var(--gap-tight);
}
.section-heading::before {
  content:"";
  flex:0 0 auto;
  width:14px;
  height:3px;
  background:var(--orange);
  box-shadow:0 0 10px var(--orange-glow);
}
.section-heading::after {
  content:"";
  flex:1 1 auto;
  height:1px;
  background:linear-gradient(90deg,var(--line) 0%,rgba(34,52,74,0) 100%);
}
.movie-info {
  background:
    linear-gradient(160deg,rgba(19,32,48,.9) 0%,rgba(8,14,24,.94) 58%,rgba(13,22,34,.9) 100%);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:24px;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  grid-template-areas:
    "head hero"
    "player hero"
    "synopsis synopsis"
    "cast cast"
    "status status"
    "details details";
  column-gap:26px;
  row-gap:var(--gap);
  box-shadow:0 24px 60px -40px #000 inset;
}
.movie-headline {
  grid-area:head;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.movie-title {
  font-size:clamp(26px,3.4vw,40px);
  font-weight:800;
  line-height:1.12;
  letter-spacing:.02em;
  color:#fff;
  text-shadow:0 0 26px rgba(111,163,216,.28);
}
.movie-tagline {
  font-size:15px;
  font-weight:600;
  color:var(--orange);
  letter-spacing:.04em;
  padding-left:12px;
  border-left:2px solid var(--orange-soft);
}
.movie-seo {
  font-size:13.5px;
  line-height:1.75;
  color:var(--mist);
  font-weight:300;
}
.hero-media {
  grid-area:hero;
  margin:0;
  align-self:start;
  width:100%;
  max-width:280px;
  justify-self:end;
  position:relative;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 20px 45px -22px #000;
}
.hero-media::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(200deg,rgba(255,138,61,.18) 0%,rgba(255,138,61,0) 46%),
    linear-gradient(0deg,rgba(4,7,13,.72) 0%,rgba(4,7,13,0) 42%);
}
.hero-poster {
  width:100%;
  height:auto;
  aspect-ratio:9 / 16;
  object-fit:cover;
  filter:saturate(.86) contrast(1.06) brightness(.9);
}
.player-shell {
  grid-area:player;
  position:relative;
  min-width:0;
  width:100%;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#000;
  overflow:hidden;
  transition:box-shadow .25s,border-color .25s;
}
.player-video {
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  background:#000;
  object-fit:cover;
}
.player-shell.is-playing {
  border-color:var(--orange-soft);
  box-shadow:0 0 0 1px rgba(255,138,61,.35),0 18px 46px -26px var(--orange-glow);
}
.player-shell.is-lights-off {
  box-shadow:0 0 0 6px #000,0 0 60px 8px rgba(0,0,0,.9);
  border-color:#000;
}
.player-shell.is-theater {
  border-color:var(--blue-bright);
}
.player-controls {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  background:linear-gradient(180deg,rgba(13,22,34,.94) 0%,rgba(6,11,19,.98) 100%);
  border-top:1px solid var(--line-soft);
}
.ctrl-btn {
  appearance:none;
  border:1px solid var(--line);
  background:var(--ink-3);
  color:var(--paper-dim);
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.04em;
  padding:5px 11px;
  border-radius:3px;
  cursor:pointer;
  white-space:nowrap;
  transition:color .16s,border-color .16s,background .16s,transform .16s;
}
.ctrl-btn:hover {
  color:#fff;
  border-color:var(--orange-soft);
  background:rgba(255,138,61,.16);
}
.ctrl-btn:active {
  transform:translateY(1px);
}
.ctrl-range {
  appearance:none;
  -webkit-appearance:none;
  height:4px;
  border-radius:2px;
  background:linear-gradient(90deg,var(--blue-bright) 0%,var(--ink-4) 100%);
  cursor:pointer;
  flex:1 1 120px;
  min-width:88px;
}
.ctrl-range::-webkit-slider-thumb {
  -webkit-appearance:none;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--orange);
  border:2px solid var(--ink-0);
  box-shadow:0 0 8px var(--orange-glow);
}
.ctrl-range::-moz-range-thumb {
  width:12px;
  height:12px;
  border:2px solid var(--ink-0);
  border-radius:50%;
  background:var(--orange);
}
.player-shell.is-muted .ctrl-btn[data-player-action="mute"] {
  color:var(--orange);
  border-color:var(--orange-soft);
}
.player-shell.is-speed-changed .ctrl-btn[data-player-action="speed"] {
  color:var(--orange);
  border-color:var(--orange-soft);
}
.synopsis {
  grid-area:synopsis;
  border-top:1px solid var(--line-soft);
  padding-top:var(--gap);
}
.synopsis-layout {
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:26px;
  align-items:start;
}
.synopsis-text {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 22px;
  align-content:start;
}
.synopsis-para {
  font-size:13.5px;
  font-weight:300;
  line-height:1.85;
  color:var(--paper-dim);
  padding-left:12px;
  border-left:1px solid var(--line);
  position:relative;
}
.synopsis-para::before {
  content:"";
  position:absolute;
  left:-1px;
  top:6px;
  width:2px;
  height:14px;
  background:var(--blue-bright);
}
.synopsis-para:nth-child(even)::before {
  background:var(--orange-soft);
}
.synopsis-media {
  margin:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--ink-2);
  align-self:start;
}
.synopsis-image {
  width:100%;
  aspect-ratio:16 / 10;
  object-fit:cover;
  filter:saturate(.78) contrast(1.08) brightness(.86);
  transition:filter .3s;
}
.synopsis-media:hover .synopsis-image {
  filter:saturate(.95) contrast(1.05) brightness(.96);
}
.synopsis-media-caption {
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--mist);
  padding:8px 12px;
  border-top:1px solid var(--line-soft);
  background:rgba(6,11,19,.7);
  display:flex;
  align-items:center;
  gap:8px;
}
.synopsis-media-caption::before {
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--orange);
  box-shadow:0 0 8px var(--orange-glow);
  flex:0 0 auto;
}
.cast {
  grid-area:cast;
  border-top:1px solid var(--line-soft);
  padding-top:var(--gap);
}
.cast-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.cast-card {
  position:relative;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--ink-2);
  align-self:start;
  transition:border-color .2s,transform .2s,box-shadow .2s;
}
.cast-card:hover {
  border-color:var(--orange-soft);
  transform:translateY(-2px);
  box-shadow:0 16px 34px -22px var(--orange-glow);
}
.cast-face {
  margin:0;
  position:relative;
  display:block;
  overflow:hidden;
}
.cast-face::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(4,7,13,.55) 0%,rgba(4,7,13,0) 46%);
  pointer-events:none;
}
.cast-face img {
  width:100%;
  aspect-ratio:4 / 5;
  object-fit:cover;
  object-position:center 22%;
  filter:saturate(.8) contrast(1.06) brightness(.88);
  transition:filter .3s,transform .4s;
}
.cast-card:hover .cast-face img {
  filter:saturate(1) contrast(1.04) brightness(.98);
  transform:scale(1.03);
}
.cast-bar {
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:9px 11px;
  background:linear-gradient(180deg,rgba(6,11,19,.42) 0%,rgba(6,11,19,.92) 62%);
  backdrop-filter:blur(3px);
  border-top:1px solid rgba(255,138,61,.22);
  display:flex;
  flex-direction:column;
  gap:2px;
}
.cast-name {
  font-size:14px;
  font-weight:700;
  color:#fff;
  letter-spacing:.04em;
  line-height:1.2;
}
.cast-role {
  font-size:11.5px;
  font-weight:300;
  color:var(--mist-2);
  letter-spacing:.02em;
  line-height:1.3;
}
.episode-status {
  grid-area:status;
  border-top:1px solid var(--line-soft);
  padding-top:var(--gap);
}
.status-panel {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}
.status-current {
  font-size:14px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--ink-0);
  background:var(--orange);
  padding:5px 14px;
  border-radius:3px;
  box-shadow:0 0 22px -6px var(--orange-glow);
}
.status-total {
  font-size:13px;
  font-weight:500;
  color:var(--paper-dim);
  border:1px solid var(--line);
  background:var(--ink-3);
  padding:5px 13px;
  border-radius:3px;
  letter-spacing:.05em;
}
.status-chip {
  font-size:12.5px;
  font-weight:600;
  color:var(--blue-bright);
  border:1px solid var(--line);
  border-left:3px solid var(--blue);
  background:rgba(63,111,168,.14);
  padding:5px 13px;
  border-radius:3px;
  letter-spacing:.05em;
}
.details {
  grid-area:details;
  border-top:1px solid var(--line-soft);
  padding-top:var(--gap);
}
.details-list {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  overflow:hidden;
}
.detail-row {
  display:flex;
  align-items:baseline;
  gap:10px;
  padding:9px 13px;
  background:var(--ink-1);
  min-width:0;
}
.detail-key {
  flex:0 0 auto;
  font-size:12px;
  font-weight:500;
  color:var(--mist);
  letter-spacing:.08em;
  padding-right:9px;
  border-right:1px solid var(--line);
}
.detail-value {
  font-size:13px;
  font-weight:400;
  color:var(--paper-dim);
  min-width:0;
  overflow-wrap:anywhere;
}
.timeline {
  padding:var(--gap) 0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.timeline-track {
  position:relative;
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:0;
  padding:30px 6px 6px;
}
.timeline-track::before {
  content:"";
  position:absolute;
  left:6%;
  right:6%;
  top:44px;
  height:1px;
  background:linear-gradient(90deg,
    rgba(111,163,216,0) 0%,
    var(--blue) 8%,
    var(--blue) 30%,
    rgba(111,163,216,.15) 31%,
    var(--orange-soft) 32%,
    var(--orange-soft) 62%,
    rgba(255,138,61,.15) 63%,
    var(--blue) 64%,
    var(--blue) 92%,
    rgba(111,163,216,0) 100%);
  box-shadow:0 0 12px rgba(63,111,168,.4);
}
.timeline-track::after {
  content:"断";
  position:absolute;
  top:33px;
  left:30.6%;
  transform:translateX(-50%);
  font-size:11px;
  font-weight:800;
  color:var(--orange);
  background:var(--ink-0);
  padding:0 4px;
  letter-spacing:0;
}
.timeline-node {
  position:relative;
  padding:34px 10px 0;
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
  border-left:1px dashed transparent;
  transition:transform .22s;
  transform-origin:top center;
  cursor:default;
}
.timeline-node::before {
  content:"";
  position:absolute;
  top:12px;
  left:10px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--ink-0);
  border:2px solid var(--blue-bright);
  box-shadow:0 0 0 3px rgba(6,11,19,.9);
  transition:background .22s,border-color .22s,box-shadow .22s,transform .22s;
}
.timeline-node:nth-child(n/**/+5)::before {
  border-color:var(--orange-soft);
}
.timeline-node:hover {
  transform:translateY(-3px);
}
.timeline-node:hover::before {
  background:var(--orange);
  border-color:#fff;
  transform:scale(1.35);
  box-shadow:0 0 0 3px rgba(6,11,19,.9),0 0 16px 3px var(--orange-glow);
}
.node-time {
  font-size:12px;
  font-weight:800;
  letter-spacing:.1em;
  color:var(--blue-bright);
  font-variant-numeric:tabular-nums;
}
.timeline-node:hover .node-time {
  color:var(--orange);
}
.node-label {
  font-size:11.5px;
  font-weight:300;
  line-height:1.55;
  color:var(--mist);
  transition:color .22s;
}
.timeline-node:hover .node-label {
  color:var(--paper);
}
.episodes {
  padding-bottom:4px;
}
.episode-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  overflow:hidden;
}
.episode-item {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-areas:
    "num title dur"
    "num sum sum";
  column-gap:12px;
  row-gap:3px;
  align-items:baseline;
  padding:9px 13px;
  background:var(--ink-1);
  border-left:3px solid var(--line);
  transition:background .18s,border-color .18s;
}
.episode-item:hover {
  background:var(--ink-2);
  border-left-color:var(--blue);
}
.episode-item:nth-child(7) {
  border-left-color:var(--orange);
  background:linear-gradient(90deg,rgba(255,138,61,.1) 0%,rgba(255,138,61,0) 62%),var(--ink-2);
}
.episode-number {
  grid-area:num;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--mist);
  white-space:nowrap;
  padding-top:2px;
}
.episode-item:nth-child(7) .episode-number {
  color:var(--orange);
}
.episode-title {
  grid-area:title;
  font-size:13.5px;
  font-weight:700;
  color:var(--paper);
  letter-spacing:.03em;
  overflow-wrap:anywhere;
}
.episode-duration {
  grid-area:dur;
  font-size:11px;
  font-weight:400;
  color:var(--mist);
  letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.episode-summary {
  grid-area:sum;
  font-size:12px;
  font-weight:300;
  line-height:1.6;
  color:var(--mist);
  overflow-wrap:anywhere;
}
.comment-columns {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:start;
}
.comment-column {
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}
.comment-card {
  position:relative;
  background:linear-gradient(180deg,var(--ink-2) 0%,var(--ink-1) 100%);
  border:1px solid var(--line);
  border-left:2px solid var(--blue);
  border-radius:var(--radius);
  padding:11px 13px;
  overflow:hidden;
}
.comment-card::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.5;
  background-image:
    radial-gradient(rgba(255,255,255,.05) .5px,transparent .5px),
    radial-gradient(rgba(255,255,255,.035) .5px,transparent .5px);
  background-size:3px 3px,5px 5px;
  background-position:0 0,1px 2px;
  mix-blend-mode:screen;
}
.comment-card:hover {
  border-left-color:var(--orange);
}
.comment-head {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:5px;
}
.comment-nick {
  font-size:12.5px;
  font-weight:700;
  color:var(--blue-bright);
  letter-spacing:.04em;
}
.comment-nick::before {
  content:"";
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:7px;
  border-radius:50%;
  background:var(--orange);
  vertical-align:middle;
}
.comment-text {
  font-size:12.5px;
  font-weight:300;
  line-height:1.72;
  color:var(--paper-dim);
  overflow-wrap:anywhere;
}
.reco-region {
  min-width:0;
}
.reco-stack {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:start;
}
a.reco-item {
  display:flex;
  flex-direction:column;
  gap:0;
  background:var(--ink-2);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  color:var(--paper-dim);
  text-decoration:none;
  align-self:start;
  transition:border-color .2s,transform .2s,box-shadow .2s;
}
a.reco-item:hover {
  border-color:var(--orange-soft);
  transform:translateY(-2px);
  box-shadow:0 18px 36px -24px var(--orange-glow);
}
[data-runtime="recommendation"] img {
  display:block;
  width:100%;
  max-width:100%;
  height:118px;
  aspect-ratio:16 / 10;
  object-fit:cover;
  object-position:center;
  filter:saturate(.8) contrast(1.06) brightness(.86);
  transition:filter .3s;
}
a.reco-item:hover img {
  filter:saturate(1) contrast(1.04) brightness(1);
}
a.reco-item [data-runtime="name"] {
  font-size:13px;
  font-weight:700;
  color:var(--paper);
  letter-spacing:.03em;
  padding:9px 11px 0;
  line-height:1.3;
  display:block;
}
a.reco-item [data-runtime="blurb"] {
  font-size:11.5px;
  font-weight:300;
  line-height:1.6;
  color:var(--mist);
  padding:4px 11px 11px;
  display:block;
}
.site-footer {
  margin-top:26px;
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,rgba(8,14,24,.9) 0%,rgba(4,7,13,1) 100%);
  padding:22px 24px 30px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  text-align:center;
}
.footer-nav {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
}
a[data-contract="footer-home"].footer-link, a[data-contract="footer-sitemap"].footer-link {
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  color:var(--paper-dim);
  text-decoration:none;
  padding:5px 15px;
  border:1px solid var(--line);
  border-radius:3px;
  background:var(--ink-2);
  transition:color .18s,border-color .18s,background .18s;
}
a[data-contract="footer-home"].footer-link {
  color:var(--orange);
  border-color:rgba(255,138,61,.4);
}
a[data-contract="footer-home"].footer-link:hover {
  color:#fff;
  background:rgba(255,138,61,.18);
}
a[data-contract="footer-sitemap"].footer-link:hover {
  color:var(--blue-bright);
  border-color:var(--blue);
  background:rgba(63,111,168,.16);
}
.friend-links {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:6px 12px;
  max-width:960px;
}
.friend-links-label {
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.14em;
  color:var(--mist);
  padding-right:12px;
  border-right:1px solid var(--line);
}
a.runtime-friend-link {
  font-size:11.5px;
  font-weight:300;
  color:var(--mist);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .16s,border-color .16s;
  white-space:nowrap;
}
a.runtime-friend-link:hover {
  color:var(--blue-bright);
  border-bottom-color:var(--blue);
}
.footer-disclaimer {
  font-size:11px;
  font-weight:300;
  line-height:1.7;
  color:#5e7288;
  max-width:720px;
}
@media (max-width:1080px){.movie-info {
    grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
  }
.synopsis-text {
    grid-template-columns:minmax(0,1fr);
  }
.cast-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
.details-list {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.timeline-track {
    grid-template-columns:repeat(4,minmax(0,1fr));
    row-gap:18px;
  }
.timeline-track::before, .timeline-track::after {
    display:none;
  }
.timeline-node::before {
    top:2px;
  }
.timeline-node {
    padding:20px 10px 0;
    border-left:1px solid var(--line-soft);
  }
.reco-stack {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }}
@media (max-width:860px){.header-inner {
    padding:11px 18px;
  }
.page-main {
    padding:20px 18px 6px;
    gap:20px;
  }
.movie-info {
    padding:18px;
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "head"
      "hero"
      "player"
      "synopsis"
      "cast"
      "status"
      "details";
    row-gap:20px;
  }
.hero-media {
    max-width:240px;
    justify-self:start;
  }
.synopsis-layout {
    grid-template-columns:minmax(0,1fr);
    gap:18px;
  }
.synopsis-media {
    max-width:560px;
  }
.cast-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
.episode-list {
    grid-template-columns:minmax(0,1fr);
  }
.comment-columns {
    grid-template-columns:minmax(0,1fr);
  }
.reco-stack {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }}
@media (max-width:560px){body {
    font-size:14px;
  }
.header-inner {
    padding:10px 14px;
    gap:10px;
  }
.category-nav {
    margin-left:0;
    width:100%;
  }
a.runtime-category {
    padding:4px 10px;
    font-size:12px;
  }
.page-main {
    padding:16px 14px 4px;
    gap:18px;
  }
.movie-info {
    padding:14px;
    row-gap:18px;
  }
.movie-title {
    font-size:24px;
  }
.hero-media {
    max-width:200px;
  }
.player-controls {
    padding:9px 10px;
    gap:6px;
  }
.ctrl-btn {
    font-size:12px;
    padding:4px 9px;
  }
.ctrl-range {
    flex:1 1 100%;
  }
.cast-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
.cast-name {
    font-size:13px;
  }
.cast-role {
    font-size:10.5px;
  }
.details-list {
    grid-template-columns:minmax(0,1fr);
  }
.timeline-track {
    grid-template-columns:repeat(2,minmax(0,1fr));
    padding:8px 4px 2px;
    row-gap:14px;
  }
.timeline-node {
    padding:18px 8px 0 0;
  }
.episode-item {
    grid-template-columns:auto minmax(0,1fr);
    grid-template-areas:
      "num title"
      "sum sum"
      "dur dur";
    row-gap:3px;
  }
.episode-duration {
    justify-self:start;
    padding-top:2px;
  }
.reco-stack {
    grid-template-columns:minmax(0,1fr);
  }
[data-runtime="recommendation"] img {
    height:150px;
  }
.footer-nav, .friend-links {
    gap:8px 10px;
  }
.friend-links-label {
    width:100%;
    border-right:0;
    padding-right:0;
    text-align:center;
  }}

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}