*, *::before, *::after {box-sizing:border-box;margin:0;padding:0}
html {scroll-behavior:smooth}
body {background:#0d0f1a;color:#e6d9d0;font-family:Georgia,"Times New Roman",serif;line-height:1.5;min-height:100vh;background:linear-gradient(145deg,#0d0f1a 0%,#1a1020 45%,#2a1228 100%)}
img, video {display:block;max-width:100%;height:auto}
ul {list-style:none}
button {font:inherit;cursor:pointer;background:none;border:none;color:inherit}
a {color:inherit}
video {object-fit:cover;background:#000}
header {position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:2rem;padding:0.8rem 1.2rem;background:rgba(13,15,26,0.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,200,150,0.15);flex-wrap:wrap}
.site-name-link {font-size:1.5rem;font-weight:700;letter-spacing:0.12em;color:#f2d5b5;text-decoration:none;text-transform:uppercase;border-right:1px solid rgba(255,180,140,0.3);padding-right:1.5rem;white-space:nowrap}
.site-name-link:hover {color:#ffd9a0;text-decoration:underline}
.categories-nav {display:flex;flex-wrap:wrap;gap:0.35rem 0.8rem;flex:1;min-width:0;align-items:center}
.runtime-category {display:inline-block;color:#c9a88e;font-size:0.9rem;letter-spacing:0.05em;text-decoration:none;white-space:nowrap;padding:0.2rem 0.5rem;border-radius:2rem;border:1px solid transparent;transition:background 0.2s,border-color 0.2s,color 0.2s}
.runtime-category:hover {color:#ffe2c0;border-color:#ff9e7a;background:rgba(255,150,120,0.1)}
main {max-width:1280px;margin:0 auto;padding:1.5rem 1.2rem;display:flex;flex-direction:column;gap:2.5rem}
.movie-overview-shell {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,2fr);grid-template-areas:"poster title" "poster cast" "poster synopsis" "poster status" "poster details" "player player";gap:1rem 2rem;background:linear-gradient(160deg,rgba(30,20,35,0.9),rgba(15,18,30,0.95));border-radius:2rem;padding:1.5rem;border:1px solid rgba(255,180,150,0.12);box-shadow:0 10px 30px rgba(0,0,0,0.5)}
.poster-media-wrapper {grid-area:poster;align-self:start;justify-self:center;width:100%;max-width:300px;border-radius:1.5rem;overflow:hidden;box-shadow:0 0 25px rgba(255,140,120,0.25),0 0 60px rgba(200,100,180,0.15);border:1px solid rgba(255,190,150,0.2)}
.main-poster-image {width:100%;aspect-ratio:2/3;object-fit:cover}
.title-tagline-group {grid-area:title;align-self:end;padding-bottom:0.5rem}
.movie-title {font-size:2rem;font-weight:700;color:#f7e2d0;letter-spacing:0.08em;line-height:1.3;text-shadow:0 0 20px rgba(255,180,150,0.3)}
.movie-tagline {font-size:1rem;color:#d4a98c;font-style:italic;margin-top:0.4rem;letter-spacing:0.04em}
.cast-fragment, .synopsis-fragment, .episode-status-fragment, .details-fragment {grid-column:2;align-self:start;padding-left:1rem;border-left:2px solid rgba(255,150,130,0.25)}
.cast-fragment {grid-area:cast;margin-top:0.5rem}
.synopsis-fragment {grid-area:synopsis}
.episode-status-fragment {grid-area:status}
.details-fragment {grid-area:details}
.fragment-heading {font-size:1.1rem;font-weight:600;color:#ffc9a0;letter-spacing:0.1em;margin-bottom:0.6rem;display:flex;align-items:center;gap:0.6rem}
.fragment-heading::after {content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(255,180,140,0.4),transparent)}
.cast-list {display:flex;flex-wrap:wrap;gap:0.5rem}
.actor-item {background:rgba(255,190,160,0.08);border:1px solid rgba(255,180,150,0.2);border-radius:2rem;padding:0.3rem 1rem;font-size:0.95rem;color:#ecd9c8}
.synopsis-paragraph {color:#cbb9ae;font-size:0.95rem;line-height:1.7;margin-bottom:0.7rem}
.status-line {display:flex;align-items:baseline;gap:0.4rem;color:#d4c0b2;font-size:1rem;flex-wrap:wrap}
.total-episodes-label, .current-episode-label {color:#b28a70;font-size:0.85rem;letter-spacing:0.08em}
.episode-progress-meta {margin-top:0.5rem;background:rgba(255,160,130,0.1);border-radius:1rem;padding:0.4rem 1rem;display:inline-block}
.episode-progress-text {color:#ffc9a0;font-size:0.9rem;letter-spacing:0.05em}
.detail-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.4rem 1.5rem}
.detail-item {display:flex;gap:0.6rem;font-size:0.9rem;color:#cbb9ae;align-items:baseline}
.detail-item dt {color:#b28a70;min-width:3.5em;font-weight:600;letter-spacing:0.05em}
.detail-item dd {color:#e0cbbd}
.player-wrapper-wide {grid-area:player;width:100%;max-width:none;background:#000;border-radius:1.5rem;overflow:hidden;border:1px solid rgba(255,180,140,0.2);margin-top:0.5rem}
.player-wrapper-wide video {display:block;width:100%;aspect-ratio:16/9;background:#000}
.player-control-bar {display:flex;flex-wrap:wrap;gap:0.3rem;padding:0.5rem 0.8rem;background:rgba(10,10,20,0.85);border-top:1px solid rgba(255,180,150,0.15)}
.control-button {font-size:0.8rem;padding:0.3rem 0.7rem;border-radius:2rem;background:rgba(255,180,150,0.1);color:#d4c0b2;border:1px solid transparent;transition:all 0.2s}
.control-button:hover {background:rgba(255,180,150,0.25);color:#ffe2c0;border-color:#ff9e7a}
.timeline-fragment {margin-top:0.5rem}
.timeline-horizontal-scroll {display:flex;gap:1rem;overflow-x:auto;padding:0.8rem 0.2rem 1rem;scrollbar-width:thin;scrollbar-color:#ff9e7a rgba(255,180,150,0.1)}
.timeline-horizontal-scroll::-webkit-scrollbar {height:6px}
.timeline-horizontal-scroll::-webkit-scrollbar-thumb {background:#ff9e7a;border-radius:3rem}
.timeline-item {flex:0 0 auto;min-width:120px;background:rgba(25,18,30,0.8);border:1px solid rgba(255,180,150,0.2);border-radius:1.2rem;padding:0.8rem 1.2rem;text-align:center;transition:background 0.2s,border-color 0.2s;position:relative}
.timeline-item::after {content:"→";position:absolute;right:-0.9rem;top:50%;transform:translateY(-50%);color:#ff9e7a;font-size:1rem;pointer-events:none;opacity:0.6}
.timeline-item:last-child::after {display:none}
.timeline-item:hover {background:rgba(50,25,35,0.9);border-color:#ff9e7a}
.timecode {display:block;font-size:0.8rem;color:#b28a70;letter-spacing:0.1em;margin-bottom:0.3rem}
.event-label {font-size:0.95rem;color:#f0dcc8;font-weight:600;letter-spacing:0.05em}
.episodes-fragment {display:grid;gap:1rem}
.episode-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0.8rem}
.episode-card {background:linear-gradient(150deg,rgba(25,18,30,0.9),rgba(15,15,25,0.9));border:1px solid rgba(255,170,140,0.15);border-radius:1.2rem;padding:1rem;display:flex;flex-direction:column;gap:0.4rem;transition:transform 0.2s,border-color 0.2s,box-shadow 0.2s}
.episode-card:hover {transform:translateY(-3px);border-color:#ff9e7a;box-shadow:0 8px 20px rgba(0,0,0,0.4)}
.episode-number {font-size:0.8rem;color:#b28a70;letter-spacing:0.1em}
.episode-title {font-size:1.1rem;color:#ffe2c0;font-weight:700;letter-spacing:0.05em}
.episode-summary {font-size:0.9rem;color:#cbb9ae;line-height:1.5;flex:1}
.episode-duration {font-size:0.8rem;color:#a88a72;align-self:flex-end;background:rgba(255,180,150,0.1);padding:0.15rem 0.6rem;border-radius:1rem}
.comments-fragment {display:grid;gap:1rem}
.comment-list {display:flex;flex-direction:column;gap:0.6rem;max-width:800px}
.comment-item {background:rgba(20,18,28,0.7);border-left:3px solid #ff9e7a;border-radius:0 1rem 1rem 0;padding:0.8rem 1.2rem}
.comment-nickname {display:block;font-size:0.85rem;color:#ffc9a0;font-weight:600;margin-bottom:0.3rem;letter-spacing:0.05em}
.comment-text {font-size:0.95rem;color:#d4c0b2;line-height:1.6}
.recommendation-region {display:grid;gap:1rem}
.recommendation-title {font-size:1.3rem;color:#f7e2d0;letter-spacing:0.1em;font-weight:700;display:flex;align-items:center;gap:0.8rem}
.recommendation-title::before {content:"";width:40px;height:2px;background:linear-gradient(90deg,#ff9e7a,transparent)}
.recommendation-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.recommendation-grid a[data-runtime="recommendation"] {display:flex;flex-direction:column;background:rgba(20,18,28,0.8);border:1px solid rgba(255,170,140,0.15);border-radius:1.2rem;padding:0.8rem;text-decoration:none;color:#e6d9d0;transition:transform 0.2s,border-color 0.2s,box-shadow 0.2s;gap:0.4rem}
.recommendation-grid a[data-runtime="recommendation"]:hover {transform:translateY(-3px);border-color:#ff9e7a;box-shadow:0 10px 20px rgba(0,0,0,0.4)}
.recommendation-grid a[data-runtime="recommendation"] img {width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0.8rem;background:#000}
.recommendation-grid a[data-runtime="recommendation"] span[data-runtime="name"] {font-weight:700;color:#ffe2c0;font-size:1rem;letter-spacing:0.04em}
.recommendation-grid a[data-runtime="recommendation"] span[data-runtime="blurb"] {font-size:0.85rem;color:#b8a59a;line-height:1.5}
footer {max-width:1280px;margin:0 auto;padding:1.5rem 1.2rem 2rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;border-top:1px solid rgba(255,180,150,0.15)}
.disclaimer-text {width:100%;font-size:0.8rem;color:#8a7a6e;line-height:1.6;text-align:center;margin-bottom:0.5rem}
.footer-link {font-size:0.9rem;color:#c9a88e;text-decoration:none;padding:0.3rem 0.8rem;border-radius:2rem;border:1px solid transparent;transition:all 0.2s}
.footer-link:hover {color:#ffe2c0;border-color:#ff9e7a;background:rgba(255,150,120,0.1)}
.friend-links-nav {display:flex;flex-wrap:wrap;align-items:center;gap:0.6rem 1rem;width:100%;margin-top:0.5rem}
.friend-links-label {font-size:0.85rem;color:#b28a70;font-weight:600;letter-spacing:0.1em}
.runtime-friend-link {font-size:0.85rem;color:#a88a72;text-decoration:none;transition:color 0.2s}
.runtime-friend-link:hover {color:#ffc9a0;text-decoration:underline}
.player.theater-mode {max-width:100%}
.player.lights-dim {filter:brightness(0.6)}
.player.fullscreen {width:100%;height:100%}
.player.play video {outline:2px solid #ff9e7a}
.player.mute video {opacity:0.9}
.player.pip video {border-radius:1rem}
.player.progress video, .player.speed video {outline:1px dashed #ff9e7a}
.player.volume video {filter:saturate(1.2)}
.player.click video {filter:brightness(1.1)}
.light .player-wrapper-wide {box-shadow:0 0 40px rgba(255,180,140,0.4)}
@media (max-width:1024px){.movie-overview-shell {grid-template-columns:1fr;grid-template-areas:"poster" "title" "cast" "synopsis" "status" "details" "player";gap:1.5rem}
.poster-media-wrapper {max-width:260px;justify-self:center}
.cast-fragment, .synopsis-fragment, .episode-status-fragment, .details-fragment {grid-column:1;padding-left:0;border-left:none}
.episode-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
.recommendation-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
.detail-list {grid-template-columns:1fr}}
@media (max-width:768px){header {flex-direction:column;align-items:flex-start;gap:0.6rem;padding:0.6rem 0.8rem}
.site-name-link {border-right:none;border-bottom:1px solid rgba(255,200,150,0.2);padding-right:0;padding-bottom:0.3rem;width:100%}
.categories-nav {width:100%;gap:0.2rem 0.6rem}
.runtime-category {font-size:0.8rem;padding:0.15rem 0.4rem}
main {padding:1rem 0.8rem;gap:2rem}
.movie-overview-shell {padding:1rem;border-radius:1.2rem}
.movie-title {font-size:1.5rem}
.episode-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
.recommendation-grid {grid-template-columns:1fr}
.timeline-item {min-width:100px}
.player-control-bar {flex-direction:row;flex-wrap:wrap;gap:0.3rem}
.control-button {font-size:0.7rem;padding:0.2rem 0.5rem}
footer {flex-direction:column;align-items:flex-start;gap:0.8rem}
.friend-links-nav {flex-direction:column;align-items:flex-start}}
@media (max-width:480px){.episode-grid {grid-template-columns:1fr}
.detail-list {grid-template-columns:1fr}
.cast-list {flex-direction:column;gap:0.3rem}
.actor-item {align-self:flex-start}
.movie-tagline {font-size:0.9rem}
.player-wrapper-wide {border-radius:1rem;max-width:100%}
.timeline-horizontal-scroll {gap:0.6rem}
.timeline-item {min-width:80px;padding:0.6rem 0.8rem}}

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}
