/* Final finishing layer. Layout and colours remain with each reference family. */
body { text-rendering: optimizeLegibility; }
.cpl-seo-context { max-width: 1400px; margin: 0 auto 36px; padding-block: 24px; border-top: 1px solid #ffffff10; }
.cpl-seo-context h2 { font-size: 20px; margin-bottom: 10px; }
.cpl-seo-context p { max-width: 85ch; color: #a5a8b3; font-size: 13px; line-height: 1.8; }
.cpl-seo-context nav { margin-top: 16px; }
button, input, select, textarea { font-family: inherit; }
img { color: var(--muted, #9ca3af); }

/* Original WebPhimHay family: retain the cinematic composition. */
body:not(.cpl-reference-skin) .hero-content h2 { text-wrap: balance; }
body:not(.cpl-reference-skin) .hero-description { max-width: 58ch; }
body:not(.cpl-reference-skin) .card-caption h3 { font-weight: 550; }
body:not(.cpl-reference-skin) .card-caption h3 a { display: block; min-height: 24px; overflow: hidden; text-overflow: ellipsis; }
body:not(.cpl-reference-skin) .card-caption h3 a:focus-visible { outline-offset: -2px; }
body:not(.cpl-reference-skin) .card-image { border: 1px solid #ffffff09; }
body:not(.cpl-reference-skin) .episode-badge { max-width: calc(100% - 12px); }
body:not(.cpl-reference-skin) .episode-badge > span { overflow: hidden; text-overflow: ellipsis; }
body:not(.cpl-reference-skin) .catalog-heading { align-items: baseline; }
body:not(.cpl-reference-skin) .catalog-heading h1 { overflow-wrap: anywhere; }
body:not(.cpl-reference-skin) .detail-tabs { scrollbar-width: none; }
body:not(.cpl-reference-skin) .detail-tabs::-webkit-scrollbar { display: none; }
body:not(.cpl-reference-skin) .movie-facts dd { min-width: 0; overflow-wrap: anywhere; }
body:not(.cpl-reference-skin) .server-list { flex-wrap: wrap; }
body:not(.cpl-reference-skin) .server-button { max-width: 100%; }

/* Shared card finish, with explicit slots for the three source labels. */
body.cpl-reference-skin .skin-card { isolation: isolate; }
body.cpl-reference-skin .skin-poster { background: #ffffff06; }
body.cpl-reference-skin .skin-poster > img { display: block; }
body.cpl-reference-skin .skin-tag { font-variant-numeric: tabular-nums; letter-spacing: 0; }
body.cpl-reference-skin .skin-language { max-width: calc(100% - 65px); }
body.cpl-reference-skin .skin-quality { max-width: 46px; }
body.cpl-reference-skin .skin-episode { max-width: calc(100% - 16px); }
body.cpl-reference-skin .skin-caption h3 { margin-top: 0; }
body.cpl-reference-skin .skin-caption h3 > a { display: block; max-width: 100%; min-height: 24px; overflow: hidden; text-overflow: ellipsis; }
body.cpl-reference-skin .skin-caption a:focus-visible { outline-offset: -2px; }
body.cpl-reference-skin .skin-origin:empty { display: none; }
body.cpl-reference-skin .skin-rank-list h3 { overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-rank-list p { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
body.cpl-reference-skin .skin-section-heading { align-items: center; }
body.cpl-reference-skin .skin-section-heading h2 { min-width: 0; }
body.cpl-reference-skin .skin-see-all { flex-shrink: 0; white-space: nowrap; }

/* Header controls and dropdowns: preserve the family-specific placement. */
body.cpl-reference-skin .skin-logo strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.cpl-reference-skin .skin-logo small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.cpl-reference-skin .skin-search { overflow: hidden; }
body.cpl-reference-skin .skin-search button { display: grid; place-items: center; flex: 0 0 32px; padding: 4px; }
body.cpl-reference-skin .skin-search input { width: 100%; outline-offset: -3px; }
body.cpl-reference-skin .skin-menu-toggle { flex-shrink: 0; }
body.cpl-reference-skin .skin-dropdown-panel { max-height: min(440px, 70svh); overflow-y: auto; overscroll-behavior: contain; border-radius: 8px; }
body.cpl-reference-skin .skin-dropdown-panel a { border-radius: 4px; }
body.cpl-reference-skin .skin-dropdown-panel a:hover { background: #ffffff09; }

/* Catalogue, detail, player and forms use the same readable control rhythm. */
body.cpl-reference-skin .skin-catalog h1 { margin-top: 0; line-height: 1.35; overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-filters { align-items: end; }
body.cpl-reference-skin .skin-filters select { width: 100%; min-width: 0; min-height: 42px; }
body.cpl-reference-skin .skin-filters button { min-height: 42px; }
body.cpl-reference-skin .skin-filter-actions { display: flex; align-items: center; gap: 16px; }
body.cpl-reference-skin .skin-detail-info { min-width: 0; }
body.cpl-reference-skin .skin-detail-title { text-wrap: balance; overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-detail-origin { overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-detail-meta span { max-width: 100%; overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-detail-facts dt { flex-shrink: 0; }
body.cpl-reference-skin .skin-detail-facts dd { min-width: 0; overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-detail-actions > * { margin-top: 0; }
body.cpl-reference-skin .skin-action-button { justify-content: center; }
body.cpl-reference-skin .skin-cast span { max-width: 100%; overflow-wrap: anywhere; }
body.cpl-reference-skin .skin-cast-more { margin-top: 10px; font-size: 12px; }
body.cpl-reference-skin .skin-cast-more summary { display: inline-block; padding: 6px 0; color: var(--skin-accent); cursor: pointer; }
body.cpl-reference-skin .skin-cast-more[open] .skin-cast { margin-top: 8px; }
body.cpl-reference-skin .skin-detail-content p + p { margin-top: 14px; }
body.cpl-reference-skin .skin-episode-search { width: min(320px, 100%); }
body.cpl-reference-skin .skin-episode-grid { padding-right: 4px; scrollbar-width: thin; scrollbar-color: #ffffff35 transparent; }
body.cpl-reference-skin .skin-episode-grid a { font-variant-numeric: tabular-nums; }
body.cpl-reference-skin .skin-player-toolbar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; }
body.cpl-reference-skin .skin-player-toolbar .text-button, body.cpl-reference-skin .skin-player-toolbar a { min-height: 34px; }
body.cpl-reference-skin .skin-footer > .skin-shell { display: grid; grid-template-columns: minmax(0, 2fr) 1fr 1fr; gap: 36px; }
body.cpl-reference-skin .skin-footer-about p { max-width: 65ch; margin-top: 14px; color: #9ca3af; line-height: 1.8; }
body.cpl-reference-skin .skin-footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
body.cpl-reference-skin .skin-footer-links h3 { margin: 0 0 6px; color: #e5e7eb; font-size: 14px; }
body.cpl-reference-skin .comments-section { max-width: 100%; }

@media (min-width: 761px) and (max-width: 1100px) {
    body:not(.cpl-reference-skin) .hero-content { width: 58%; }
    body:not(.cpl-reference-skin) .detail-action-bar { gap: 18px; flex-wrap: wrap; }
}
@media (max-width: 767px) {
    body.cpl-reference-skin .skin-dropdown-panel { border-radius: 4px; }
    body.cpl-reference-skin .skin-filters { padding: 14px; gap: 12px; }
    body.cpl-reference-skin .skin-detail-meta, body.cpl-reference-skin .skin-detail-genres { gap: 6px; }
    body.cpl-reference-skin .skin-detail .breadcrumbs { flex-wrap: wrap; line-height: 1.6; }
    body.cpl-reference-skin .skin-footer > .skin-shell { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
    body.cpl-reference-skin .skin-footer-about { grid-column: 1 / -1; }
    body.cpl-reference-skin .skin-footer-about p { font-size: 12px; }
    body.cpl-reference-skin .skin-player-toolbar { font-size: 12px; }
    body.cpl-reference-skin .skin-player-toolbar > div { gap: 8px 16px; }
    body.cpl-reference-skin .skin-watch-heading h1 { line-height: 1.4; }
}
@media (max-width: 480px) {
    body:not(.cpl-reference-skin) .hero-content h2 { font-size: clamp(25px, 7vw, 29px); }
    body:not(.cpl-reference-skin) .hero-description { font-size: 12px; line-height: 1.7; }
    body:not(.cpl-reference-skin) .home-intro h1 { font-size: 21px; line-height: 1.4; }
    body:not(.cpl-reference-skin) .card-caption h3 { font-size: 12px; }
    body:not(.cpl-reference-skin) .card-caption p { font-size: 11px; }
    body:not(.cpl-reference-skin) .detail-tabs { gap: 24px; }
    body:not(.cpl-reference-skin) .detail-tabs button { min-height: 44px; }
    body:not(.cpl-reference-skin) .movie-information > .metadata,
    body:not(.cpl-reference-skin) .movie-information > .genre-tags { font-size: 10px; }
    body:not(.cpl-reference-skin) .detail-action-bar { gap: 12px; }
    body:not(.cpl-reference-skin) .episode-button { min-height: 44px; font-size: 12px; }
    body.cpl-reference-skin .skin-menu-toggle { min-width: 36px; min-height: 40px; }
    body.cpl-reference-skin .skin-search button { flex-basis: 26px; }
    body.cpl-reference-skin .skin-search input { padding-right: 0; }
    body.cpl-reference-skin .skin-filters label { flex: 1 1 calc(50% - 6px); min-width: 0; }
    body.cpl-reference-skin .skin-filter-actions { width: 100%; }
    body.cpl-reference-skin .skin-filters button { flex: 1; }
    body.cpl-reference-skin .skin-episode-grid a { min-height: 42px; }
    body.cpl-reference-skin .skin-cast { gap: 5px; }
    body.cpl-reference-skin .skin-cast span { font-size: 11px; padding: 3px 6px; }
    body.cpl-reference-skin .skin-episodes .collapse-episodes { font-size: 11px; }
    body.cpl-reference-skin .skin-episodes .skin-section-heading { gap: 8px; flex-wrap: wrap; }
}
@media (max-width: 639px) {
    body.cpl-skin-motchill .skin-detail-hero > .skin-detail-poster { grid-row: auto; }
    body.cpl-skin-motchill .skin-detail-info > .skin-title-group { grid-column: 2; align-self: start; }
    body.cpl-skin-motchill .skin-title-group .skin-detail-origin { margin: 10px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
    body.cpl-reference-skin .skin-poster > img { transition: none; }
}

.cpl-source-note{margin:12px 0;font-size:12px;line-height:1.8;color:#a5adbc}.cpl-source-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}

/* Keep small labels readable and preserve each family's existing control layout. */
body.cpl-reference-skin .skin-logo small { opacity: 1; }
body.cpl-skin-motchill .skin-section-tabs .is-current,
body.cpl-skin-motchill .skin-detail .button-primary,
body.cpl-skin-motchill .skin-detail .episode-button.is-active,
body.cpl-skin-phimmoic .phimmoic-chips a.is-current,
body.cpl-skin-phimmoi .phimmoi-featured-label,
body.cpl-skin-phimmoi .phimmoi-mini .phimmoi-quality,
body.cpl-skin-phimmoi .skin-episodes .server-button.is-active,
body.cpl-skin-phimmoi .skin-episodes .episode-button.is-active,
body.cpl-skin-phimmoi .skin-episodes .episode-button:hover,
body.cpl-skin-phimmoi .phimmoi-topics a.is-active { color: #171717; }
body.cpl-skin-phimmoi .skin-detail-facts dt { color: #9ca3af; }
body.cpl-skin-phimmoi .phimmoi-watch,
body.cpl-skin-phimmoi .phimmoi-more,
body.cpl-skin-phimmoi .skin-filter-actions .button-primary,
body.cpl-skin-phimmoi .comments-section .button-primary { background: #9b5b28; color: #fff; }
body.cpl-skin-phimmoi .phimmoi-watch:hover,
body.cpl-skin-phimmoi .phimmoi-more:hover { background: #8a5520; color: #fff; }
body.cpl-skin-phimmoi .skin-detail-actions .skin-watch-button { background: linear-gradient(90deg, #9b5b28, #8a5520); }
body.cpl-skin-phimmoi .skin-episode { background: #8a5520; }
body.cpl-skin-phimmoi .phimmoi-recent .skin-episode { background: #166534; }

/* Inputs that share a visual container still need a clear keyboard focus cue. */
.header-search:focus-within, .episode-search:focus-within { outline: 2px solid var(--gold); outline-offset: 2px; }
.comment-form input:focus-visible, .comment-form textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Reading layouts use the active family colours without changing film layouts. */
.cpl-home-reading{max-width:1450px;margin:28px auto 52px}.cpl-home-reading-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.cpl-home-reading-heading h2{font-size:24px}.cpl-home-reading-heading>a{font-size:13px;color:var(--skin-accent,var(--accent,#f0c76b))}.cpl-portfolio-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px;margin-top:24px}.cpl-portfolio-guide-grid article{padding:24px;border:1px solid #ffffff16;border-radius:12px;background:#ffffff04}.cpl-portfolio-guide-grid h2,.cpl-portfolio-guide-grid h3{font-size:21px;line-height:1.5;text-wrap:balance}.cpl-portfolio-guide-grid p{margin-top:12px;font-size:14px;line-height:1.8;color:#aab2c1}.cpl-portfolio-guide article{max-width:900px;margin-inline:auto}.cpl-portfolio-guide h1{max-width:30ch;font-size:clamp(27px,3.5vw,42px);line-height:1.3;text-wrap:balance}.cpl-portfolio-guide .prose{font-size:15px;line-height:1.95;color:#d1d7e2}.cpl-portfolio-guide .prose h2{margin:32px 0 14px;font-size:24px;line-height:1.4}.cpl-portfolio-guide .prose p{margin-bottom:18px}.cpl-portfolio-guide .prose a{color:var(--skin-accent,var(--accent,#f0c76b));text-decoration:underline;text-underline-offset:3px}.cpl-guide-sources{margin-top:32px;padding:20px;border:1px solid #ffffff16;border-radius:10px;background:#ffffff03;font-size:13px}.cpl-guide-sources h2{margin-top:0!important;font-size:20px!important}.cpl-guide-sources ul{padding-left:20px}.cpl-guide-sources details{margin-top:16px}@media(max-width:640px){.cpl-portfolio-guide-grid article{padding:18px}.cpl-portfolio-guide .prose{font-size:14px}.cpl-portfolio-guide .prose h2{font-size:21px}.cpl-home-reading{margin-bottom:32px}}
/* Defer layout/paint for offscreen film groups; keep all links in server HTML.
   Auto containment wakes for scrolling, find-in-page, selection and focus. */
@supports (content-visibility:auto){
  .page-home .home-content .movie-section{content-visibility:auto;contain-intrinsic-block-size:auto 330px}
  .page-home .phimmoi-home>.phimmoi-recent{content-visibility:auto;contain-intrinsic-block-size:auto 330px}
}
@media print{
  .page-home .home-content .movie-section,
  .page-home .phimmoi-home>.phimmoi-recent{content-visibility:visible;contain-intrinsic-block-size:none}
}