body.rf-body {
  margin: 0;
  background: #16161f;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
.rf-wrap {max-width: 1180px; margin: 0 auto; padding: 0 16px;}
.rf-header {position: sticky; top: 0; z-index: 50; background: #2a2a38; box-shadow: 0 8px 24px rgba(0,0,0,.25);}
.rf-header-top {display: flex; align-items: center; justify-content: space-between; min-height: 52px;}
.rf-brand {display: flex; align-items: center; gap: 10px;}
.rf-crown {width: 28px; height: 28px; border-radius: 8px; background: linear-gradient(135deg,#10b981,#059669); display: flex; align-items: center; justify-content: center;}
.rf-crown svg {width: 18px; height: 18px; display: block;}
.rf-hd-badge {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: linear-gradient(135deg,#10b981,#059669);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(5,150,105,.3);
}
.rf-logo-main {font-size: 24px; font-weight: 700; line-height: 1; text-transform: uppercase; letter-spacing: .4px;}
.rf-logo-main span {color: #10b981;}
.rf-logo-footer {font-size: 20px; font-weight: 700; line-height: 1; text-transform: uppercase; letter-spacing: .4px;}
.rf-logo-footer span {color: #10b981;}
.rf-slogan {font-size: 12px; color: #9ca3af; font-style: italic;}
.rf-main-nav {display: flex; gap: 24px; font-size: 14px;}
.rf-main-nav a, .rf-sub-nav a, .rf-footer a {color: #fff; text-decoration: none; opacity: .95;}
.rf-main-nav a:hover, .rf-sub-nav a:hover, .rf-footer a:hover {color: #10b981;}
.rf-user-nav {display: flex; align-items: center; gap: 12px;}
.rf-search-form {display: flex; align-items: center; gap: 8px;}
.rf-search-input {
  width: 190px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #4b5563;
  background: #1f1f2a;
  color: #fff;
  padding: 0 10px;
  font-size: 13px;
}
.rf-search-btn, .rf-auth-btn {
  height: 34px;
  border-radius: 8px;
  border: 1px solid #4b5563;
  background: #1f1f2a;
  color: #fff;
  padding: 0 10px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.rf-search-btn:hover, .rf-auth-btn:hover {
  border-color: #10b981;
  color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.35), 0 0 14px rgba(16,185,129,.22);
}
.rf-auth-btn svg, .rf-search-btn svg {width: 16px; height: 16px; display: block;}
.rf-header-sub {background: #1f1f2a; border-top: 1px solid #374151;}
.rf-sub-nav {display: flex; gap: 22px; overflow-x: auto; white-space: nowrap; padding: 9px 0; font-size: 12px; color: #d1d5db;}
.rf-main {padding-top: 24px; padding-bottom: 24px; display: flex; flex-direction: column; gap: 24px;}
.rf-box {background: #1f1f2a; border-radius: 10px; padding: 16px;}
.rf-box-title {margin: 0 0 12px; color: #10b981; font-size: 16px; font-weight: 500;}
.rf-scroll {overflow-x: auto;}
.rf-row {display: flex; gap: 16px; padding-bottom: 8px;}
.rf-grid {display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 16px;}
.rf-mini-card {display: block; width: 112px; text-decoration: none; color: #fff;}
.rf-mini-card img {width: 112px; height: 144px; border-radius: 8px; object-fit: cover; margin-bottom: 8px;}
.rf-mini-card h4 {margin: 0 0 4px; font-size: 14px; font-weight: 500; line-height: 1.3;}
.rf-mini-card div {font-size: 12px; color: #9ca3af;}
.rf-grid-card {
  display: block;
  text-decoration: none;
  color: #fff;
  border-radius: 12px;
  background: #242433;
  border: 1px solid #31364d;
  padding: 10px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.rf-grid-poster {display: block; position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 10px;}
.rf-grid-poster::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48%;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(8,10,17,.55) 100%);
  pointer-events: none;
}
.rf-grid-card img {display: block; width: 100%; height: 230px; object-fit: cover; border-radius: 10px;}
.rf-grid-card h4 {
  margin: 0 0 6px;
  font-size: 14px;
  line-height: 1.35;
  font-weight: 600;
  color: #eef2ff;
  min-height: 38px;
}
.rf-grid-card div {font-size: 12px; color: #9ca3af;}
.rf-grid-card:hover {border-color: #10b981; box-shadow: 0 0 0 1px rgba(16,185,129,.2), 0 12px 24px rgba(0,0,0,.22);}
.rf-pagination {
  margin-top: 18px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid #2d334f;
  background: #1a1c2a;
}
.rf-pagination .navigation {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.rf-pagination .navigation a,
.rf-pagination .navigation span {
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid #343a57;
  background: #25283a;
  color: #d5dcff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 600;
}
.rf-pagination .navigation a:hover {
  border-color: #10b981;
  color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.3), 0 0 14px rgba(16,185,129,.2);
}
.rf-pagination .navigation span:not([class]) {
  background: #1f2b38;
  border-color: #10b981;
  color: #10b981;
}
.rf-breadcrumbs {font-size: 13px; color: #9ca3af; margin-bottom: 10px;}
.rf-breadcrumbs a {color: #10b981; text-decoration: none;}
.rf-h1 {margin: 0 0 16px; font-size: 30px; line-height: 1.2; font-weight: 700;}
.rf-full-top {display: grid; grid-template-columns: 250px 1fr; gap: 24px; align-items: start;}
.rf-poster {
  width: 250px;
  height: 375px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  padding: 10px;
  box-sizing: border-box;
  border: 2px solid #1a9f7a;
  background: #111726;
  box-shadow: 0 0 0 1px rgba(26,159,122,.08);
  transition: box-shadow .25s ease, border-color .25s ease;
}
.rf-poster-col:hover .rf-poster {
  border-color: #26b08a;
  box-shadow: 0 0 0 1px rgba(38,176,138,.24), 0 0 14px rgba(26,159,122,.2);
}
.rf-like-dislike {display: flex; gap: 10px; margin-top: 12px; align-items: stretch;}
.rf-like-dislike > * {flex: 1 1 0; min-width: 0;}
.rf-like-dislike a {display: block; text-decoration: none;}
.rf-like-btn, .rf-dislike-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 40px;
  box-sizing: border-box;
  border-radius: 10px;
  border: 1px solid #2d334f;
  padding: 9px 10px;
  font-size: 14px;
  font-weight: 600;
  transition: all .2s ease;
  cursor: pointer;
}
.rf-like-btn {color: #34d399; background: #1f2f2a;}
.rf-dislike-btn {color: #fb7185; background: #31232a;}
.rf-like-btn:hover {
  border-color: #34d399;
  box-shadow: 0 0 0 1px rgba(52,211,153,.3), 0 0 14px rgba(52,211,153,.25);
}
.rf-dislike-btn:hover {
  border-color: #fb7185;
  box-shadow: 0 0 0 1px rgba(251,113,133,.28), 0 0 14px rgba(251,113,133,.22);
}
.rf-like-btn svg, .rf-dislike-btn svg {width: 16px; height: 16px;}
.rf-like-btn span, .rf-dislike-btn span {line-height: 1;}
.rf-info-col {display: flex; flex-direction: column; gap: 12px;}
.rf-meta-box {
  background: #1f1f2a;
  border-radius: 10px;
  padding: 16px;
  padding-top: 56px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 22px;
  position: relative;
}
.rf-meta-box div {font-size: 16px;}
.rf-meta-box span {display: block; color: #9ca3af; font-size: 14px; margin-bottom: 4px;}
.rf-meta-box b {font-weight: 500;}
.rf-meta-box .wide {grid-column: 1/-1;}
.rf-ratings {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  position: absolute;
  right: 14px;
  top: 12px;
  justify-content: flex-end;
}
.rf-ratings > div {
  border-radius: 10px;
  padding: 7px 11px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid #1a9f7a;
  background: #111726;
  color: #d9e3ff;
  box-shadow: 0 0 0 1px rgba(26,159,122,.08);
  transition: box-shadow .25s ease, border-color .25s ease;
}
.rf-ratings > div:hover {
  border-color: #26b08a;
  box-shadow: 0 0 0 1px rgba(38,176,138,.24), 0 0 14px rgba(26,159,122,.2);
}
.rf-kp, .rf-imdb {background: #111726; color: #d9e3ff;}
.rf-box h2 {margin: 0 0 16px; font-size: 21px; line-height: 1.2; font-weight: 600;}
.rf-section-h3 {margin: 0 0 16px; font-size: 21px; line-height: 1.2; font-weight: 600;}
.rf-desc {font-size: 16px; line-height: 1.75; color: #d1d5db; max-height: 130px; overflow: hidden;}
.rf-desc.rf-open {max-height: none;}
.rf-readmore {margin-top: 12px; background: transparent; border: 0; color: #10b981; font-size: 14px; cursor: pointer;}
.rf-title-2 {
  margin: 0 0 14px;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 600;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.rf-player-wrap {margin-bottom: 24px;}
.rf-player-section {
  background: #1f1f2a;
  border: 1px solid #2d334f;
  border-radius: 12px;
}
.rf-player-section .rf-player-wrap {margin-bottom: 0;}
.rf-tabs {display: flex; flex-direction: column; gap: 10px;}
.rf-tabs-head {display: flex; gap: 10px; flex-wrap: wrap;}
.rf-tabs-btn {
  background: #2a2a38;
  border: 1px solid #3a4265;
  color: #dbe1ff;
  border-radius: 10px;
  padding: 9px 14px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s ease;
}
.rf-tabs-btn:hover {
  border-color: #10b981;
  color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.35), 0 0 14px rgba(16,185,129,.22);
}
.rf-tabs-btn.is-active {background: #20253a; border-color: #10b981; color: #10b981;}
.rf-tab-pane {display: none;}
.rf-tab-pane.is-active {display: block;}
.rf-player-box {background: transparent; border: 0; border-radius: 0; padding: 0;}
.rf-player {width: 100%; aspect-ratio: 16 / 9; height: auto; background: #000; border-radius: 8px;}
.rf-react-title {margin: 0 0 10px; text-align: center; font-size: 13px; font-weight: 600; color: #c7cee8;}
.rf-react-row {display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; overflow: visible; padding-bottom: 8px;}
.rf-react-inline {margin-top: 2px; padding: 10px; border-radius: 10px; border: 1px solid #2d334f; background: #161a28; min-height: 64px;}
.rf-react-inline .rf-react-row {padding-bottom: 0;}
.rf-react-btn {min-width: 96px; background: #2a2a38; border: 1px solid #343a57; border-radius: 10px; color: #fff; padding: 8px 10px; display: flex; flex-direction: column; align-items: center; gap: 4px;}
.rf-react-btn:hover {
  border-color: #6a78af;
  background: #30364f;
  box-shadow: 0 0 0 1px rgba(106,120,175,.35), 0 0 14px rgba(106,120,175,.22);
}
.rf-react-btn.is-active {border-color: #10b981; background: #23313a;}
.rf-react-btn span {font-size: 20px; line-height: 1;}
.rf-react-btn b {font-size: 12px; font-weight: 500; white-space: nowrap;}
.rf-react-btn i {font-size: 11px; color: #9ca3af; font-style: normal;}
.rf-watch-card {display: block; width: 128px; text-decoration: none; color: #fff;}
.rf-watch-card img {width: 128px; height: 176px; border-radius: 8px; object-fit: cover; margin-bottom: 8px;}
.rf-watch-card h4 {margin: 0 0 4px; font-size: 12px; line-height: 1.3;}
.rf-watch-card div {font-size: 12px; color: #9ca3af;}
.rf-watch-scroll {overflow: visible;}
.rf-watch-row {justify-content: center; flex-wrap: wrap;}
.rf-comments {display: flex; flex-direction: column; gap: 14px; margin-top: 18px;}
.rf-review-form, .rf-comment {
  background: #1f1f2a;
  border-radius: 10px;
  padding: 24px;
  border: 1px solid #2d334f;
}
.rf-review-form h3 {margin: 0 0 14px; font-size: 20px; font-weight: 600;}
.rf-review-form label {display: block; font-size: 14px; color: #d1d5db; margin: 0 0 8px;}
.rf-review-form input, .rf-review-form textarea, .rf-review-form .bb-editor textarea {width: 100%; box-sizing: border-box; background: #2a2a38; color: #fff; border: 1px solid #4b5563; border-radius: 8px; padding: 10px 12px;}
.rf-review-form .bb-editor textarea {min-height: 180px;}
.rf-review-form button[type="submit"] {margin-top: 14px; background: #10b981; border: 0; color: #07150f; border-radius: 8px; padding: 11px 18px; cursor: pointer; font-weight: 600;}
.rf-review-form button[type="submit"]:hover {
  filter: brightness(1.06);
  box-shadow: 0 0 0 1px rgba(16,185,129,.35), 0 0 14px rgba(16,185,129,.22);
}
.rf-readmore {transition: color .2s ease, text-shadow .2s ease;}
.rf-readmore:hover {color: #34d399; text-shadow: 0 0 10px rgba(52,211,153,.45);}
.rf-social span {transition: box-shadow .2s ease, background .2s ease;}
.rf-social span:hover {background: #455163; box-shadow: 0 0 0 1px rgba(148,163,184,.35), 0 0 14px rgba(148,163,184,.25);}
.rf-comment-head {display: flex; justify-content: space-between; align-items: start; margin-bottom: 10px;}
.rf-comment-name {font-size: 16px; margin-bottom: 4px; font-weight: 500;}
.rf-comment-date {font-size: 14px; color: #9ca3af;}
.rf-comment p {margin: 0; color: #d1d5db; font-size: 15px; line-height: 1.65;}
.rf-footer {background: #1f1f2a; border-top: 1px solid #374151; margin-top: 48px;}
.rf-footer-top {display: flex; justify-content: flex-start; padding: 26px 0 20px;}
.rf-footer-brand {display: flex; align-items: flex-start; gap: 12px; max-width: 100%;}
.rf-footer-brand > div:last-child {display: flex; flex-direction: column; gap: 4px;}
.rf-footer-brand .rf-hd-badge {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  font-size: 14px;
}
.rf-footer-brand .rf-logo-footer {font-size: 28px; line-height: 1;}
.rf-footer-brand p {
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
  color: #9ca3af;
}
.rf-footer-top h4 {margin: 0 0 12px; font-size: 24px; font-weight: 600;}
.rf-footer-top p {margin: 0 0 8px; color: #9ca3af; font-size: 14px; line-height: 1.5;}
.rf-footer-top a {display: block; margin-bottom: 8px; color: #9ca3af; font-size: 14px;}
.rf-social {display: flex; gap: 8px; margin: 0 0 10px;}
.rf-social span {width: 40px; height: 40px; border-radius: 999px; background: #374151; display: flex; align-items: center; justify-content: center;}
.rf-copy {text-align: center; color: #6b7280; font-size: 13px; padding: 16px 0 24px;}
.rf-copy p {margin: 0 0 8px;}
@media (max-width: 1024px) {
  .rf-grid {grid-template-columns: repeat(4,minmax(0,1fr));}
  .rf-search-input {width: 150px;}
}
@media (max-width: 768px) {
  .rf-logo-main {font-size: 22px;}
  .rf-logo-footer {font-size: 20px;}
  .rf-search-form {display: none;}
  .rf-grid {grid-template-columns: repeat(2,minmax(0,1fr));}
  .rf-grid-card {padding: 8px;}
  .rf-grid-card img {height: 200px;}
  .rf-grid-card h4 {font-size: 13px; min-height: 34px;}
  .rf-pagination {padding: 10px;}
  .rf-pagination .navigation {gap: 6px;}
  .rf-pagination .navigation a,
  .rf-pagination .navigation span {
    min-width: 34px;
    height: 34px;
    font-size: 13px;
    padding: 0 10px;
  }
  .rf-full-top {grid-template-columns: 1fr;}
  .rf-meta-box {padding-top: 16px;}
  .rf-ratings {
    position: static;
    margin-top: 2px;
    justify-content: flex-start;
  }
  .rf-poster {width: 220px; height: 330px; margin: 0 auto; padding: 8px; border-width: 2px; border-radius: 14px;}
  .rf-like-dislike {max-width: 220px; margin: 12px auto 0;}
  .rf-h1 {font-size: 26px;}
  .rf-title-2 {font-size: 14px;}
  .rf-box h2 {font-size: 17px;}
  .rf-section-h3 {font-size: 17px;}
  .rf-player-section {
    margin-left: -8px;
    margin-right: -8px;
    padding: 12px 10px;
  }
  .rf-player-box {padding: 0 !important;}
  .rf-player-box .rf-player {
    display: block;
    width: 100% !important;
    height: 62vw !important;
    min-height: 260px;
    max-height: 360px;
  }
  .rf-react-row {justify-content: center; flex-wrap: wrap; overflow: visible;}
  .rf-footer-top {justify-content: flex-start; padding: 18px 0 14px;}
  .rf-footer-brand {align-items: flex-start; gap: 10px;}
  .rf-footer-brand .rf-hd-badge {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 12px;
  }
  .rf-footer-brand .rf-logo-footer {font-size: 22px;}
  .rf-footer-brand p {font-size: 12px; line-height: 1.35;}
}

/* Light theme overrides */
body.rf-body {
  background: #f3f5fb;
  color: #1f2937;
}
.rf-header {
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(17,24,39,.08);
  border-bottom: 1px solid #e5e7eb;
}
.rf-logo-main, .rf-logo-footer {color: #111827;}
.rf-slogan {color: #6b7280;}
.rf-main-nav a, .rf-sub-nav a, .rf-footer a {color: #334155;}
.rf-main-nav a:hover, .rf-sub-nav a:hover, .rf-footer a:hover {color: #059669;}
.rf-search-input {
  border-color: #d1d5db;
  background: #ffffff;
  color: #111827;
}
.rf-search-btn, .rf-auth-btn {
  border-color: #d1d5db;
  background: #ffffff;
  color: #374151;
}
.rf-header-sub {
  background: #ffffff;
  border-top: 1px solid #e5e7eb;
}
.rf-sub-nav {color: #64748b;}
.rf-box, .rf-meta-box, .rf-player-section, .rf-review-form, .rf-comment, .rf-pagination, .rf-react-inline {
  background: #ffffff;
  border-color: #e5e7eb;
}
.rf-breadcrumbs {color: #64748b;}
.rf-desc {color: #475569;}
.rf-grid-card {
  background: #ffffff;
  border-color: #e5e7eb;
}
.rf-grid-card h4 {color: #0f172a;}
.rf-grid-card div {color: #64748b;}
.rf-watch-card, .rf-mini-card {color: #0f172a;}
.rf-watch-card div, .rf-mini-card div {color: #64748b;}
.rf-poster {
  background: #ffffff;
  border-color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.08);
}
.rf-meta-box span {color: #64748b;}
.rf-meta-box b {color: #0f172a;}
.rf-ratings > div {
  background: #ffffff;
  color: #334155;
  border-color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.08);
}
.rf-like-btn {
  color: #0f766e;
  background: #ecfdf5;
  border-color: #a7f3d0;
}
.rf-dislike-btn {
  color: #be123c;
  background: #fff1f2;
  border-color: #fecdd3;
}
.rf-tabs-btn {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #334155;
}
.rf-tabs-btn.is-active {
  background: #ecfdf5;
  border-color: #10b981;
  color: #047857;
}
.rf-player {border: 1px solid #e5e7eb;}
.rf-react-title {color: #475569;}
.rf-react-btn {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #1f2937;
}
.rf-react-btn:hover {
  background: #f0fdf4;
  border-color: #10b981;
  box-shadow: 0 0 0 1px rgba(16,185,129,.2), 0 0 12px rgba(16,185,129,.12);
}
.rf-react-btn i {color: #6b7280;}
.rf-react-btn.is-active {background: #ecfdf5; border-color: #10b981;}
.rf-review-form label {color: #475569;}
.rf-review-form input, .rf-review-form textarea, .rf-review-form .bb-editor textarea {
  background: #ffffff;
  color: #111827;
  border-color: #d1d5db;
}
.rf-comment-date {color: #64748b;}
.rf-comment p {color: #334155;}
.rf-footer {
  background: #ffffff;
  border-top: 1px solid #e5e7eb;
}
.rf-footer-brand p, .rf-copy {color: #6b7280;}
.rf-social span {background: #e2e8f0; color: #475569;}