/* UI values mapped from tv.int.cm Home-GzAyOrKo.css and HotMovie-1Ijbw63D.css. */
body.cinema {
  --fillet: 8px;
  --con-width: 600px;
  --box-margin: 12px;
  --blur: 15px;
  --box-padding: 16px;
  --shadow: rgba(0, 0, 0, 0.08) 0 4px 12px;
  --zt-bg: #165dff;
  --bg-1: #fff;
  --color-bg-1: #f5f6f7;
  --color-bg-2: #fff;
  --color-bg-3: #fff;
  --color-text-1: rgb(29, 33, 41);
  --color-text-2: rgb(78, 89, 105);
  --color-text-3: rgb(134, 144, 156);
  --color-text-4: rgb(201, 205, 212);
  --color-border-1: rgb(242, 243, 245);
  --color-fill-1: rgb(247, 248, 250);
  --color-fill-2: rgb(242, 243, 245);
  --color-fill-3: rgb(229, 230, 235);
  --color-fill-4: rgb(201, 205, 212);
  --color-mask-bg: rgba(29, 33, 41, .6);
  --tm-bg: rgba(216, 216, 216, 0.3);
  --btm-bk: rgba(177, 177, 177, 0.2);
  margin: 0;
  background: var(--color-bg-1);
  color: var(--color-text-1);
  font-family: HarmonyOS_Sans_SC_Medium, sans-serif;
  font-size: 14px;
  line-height: 1.15;
}

/* History: desktop overlay and mobile route-style page. */
body.cinema.mofa-history-open { overflow: hidden !important; }
body.cinema .mofa-history-shell { display: none; }
body.cinema .mofa-history-shell.open { display: block; }
body.cinema .mofa-history-shell [hidden] { display: none !important; }
body.cinema .mofa-history-mask {
  position: fixed;
  inset: 0;
  z-index: 99998;
  width: 100%;
  height: 100%;
  background: transparent;
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
  animation: mofaHistoryMaskIn .4s both;
}
body.cinema .mofa-history-desktop-panel {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  animation: mofaHistoryDesktopIn .6s both;
}
body.cinema .mofa-history-desktop-content {
  width: 800px;
  height: auto;
  min-height: 0;
  padding-bottom: 70px;
  overflow: auto;
  scrollbar-width: none;
}
body.cinema .mofa-history-desktop-content::-webkit-scrollbar { display: none; }
body.cinema .mofa-history-desktop-title {
  margin-top: 100px;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}
body.cinema .mofa-history-desktop-tip {
  margin: 12px 0 0;
  color: #e9e9e9;
  font-size: 14px;
  text-align: center;
}
body.cinema .mofa-history-desktop-tools {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 0;
}
body.cinema .mofa-history-clear {
  display: flex;
  align-items: center;
  margin-top: 15px;
  padding: 6px 8px;
  border: 0;
  border-radius: 50px;
  background: #ff5757;
  color: #fff;
}
body.cinema .mofa-history-clear img { width: 12px; height: 12px; margin-right: 5px; }
body.cinema .mofa-history-clear span { font-size: 10px; }
body.cinema .mofa-history-desktop-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 50px;
}
body.cinema .mofa-history-desktop-item {
  display: block;
  width: 22%;
  margin: 12px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--fillet, 8px);
  background: var(--color-bg-3);
  box-shadow: var(--shadow);
  color: var(--color-text-1);
  text-align: left;
}
body.cinema .mofa-history-desktop-image {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: var(--color-bg-3);
}
body.cinema .mofa-history-desktop-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.cinema .mofa-history-desktop-info { padding: 8px 8px 10px; }
body.cinema .mofa-history-desktop-item-title {
  overflow: hidden;
  font-size: 14px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.cinema .mofa-history-desktop-item-time {
  margin-top: 8px;
  overflow: hidden;
  color: var(--color-text-3);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.cinema .mofa-history-search-item {
  display: flex;
  align-items: center;
  min-height: 68px;
  padding: 16px;
}
body.cinema .mofa-history-search-item > img { width: 20px; height: 20px; margin-right: 10px; opacity: .75; }
body.cinema .mofa-history-search-item > span { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
body.cinema .mofa-history-desktop-list > .mofa-history-empty {
  width: 100%;
  margin-top: 0;
  padding-top: 70px;
}
body.cinema .mofa-history-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body.cinema .mofa-history-desktop-top {
  animation: mofaHistoryTopIn .6s both;
}
body.cinema .mofa-history-desktop-list > .mofa-history-empty {
  animation: mofaHistoryEmptyIn .6s both;
}
body.cinema .mofa-history-desktop-list .mofa-history-empty img { width: 150px; height: 150px; }
body.cinema .mofa-history-desktop-list .mofa-history-empty p {
  margin: 0;
  color: var(--color-text-3);
  font-size: 12px;
}
body.cinema .mofa-history-mobile-page { display: none; }
body.cinema .mofa-history-shell.mobile-mode .mofa-history-mask,
body.cinema .mofa-history-shell.mobile-mode .mofa-history-desktop-panel { display: none; }
body.cinema .mofa-history-shell.mobile-mode .mofa-history-mobile-page {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: block;
  width: 100%;
  min-height: 100vh;
  overflow-y: auto;
  scrollbar-width: none;
  background: var(--color-bg-1);
  animation: mofaHistoryMobileIn .3s ease both;
}
body.cinema .mofa-history-shell.mobile-mode .mofa-history-mobile-page::-webkit-scrollbar { display: none; }
body.cinema .mofa-history-mobile-nav {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 64px;
  padding: 16px var(--box-padding, 16px);
  background: var(--bg-1);
}
body.cinema .mofa-history-mobile-back,
body.cinema .mofa-history-mobile-delete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text-1);
}
body.cinema .mofa-history-mobile-back svg,
body.cinema .mofa-history-mobile-delete svg { width: 24px; height: 24px; }
body.cinema .mofa-history-mobile-delete.placeholder { visibility: hidden; pointer-events: none; }
body.cinema .mofa-history-mobile-title {
  color: var(--color-text-1);
  font-size: 18px;
  font-weight: 500;
}
body.cinema .mofa-history-mobile-select {
  position: fixed;
  top: 64px;
  right: 0;
  left: 0;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  padding: 12px 16px;
  background: var(--bg-1);
}
body.cinema .mofa-history-mobile-select > div { display: flex; gap: 8px; }
body.cinema .mofa-history-mobile-select button {
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--color-border-1);
  border-radius: 6px;
  background: var(--color-bg-2);
  color: var(--color-text-2);
  font-size: 13px;
}
body.cinema .mofa-history-mobile-select button.danger { border-color: #f53f3f; color: #f53f3f; }
body.cinema .mofa-history-mobile-select button:disabled { opacity: .45; }
body.cinema .mofa-history-mobile-select span { color: var(--color-text-2); font-size: 14px; }
body.cinema .mofa-history-mobile-spacer { width: 100%; height: 64px; }
body.cinema .mofa-history-shell.selecting .mofa-history-mobile-spacer { height: 120px; }
body.cinema .mofa-history-mobile-list {
  position: relative;
  min-height: 100vh;
  padding: 16px;
}
body.cinema .mofa-history-mobile-item {
  position: relative;
  display: flex;
  width: 100%;
  margin: 0 0 16px;
  padding: 16px;
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  background: var(--color-bg-2);
  color: var(--color-text-1);
  text-align: left;
  transition: all .3s;
}
body.cinema .mofa-history-mobile-item.selecting { padding-left: 50px; }
body.cinema .mofa-history-checkbox {
  position: absolute;
  top: 50%;
  left: 16px;
  display: none;
  width: 20px;
  height: 20px;
  border: 1px solid #c9cdd4;
  border-radius: 50%;
  transform: translateY(-50%);
}
body.cinema .mofa-history-mobile-item.selecting .mofa-history-checkbox { display: block; }
body.cinema .mofa-history-mobile-item.selected .mofa-history-checkbox { border-color: #165dff; background: #165dff; box-shadow: inset 0 0 0 4px #fff; }
body.cinema .mofa-history-mobile-image {
  position: relative;
  flex: 0 0 120px;
  width: 120px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--color-fill-2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, .1);
  aspect-ratio: 3 / 4;
}
body.cinema .mofa-history-mobile-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.cinema .mofa-history-mobile-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  margin-left: 16px;
  padding: 8px 0;
}
body.cinema .mofa-history-mobile-item-title {
  display: -webkit-box;
  margin-bottom: 12px;
  overflow: hidden;
  color: var(--color-text-1);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
body.cinema .mofa-history-mobile-meta { margin-bottom: 8px; color: var(--color-text-2); font-size: 14px; }
body.cinema .mofa-history-mobile-meta.time { color: var(--color-text-3); font-size: 12px; }
body.cinema .mofa-history-mobile-search-item { align-items: center; min-height: 58px; }
body.cinema .mofa-history-search-icon { flex: 0 0 22px; width: 22px; height: 22px; margin-right: 14px; opacity: .7; }
body.cinema .mofa-history-search-keyword { min-width: 0; overflow: hidden; color: var(--color-text-1); font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
body.cinema .mofa-history-mobile-list > .mofa-history-empty { padding: 60px 0; }
body.cinema .mofa-history-mobile-list .mofa-history-empty img { width: 120px; height: 120px; }
body.cinema .mofa-history-mobile-list .mofa-history-empty p {
  margin: 0 0 60px;
  color: var(--color-text-3);
  font-size: 16px;
}
body.cinema .mofa-history-home-button {
  height: 40px;
  padding: 0 20px;
  border: 1px solid #165dff;
  border-radius: 30px;
  background: transparent;
  color: #165dff;
  font-size: 14px;
}
body.cinema .mofa-history-shell.desktop-mode.closing .mofa-history-mask { animation: mofaHistoryMaskOut .8s both; }
body.cinema .mofa-history-shell.desktop-mode.closing .mofa-history-desktop-panel { animation: mofaHistoryDesktopOut .4s both; }
body.cinema .mofa-history-shell.desktop-mode.closing .mofa-history-desktop-top { animation: mofaHistoryTopOut .4s both; }
body.cinema .mofa-history-shell.desktop-mode.closing .mofa-history-desktop-list > .mofa-history-empty { animation: mofaHistoryEmptyOut .4s both; }
body.cinema .mofa-history-shell.mobile-mode.closing .mofa-history-mobile-page { animation: mofaHistoryMobileOut .3s ease both; }
@keyframes mofaHistoryMaskIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes mofaHistoryMaskOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes mofaHistoryDesktopIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes mofaHistoryDesktopOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes mofaHistoryTopIn { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: translateZ(0); } }
@keyframes mofaHistoryTopOut { from { opacity: 1; } to { opacity: 0; transform: translate3d(0, -100%, 0); } }
@keyframes mofaHistoryEmptyIn { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: translateZ(0); } }
@keyframes mofaHistoryEmptyOut { from { opacity: 1; } to { opacity: 0; transform: translate3d(0, 100%, 0); } }
@keyframes mofaHistoryMobileIn { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: translateX(0); } }
@keyframes mofaHistoryMobileOut { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(24px); } }
body.cinema, body.cinema * { box-sizing: border-box; }
body.cinema *, body.cinema a, body.cinema p {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
body.cinema [contenteditable="true"],
body.cinema input,
body.cinema textarea {
  -webkit-user-select: auto !important;
  -khtml-user-select: auto !important;
  -moz-user-select: auto !important;
  -ms-user-select: auto !important;
  -o-user-select: auto !important;
  user-select: auto !important;
}
body.cinema button, body.cinema input { font: inherit; }
body.cinema .top-nav,
body.cinema .legacy-tools,
body.cinema .site-footer,
body.cinema .hero-actions,
body.cinema .banner-thumbs,
body.cinema .home-sections,
body.cinema .desktop-nav-actions { display: none !important; }
body.cinema .app { display: block !important; min-height: 100vh; }
body.cinema .main {
  width: var(--con-width) !important;
  max-width: var(--con-width) !important;
  margin: 0 0 0 calc((100vw - var(--con-width)) / 2) !important;
  padding: 30px 0 60px !important;
}
body.cinema .menu-top { display: none !important; }

/* Carousel */
body.cinema .hero {
  display: block !important;
  position: relative !important;
  z-index: 1;
  width: 100% !important;
  height: 300px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  background: var(--hero-image, url("/views/index/mofa/common/static/mac/vajra-bg.jpg")) center / cover no-repeat !important;
  touch-action: pan-y;
}
body.cinema .hero::before { display: none !important; }
body.cinema .hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 48px;
  z-index: 1;
  display: block !important;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 13%, rgba(0, 0, 0, 0.15));
  pointer-events: none;
}
body.cinema .hero h2,
body.cinema .hero p {
  display: block !important;
  position: absolute !important;
  left: 16px !important;
  z-index: 2 !important;
  max-width: 70%;
  margin: 0 !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
body.cinema .hero h2 {
  bottom: 37px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 20.7px !important;
}
body.cinema .hero p {
  bottom: 16px !important;
  font-size: 14px !important;
  line-height: 16.1px !important;
  opacity: 0.9;
}
body.cinema .banner-dots {
  position: absolute !important;
  right: 12px !important;
  bottom: 12px !important;
  z-index: 3 !important;
  display: flex !important;
  gap: 0 !important;
  width: 48px !important;
  height: 4px !important;
  overflow: hidden !important;
  border-radius: 4px !important;
  background: rgba(255, 255, 255, 0.3) !important;
}
body.cinema .banner-dot {
  flex: 1 1 0 !important;
  width: auto !important;
  height: 4px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
}
body.cinema .banner-dot.active { background: #fff !important; }

/* Search */
body.cinema .search-box {
  display: block !important;
  width: 100% !important;
  height: 142.625px !important;
  margin: var(--box-margin) 0 0 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.cinema .search-con {
  width: 100% !important;
  height: 100% !important;
  padding: 18px 15px 15px !important;
  border-radius: 12px !important;
  background: var(--color-bg-2) !important;
  box-shadow: var(--shadow) !important;
  transition: all .2s ease-in-out !important;
}
body.cinema .top-hito {
  display: flex !important;
  align-items: center !important;
  height: 20.625px !important;
  margin: 0 0 12px !important;
  padding: 0 5px !important;
}
body.cinema .hito-tag {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 20.625px !important;
  margin-right: 8px !important;
  padding: 4px 0 !important;
  border-radius: 6px !important;
  background: #165dff !important;
  color: #fafafa !important;
  font-size: 11px !important;
  line-height: 12.625px !important;
}
body.cinema .hito-text {
  min-width: 0;
  overflow: hidden;
  color: var(--color-text-2) !important;
  font-size: 14px !important;
  line-height: 20.625px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.cinema .hito-text.mofa-hito-enter { animation: mofa-hito-fade-in .4s both; }
body.cinema .hito-text.mofa-hito-leave { animation: mofa-hito-fade-out .4s both; }

@keyframes mofa-hito-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes mofa-hito-fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
body.cinema .home-search-row {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 50px !important;
  margin: 0 0 12px !important;
  padding: 6px 7px 6px 10px !important;
  border-radius: 15px !important;
  background: rgb(242, 243, 245) !important;
}
body.cinema .home-search-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 28px !important;
  margin: 0 12px 0 0 !important;
}
body.cinema .home-search-icon img { display: block !important; width: 32px !important; height: 28px !important; opacity: 1 !important; object-fit: contain; }
body.cinema .home-search-input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 35.625px !important;
  padding: 6px 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--color-text-1) !important;
  font-size: 14px !important;
}
body.cinema .home-search-input::placeholder { color: var(--color-text-3) !important; }
body.cinema .search-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: 58px !important;
  height: 36.4px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #165dff !important;
  color: #e9e9e9 !important;
  font-size: 15px !important;
  line-height: 17.25px !important;
}
body.cinema .search-bottom-box {
  display: block !important;
  align-items: normal !important;
  width: 100% !important;
  height: 15px !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body.cinema .hot-list-box { display: flex !important; align-items: center !important; width: 100% !important; height: 15px !important; padding: 0 5px !important; }
body.cinema .hot-list-box > img { flex: 0 0 14px !important; width: 14px !important; height: auto !important; margin-right: 6px !important; padding-bottom: 1px !important; }
body.cinema .hot-list { display: flex !important; flex: 1 1 auto !important; width: 0 !important; gap: 0 !important; min-width: 0 !important; overflow-x: auto !important; overflow-y: hidden !important; scrollbar-width: none; white-space: nowrap !important; }
body.cinema .hot-list::-webkit-scrollbar { display: none; }
body.cinema .hot-list .item { flex: 0 0 auto !important; margin-left: 12px !important; color: var(--color-text-3) !important; font-size: 13px !important; line-height: 15px !important; }
body.cinema .hot-list .item:first-child { margin-left: 6px !important; }
body.cinema .hot-list .item p { margin: 0 !important; }
body.cinema .home-search-clear { flex: 0 0 auto !important; margin: 0 0 0 12px !important; color: var(--color-text-4) !important; font-size: 13px !important; line-height: 15px !important; }
body.cinema .mofa-search-bottom-enter { animation: mofa-search-fade-in-up .4s both; }
body.cinema .mofa-search-bottom-leave { animation: mofa-search-fade-out-up .2s both; }

@keyframes mofa-search-fade-in-up {
  from { opacity: 0; transform: translate3d(0, 100%, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes mofa-search-fade-out-up {
  from { opacity: 1; transform: translate3d(0, 0, 0); }
  to { opacity: 0; transform: translate3d(0, -100%, 0); }
}

/* Feature and local history */
body.cinema .home-main-top { display: flex !important; width: 100% !important; height: 240px !important; margin: var(--box-margin) 0 0 !important; gap: 0 !important; }
body.cinema .left-box { display: block !important; flex: 0 0 340.64px !important; width: 340.64px !important; min-width: 0 !important; height: 240px !important; padding: 12px !important; border-radius: 12px !important; background: var(--color-bg-2) !important; box-shadow: var(--shadow) !important; }
body.cinema .last-watch-history { display: flex !important; align-items: center !important; width: 100% !important; height: 44.125px !important; padding: 14px 15px 14px 12px !important; border-radius: 12px !important; background: var(--tm-bg) !important; color: var(--color-text-3) !important; font-size: 14px !important; line-height: 16.125px !important; }
body.cinema .domain-box { display: flex !important; justify-content: space-between !important; width: 100% !important; height: 159px !important; margin: var(--box-margin) 0 0 !important; gap: normal !important; color: #fff !important; }
body.cinema .domain-box > .left { position: relative !important; display: flex !important; align-items: flex-start !important; justify-content: flex-start !important; flex: 0 1 50% !important; flex-direction: column !important; width: 50% !important; height: 100% !important; margin: 0 12px 0 0 !important; padding: 15px !important; overflow: hidden !important; border: 0 !important; border-radius: 12px !important; background: transparent !important; box-shadow: none !important; color: #fff !important; text-align: left !important; appearance: none !important; -webkit-appearance: none !important; }
body.cinema .domain-box > .left > img { position: absolute !important; inset: 0 !important; z-index: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
body.cinema .domain-box > .left::before,
body.cinema .domain-box > .left::after { content: none !important; display: none !important; }
body.cinema .domain-box > .right { display: block !important; flex: 0 1 auto !important; flex-direction: row !important; width: 50% !important; height: 100% !important; gap: normal !important; }
body.cinema .domain-box > .right > .history,
body.cinema .domain-box > .right > .ad { position: relative !important; display: grid !important; grid-template-columns: minmax(0, 1fr) 35px !important; grid-template-rows: auto auto !important; align-content: start !important; align-items: center !important; justify-content: stretch !important; width: 100% !important; height: calc((100% - 12px) / 2) !important; min-height: 0 !important; padding: 18px 18px 18px 15px !important; overflow: visible !important; border: 0 !important; border-radius: 12px !important; box-shadow: none !important; color: #fff !important; text-align: left !important; appearance: none !important; -webkit-appearance: none !important; }
body.cinema .domain-box > .right > .history,
body.cinema .domain-box > .right > .ad { display: flex !important; flex: 0 1 auto !important; flex-direction: row !important; align-content: normal !important; align-items: center !important; justify-content: space-between !important; }
body.cinema .domain-box > .right > .history { margin: 0 12px 0 0 !important; background: linear-gradient(137.29deg, #ff8a1c, #ffe79e) !important; }
body.cinema .domain-box > .right > .ad { margin: 12px 0 0 !important; background: linear-gradient(100.73deg, #895cfa, #5cbefa) !important; }
body.cinema .domain-box .feature-card p,
body.cinema .domain-box .feature-card span { position: relative !important; z-index: 1 !important; display: block !important; margin: 0 !important; color: #fff !important; font-weight: 400 !important; }
body.cinema .domain-box > .left { display: block !important; flex: 0 1 auto !important; flex-direction: row !important; align-content: normal !important; align-items: normal !important; justify-content: normal !important; }
body.cinema .domain-box > .left .feature-info-wrap { position: static !important; z-index: auto !important; display: block !important; width: 100% !important; height: 28px !important; overflow: hidden !important; }
body.cinema .domain-box > .left p { margin: 0 0 5px !important; font-size: 20px !important; font-weight: 700 !important; line-height: 23px !important; }
body.cinema .domain-box > .left p.mofa-theme-text-enter { animation: mofa-search-fade-in-up .4s both; }
body.cinema .domain-box > .left p.mofa-theme-text-leave { animation: mofa-search-fade-out-up .4s both; }
body.cinema .domain-box > .left span { display: inline !important; font-size: 11px !important; line-height: 12.65px !important; }
body.cinema .domain-box > .right .info { position: relative !important; z-index: 1 !important; display: block !important; margin: 0 !important; padding: 0 !important; }
body.cinema .domain-box > .right .info p { margin: 0 0 3px !important; font-size: 16px !important; font-weight: 700 !important; line-height: 18.4px !important; }
body.cinema .domain-box > .right .info span { display: inline !important; font-size: 11px !important; font-weight: 400 !important; line-height: 12.65px !important; }
body.cinema .domain-box > .right .info { position: static !important; z-index: auto !important; display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
body.cinema .domain-box > .right .info p,
body.cinema .domain-box > .right .info span { position: static !important; z-index: auto !important; }
body.cinema .domain-box > .right > .ad { position: static !important; }
body.cinema .domain-box .feature-card > img { position: static !important; z-index: 1 !important; display: block !important; grid-column: 2 !important; grid-row: 1 / span 2 !important; align-self: center !important; justify-self: end !important; flex: 0 1 auto !important; width: 35px !important; height: 35px !important; object-fit: fill !important; }
body.cinema .domain-box > .left > img { position: absolute !important; inset: 0 !important; z-index: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
body.cinema .local-watch-card { display: flex !important; align-items: center !important; justify-content: flex-start !important; flex: 0 0 247.36px !important; width: 247.36px !important; min-width: 0 !important; height: 240px !important; margin: 0 0 0 var(--box-margin) !important; padding: 40px 20px 20px !important; overflow: hidden !important; border-radius: 12px !important; background: var(--color-bg-2) !important; box-shadow: var(--shadow) !important; text-align: center !important; }
body.cinema .local-watch-icon { display: block !important; width: 64px !important; height: 64px !important; margin: 0 0 16px !important; border: 4px solid var(--color-bg-2) !important; border-radius: 50% !important; background: transparent !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important; }
body.cinema .local-watch-icon img { display: block !important; width: 64px !important; height: 64px !important; }
body.cinema .local-watch-card strong { margin: 0 0 8px !important; color: var(--color-text-1) !important; font-size: 16px !important; font-weight: 700 !important; line-height: 18.4px !important; }
body.cinema .local-watch-card > span { margin: 0 !important; color: var(--color-text-3) !important; font-size: 12px !important; line-height: 14px !important; }
body.cinema .local-watch-card button { width: 100% !important; height: 35px !important; margin: 24px 0 0 !important; padding: 10px !important; border: 0 !important; border-radius: 8px !important; background: #165dff !important; color: #fff !important; font-size: 13px !important; line-height: 15px !important; }

/* Notice */
body.cinema .notice-strip { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 0 !important; width: 100% !important; height: 49px !important; min-height: 49px !important; margin: var(--box-margin) 0 0 !important; padding: 12px !important; border: 0 !important; border-radius: 12px !important; background: var(--color-bg-2) !important; box-shadow: none !important; color: var(--color-text-2) !important; font-size: 14px !important; line-height: 21px !important; }
body.cinema .notice-strip,
body.cinema .notice-strip > p { font-weight: 400 !important; }
body.cinema .notice-strip > img,
body.cinema .notice-strip .notice-icon img { display: block !important; flex: 0 0 25px !important; width: 25px !important; height: 25px !important; margin: 0 10px 0 0 !important; }
body.cinema .notice-strip > p { display: block !important; flex: 0 1 auto !important; margin: 0 !important; padding: 0 !important; font-size: 14px !important; line-height: 21px !important; }
body.cinema .notice-strip .notice-icon { display: block !important; flex: 0 0 25px !important; width: 25px !important; height: 25px !important; margin: 0 10px 0 0 !important; border-radius: 0 !important; background: transparent !important; color: transparent !important; font-size: 0 !important; }
body.cinema .notice-strip button { display: none !important; }

/* HotMovie */
body.cinema .hotmovie-con { position: relative !important; width: 100% !important; min-height: 760px !important; margin: var(--box-margin) 0 0 !important; padding: 12px 12px 0 !important; border-radius: 12px !important; background: var(--color-bg-2) !important; box-shadow: var(--shadow) !important; }
body.cinema .section-title-row { display: none !important; }
body.cinema .recommend-section { display: block !important; width: 100% !important; height: 32.1px !important; margin: 0 0 16px !important; }
body.cinema .recommend-header { display: flex !important; align-items: center !important; width: 100% !important; height: 32.1px !important; margin: 0 !important; }
body.cinema .header-right { display: flex !important; align-items: center !important; gap: 12px !important; width: auto !important; height: 32.1px !important; }
body.cinema .quick-cats { display: flex !important; align-items: normal !important; justify-content: normal !important; flex: 0 1 auto !important; width: auto !important; gap: 8px !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; scrollbar-width: none; }
body.cinema .quick-cats::-webkit-scrollbar { display: none; }
body.cinema .cat-chip { position: static !important; display: block !important; align-items: normal !important; justify-content: normal !important; flex: 0 1 auto !important; width: auto !important; min-width: 0 !important; height: 32.1px !important; min-height: 0 !important; padding: 8px 16px !important; border: 0 !important; border-radius: 20px !important; background: var(--color-bg-3) !important; box-shadow: none !important; color: var(--color-text-3) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 16.1px !important; transform: none !important; transition: all .3s !important; white-space: nowrap; cursor: pointer; }
body.cinema .cat-chip.active { background: #165dff !important; color: #fff !important; font-weight: 700 !important; }
body.cinema .cat-chip:hover:not(.active) { background: var(--color-bg-4, var(--color-bg-3)) !important; }
body.cinema #grid.category-switch-enter { animation: mofa-category-fadeload .4s ease both; }
@keyframes mofa-category-fadeload { from { opacity: 0; } to { opacity: 1; } }
body.cinema .action-buttons { display: flex !important; align-items: center !important; gap: 6px !important; flex: 0 1 auto !important; height: 29.6px !important; }
body.cinema .refresh-btn { display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 1 auto !important; width: 72.6px !important; min-width: 72.6px !important; height: 29.6px !important; min-height: 29.6px !important; margin: 0 !important; padding: 6px !important; gap: normal !important; border: 1px solid var(--color-border-1) !important; border-radius: 50px !important; background: var(--color-bg-2) !important; color: var(--color-text-2) !important; font-size: 14px !important; line-height: 16.1px !important; white-space: nowrap; cursor: pointer; transition: all .3s !important; }
body.cinema .refresh-btn > svg { display: block !important; flex: 0 1 auto !important; width: 16px !important; height: 16px !important; margin: 0 !important; font-size: 16px !important; line-height: 18.4px !important; vertical-align: -2px !important; }
body.cinema .refresh-btn > p { display: block !important; margin: 0 2px 0 5px !important; color: inherit !important; font-size: 12px !important; line-height: 13.8px !important; }
body.cinema .refresh-btn:hover:not(:disabled) { border-color: #165dff !important; color: #165dff !important; }
body.cinema .refresh-btn:disabled { opacity: .6 !important; cursor: not-allowed; }
body.cinema .refresh-btn.spin > svg { animation: mofa-refresh-rotate .5s linear infinite; }
@keyframes mofa-refresh-rotate { to { transform: rotate(360deg); } }
body.cinema #message { width: 100% !important; }
body.cinema #grid { display: grid !important; grid-template-columns: repeat(4, 22%) !important; justify-content: space-between !important; align-items: start !important; width: 100% !important; padding: 0 !important; gap: 0 !important; }
body.cinema .card { position: relative !important; flex: none !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 0 12px !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body.cinema .poster { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 3 / 4 !important; overflow: hidden !important; border-radius: 8px !important; background: rgb(245, 245, 245) !important; object-fit: cover !important; }
body.cinema .card-body { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin-top: 8px !important; padding: 0 !important; gap: 0 !important; overflow: hidden !important; }
body.cinema .card .title { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; min-height: 0 !important; overflow: hidden !important; color: var(--color-text-1) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 16px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
body.cinema .card-actions { display: none !important; }
body.cinema .rank-badge { position: absolute !important; top: 0 !important; left: 0 !important; z-index: 6 !important; width: auto !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-width: 100% !important; padding: 4px 6px !important; overflow: hidden !important; border-radius: 0 0 8px !important; background: #e75f47 !important; color: #fff !important; font-size: 11px !important; font-weight: 500 !important; line-height: 12.625px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
body.cinema .mofa-sidedbar { position: fixed !important; top: 50% !important; right: 10px !important; z-index: 999 !important; display: block !important; width: 45px !important; transform: translateY(-50%) !important; transition: opacity .2s ease-in-out, transform .2s ease-in-out !important; }
body.cinema.home-search-focused .mofa-sidedbar { opacity: 0 !important; pointer-events: none !important; transform: translate(55px, -50%) !important; }
body.cinema .mofa-sidedbar-inner { display: flex !important; flex-direction: column !important; width: 45px !important; padding: 10px 0 !important; overflow: hidden !important; border-radius: 8px !important; background: var(--color-bg-2) !important; box-shadow: none !important; }
body.cinema .mofa-side-action { display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 45px !important; width: 45px !important; height: 45px !important; min-height: 45px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; cursor: pointer; }
body.cinema .mofa-sidedbar #themeBtn,
body.cinema .mofa-sidedbar #backTopBtn { position: static !important; inset: auto !important; display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 45px !important; width: 45px !important; height: 45px !important; min-height: 45px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1 !important; }
body.cinema .mofa-sidedbar #backTopBtn { display: none !important; opacity: 1 !important; pointer-events: auto !important; }
body.cinema.side-backtop-visible .mofa-sidedbar #backTopBtn { display: flex !important; animation: mofa-side-zoom-in .4s ease both !important; }
body.cinema .mofa-side-action img { display: block !important; width: 25px !important; height: 25px !important; object-fit: contain !important; }
body.cinema .mofa-theme-icon-enter { animation: mofa-side-fade-in 1s ease both; }

@keyframes mofa-side-zoom-in {
  0% { opacity: 0; transform: scale3d(.3, .3, .3); }
  50% { opacity: 1; }
}

@keyframes mofa-side-fade-in {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

body.cinema.cinema-night {
  --bg-1: #17171a;
  --color-bg-1: #17171a;
  --color-bg-2: #232324;
  --color-bg-3: #2a2a2b;
  --color-text-1: rgba(255, 255, 255, .9);
  --color-text-2: rgba(255, 255, 255, .7);
  --color-text-3: rgba(255, 255, 255, .5);
  --color-text-4: rgba(255, 255, 255, .3);
  --color-border-1: rgb(46, 46, 48);
  --tm-bg: rgba(50, 51, 53, .5);
  --btm-bk: rgba(160, 160, 160, .1);
  background: var(--color-bg-1) !important;
  color: var(--color-text-1) !important;
}
body.cinema.cinema-night .main { background: var(--color-bg-1) !important; }
body.cinema.cinema-night .home-search-row { background: var(--tm-bg) !important; }
body.cinema.cinema-night .menu-top,
body.cinema.cinema-night .search-con,
body.cinema.cinema-night .left-box,
body.cinema.cinema-night .local-watch-card,
body.cinema.cinema-night .notice-strip,
body.cinema.cinema-night .hotmovie-con,
body.cinema.cinema-night .mofa-sidedbar-inner { background: var(--color-bg-2) !important; color: var(--color-text-1) !important; }
body.cinema.cinema-night .card .title { color: var(--color-text-1) !important; }
body.cinema.cinema-night .refresh-btn,
body.cinema.cinema-night .cat-chip { color: var(--color-text-2) !important; }
@media only screen and (min-width: 769px) { body.cinema .bottom-tabs { display: none !important; } }

@media only screen and (max-width: 768px) {
  html, body.cinema { width: 100%; min-height: 100%; scrollbar-width: none; }
  body.cinema::-webkit-scrollbar { display: none; }
  body.cinema .main { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 0 55px !important; }
  body.cinema .menu-top { position: relative !important; inset: auto !important; z-index: 99 !important; display: block !important; width: 100% !important; height: 72px !important; background: var(--bg-1) !important; backdrop-filter: saturate(180%) blur(25px); -webkit-backdrop-filter: saturate(180%) blur(25px); }
  body.cinema .menu-box { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; height: 72px !important; padding: 16px var(--box-padding) !important; }
  body.cinema .movesearch, body.cinema .search-container { display: flex !important; flex: 1 1 auto !important; width: 100% !important; }
  body.cinema .custom-search-input { display: flex !important; align-items: center !important; flex: 1 1 auto !important; width: 100% !important; height: 40px !important; padding: 12px !important; gap: 8px !important; border-radius: 20px !important; background: var(--tm-bg) !important; }
  body.cinema .custom-search-input > img { display: block !important; flex: 0 0 16px !important; width: 16px !important; height: 16px !important; margin: 0 !important; opacity: 1 !important; }
  body.cinema .mobile-search-input { flex: 1 1 auto !important; min-width: 0 !important; height: 16px !important; padding: 0 !important; border: 0 !important; outline: 0 !important; background: transparent !important; color: var(--color-text-1) !important; font-size: 14px !important; line-height: 16px !important; caret-color: transparent; }
  body.cinema .mobile-search-input::placeholder { color: var(--color-text-3) !important; }
  body.cinema .mobile-search-submit { display: none !important; }
  body.cinema .hero { display: block !important; width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 var(--box-padding) !important; overflow: visible !important; border-radius: 0 !important; aspect-ratio: auto !important; background: transparent !important; }
  body.cinema .hero::before { content: ""; position: relative !important; inset: auto !important; z-index: 0 !important; display: block !important; width: 100% !important; height: auto !important; border-radius: 12px !important; background: var(--hero-image, url("/views/index/mofa/common/static/mac/vajra-bg.jpg")) center / cover no-repeat !important; aspect-ratio: 16 / 9 !important; }
  body.cinema .hero::after { top: auto !important; right: var(--box-padding) !important; bottom: 0 !important; left: var(--box-padding) !important; height: 48px !important; border-radius: 0 0 12px 12px !important; }
  body.cinema .hero h2 { left: 28px !important; bottom: 33px !important; }
  body.cinema .hero p { left: 28px !important; bottom: 12px !important; }
  body.cinema .banner-dots { right: 28px !important; bottom: 12px !important; }
  body.cinema .search-box { display: none !important; }
  body.cinema .theme-page.active { width: 100% !important; padding: 0 var(--box-padding) !important; }
  body.cinema .home-main-top { display: block !important; width: 100% !important; height: 159px !important; min-height: 0 !important; max-height: 159px !important; margin: var(--box-margin) 0 0 !important; }
  body.cinema .left-box { flex: 0 0 auto !important; width: 100% !important; height: 159px !important; min-height: 0 !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
  body.cinema .last-watch-history, body.cinema .local-watch-card { display: none !important; }
  body.cinema .domain-box { width: 100% !important; height: 159px !important; margin: 0 !important; }
  body.cinema .domain-box > .left, body.cinema .domain-box > .right { height: 159px !important; }
  body.cinema .notice-strip { width: 100% !important; margin: var(--box-margin) 0 0 !important; }
  body.cinema .hotmovie-con { width: 100% !important; min-height: 850px !important; margin: 16px 0 0 !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
  body.cinema .header-right { width: 100% !important; justify-content: space-between !important; gap: 8px !important; }
  body.cinema .quick-cats { overflow-x: auto !important; overflow-y: hidden !important; }
  body.cinema .action-buttons { width: 71px !important; height: 28px !important; gap: 0 !important; }
  body.cinema .refresh-btn { width: 71px !important; min-width: 71px !important; height: 28px !important; min-height: 28px !important; margin: 0 !important; padding: 6px !important; border: 0 !important; background: transparent !important; }
  body.cinema .refresh-btn > p { font-size: 12px !important; line-height: 13.8px !important; }
  body.cinema .domain-box > .right .info span { display: inline !important; font-weight: 400 !important; line-height: 12.65px !important; }
  body.cinema .cat-chip { background: transparent !important; }
  body.cinema .cat-chip.active { background: #165dff !important; }
  body.cinema #grid { grid-template-columns: repeat(3, 31%) !important; }
  body.cinema .card { width: 100% !important; max-width: 100% !important; margin-bottom: 14px !important; }
  body.cinema .card-body { padding-left: 2px !important; }
  body.cinema .mofa-sidedbar { top: auto !important; right: 8px !important; bottom: 70px !important; display: block !important; width: 45px !important; transform: none !important; }
  body.cinema .mofa-sidedbar-inner { width: 45px !important; padding: 0 !important; overflow: hidden !important; border-radius: 8px !important; background: transparent !important; }
  body.cinema .mofa-sidedbar #themeBtn { display: none !important; }
  body.cinema .mofa-sidedbar #backTopBtn { width: 45px !important; height: 45px !important; margin-top: 8px !important; padding: 8px !important; border: 1px solid var(--btm-bk) !important; border-radius: 30px !important; background: var(--color-bg-2) !important; box-shadow: none !important; backdrop-filter: blur(5px) !important; -webkit-backdrop-filter: blur(5px) !important; }
  body.cinema .bottom-tabs { position: fixed !important; right: 0 !important; bottom: 0 !important; left: 0 !important; z-index: 999 !important; display: flex !important; align-items: center !important; width: 100% !important; height: 55px !important; min-height: 55px !important; padding: 0 !important; background: var(--bg-1) !important; box-shadow: none !important; backdrop-filter: none !important; }
  body.cinema .bottom-tabs .tab { display: flex !important; align-items: center !important; justify-content: center !important; flex: 1 1 0 !important; flex-direction: column !important; width: auto !important; height: 55px !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #999 !important; font-size: 10px !important; font-weight: 500 !important; line-height: 12px !important; }
  body.cinema .bottom-tabs .tab.active { color: #165dff !important; }
  body.cinema .bottom-tabs .tab > span { display: block !important; width: 24px !important; height: 24px !important; margin: 0 0 4px !important; }
  body.cinema .bottom-tabs .tab-icon { display: block !important; width: 24px !important; height: 24px !important; }
}

/* Final parity pass: isolate the current template from legacy responsive rules. */
body.cinema .hero {
  position: relative !important;
  background: transparent !important;
}
body.cinema .hero::before { display: none !important; content: none !important; }
body.cinema .hero-slides {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  isolation: isolate;
}
body.cinema .hero-slide {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: inherit !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 1.5s cubic-bezier(.34,.69,.1,1) !important;
  pointer-events: none !important;
}
body.cinema .hero-slide-current { z-index: 1 !important; opacity: 1 !important; visibility: visible !important; }
body.cinema .hero-slide-next.is-entering { z-index: 2 !important; opacity: 1 !important; visibility: visible !important; }
body.cinema .hero-slide-current.is-leaving { z-index: 1 !important; opacity: 0 !important; visibility: visible !important; }
body.cinema .hero-slide-image { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
body.cinema .hero-slide-info {
  position: absolute !important;
  right: auto !important;
  bottom: 16px !important;
  left: 16px !important;
  z-index: 2 !important;
  display: block !important;
  width: 70% !important;
  max-width: 70% !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.6) !important;
  pointer-events: none !important;
}
body.cinema .hero-slide-info h2,
body.cinema .hero-slide-info p {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  max-width: none !important;
  margin: 0 !important;
  color: #fff !important;
  text-shadow: inherit !important;
}
body.cinema .hero-slide-info h2 { font-size: 18px !important; font-weight: 700 !important; line-height: 20.7px !important; }
body.cinema .hero-slide-info p { margin-top: 5px !important; font-size: 14px !important; font-weight: 400 !important; line-height: 16.1px !important; opacity: .9 !important; }
body.cinema .hero::after { z-index: 3 !important; pointer-events: none !important; }
body.cinema .banner-progress {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0;
  z-index: 1 !important;
  display: block !important;
  width: 50%;
  height: 100% !important;
  border-radius: inherit !important;
  background: #fff !important;
  transition: left .3s !important;
  pointer-events: none !important;
}
body.cinema .banner-dot {
  position: relative !important;
  z-index: 2 !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 4px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  opacity: 0 !important;
  cursor: pointer !important;
}
body.cinema .banner-dot.active { background: transparent !important; }
body.cinema .banner-arrow {
  position: absolute !important;
  top: 50% !important;
  z-index: 5 !important;
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.3) !important;
  color: #fff !important;
  line-height: 0 !important;
  transform: translateY(-50%) !important;
  cursor: pointer !important;
  opacity: 0 !important;
  visibility: visible !important;
  transition: all .3s !important;
}
body.cinema .hero:hover .banner-arrow,
body.cinema .hero:focus-within .banner-arrow { opacity: 1 !important; }
body.cinema .banner-arrow:hover { background: rgba(255,255,255,.5) !important; }
body.cinema .banner-arrow:active { background: rgba(255,255,255,.5) !important; }
body.cinema .banner-arrow svg { display: block !important; width: 14px !important; height: 14px !important; }
body.cinema .banner-prev { left: 12px !important; }
body.cinema .banner-next { right: 12px !important; }
body.cinema .banner-arrow[hidden] { display: none !important; }
body.cinema .banner-dots { z-index: 5 !important; }

body.cinema .domain-box > .left,
body.cinema .domain-box > .right,
body.cinema .domain-box > .right > .history,
body.cinema .domain-box > .right > .ad { min-height: 0 !important; }
body.cinema .quick-cats,
body.cinema .category-tabs { min-height: 32.1px !important; height: 32.1px !important; }
body.cinema .recommend-header { width: 100% !important; }
body.cinema .header-right { width: auto !important; justify-content: flex-start !important; gap: 12px !important; }
body.cinema .quick-cats,
body.cinema .category-tabs {
  display: flex !important;
  flex: 0 1 auto !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  max-width: calc(100% - 84px) !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
}
body.cinema .cat-chip { flex: 0 0 auto !important; width: auto !important; white-space: nowrap !important; }
body.cinema .action-buttons { flex: 0 0 auto !important; }
body.cinema.nav-stuck .main,
body.cinema.cinema-night.nav-stuck .main { top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; transform: none !important; }
body.cinema .menu-spacer { display: none !important; }
body.cinema .custom-search-input .search-icon-left {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  color: #ddd !important;
  opacity: 1 !important;
}
body.cinema .mobile-search-input,
body.cinema .search-input {
  color: #ddd !important;
  font-size: 14px !important;
  line-height: 16.1px !important;
}
body.cinema .mobile-search-input::placeholder,
body.cinema .search-input::placeholder { color: #ddd !important; opacity: 1 !important; }

body.cinema .bottom-tabs::before,
body.cinema .bottom-tabs::after,
body.cinema .bottom-tabs .tab::before,
body.cinema .bottom-tabs .tab::after,
body.cinema .bottom-tabs .tab-icon-wrap::before,
body.cinema .bottom-tabs .tab-icon-wrap::after { content: none !important; display: none !important; }
body.cinema .bottom-tabs .tab {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  width: auto !important;
  height: 39.5px !important;
  min-height: 39.5px !important;
  padding: 0 !important;
  gap: 0 !important;
  color: #8a8a8a !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 11.5px !important;
}
body.cinema .bottom-tabs .tab-icon-wrap {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
}
body.cinema .bottom-tabs .tab-label {
  display: block !important;
  width: auto !important;
  height: 11.5px !important;
  margin: 4px 0 0 !important;
  color: inherit !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 11.5px !important;
  white-space: nowrap !important;
}
body.cinema .bottom-tabs .tab-icon-off { display: block !important; }
body.cinema .bottom-tabs .tab-icon-on { display: none !important; }
body.cinema .bottom-tabs .tab.active .tab-icon-off { display: none !important; }
body.cinema .bottom-tabs .tab.active .tab-icon-on { display: block !important; }
body.cinema .bottom-tabs .tab-icon { width: 24px !important; height: 24px !important; margin: 0 !important; object-fit: contain !important; }
body.cinema .bottom-tabs .tab.active { color: #165dff !important; }

/* Target HotMovie bottom-loading states and Loader component. */
body.cinema .home-bottom-loader {
  width: 100% !important;
  display: none !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  color: inherit !important;
  font-weight: 400 !important;
}
body.cinema .home-bottom-loader.show { display: flex !important; }
body.cinema .home-bottom-loader .home-bottom-loading {
  display: none !important;
  width: 30px !important;
  margin-bottom: 8px !important;
}
body.cinema .home-bottom-loader.is-loading .home-bottom-loading { display: block !important; }
body.cinema .home-bottom-loader.is-loading p { display: none !important; }
body.cinema .home-bottom-loader p {
  display: block !important;
  margin: 0 !important;
  color: var(--color-text-3) !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: normal !important;
}
body.cinema .home-bottom-loader .end-tip {
  color: var(--color-text-4) !important;
  font-style: italic !important;
}
body.cinema .home-bottom-loader .loader-box {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
body.cinema .home-bottom-loader .loader {
  width: 42px !important;
  height: 42px !important;
  transform: rotate(0);
  animation: mofaLoaderSpin 2.4s linear infinite !important;
}
body.cinema .home-bottom-loader .loader line {
  stroke: var(--color-text-2) !important;
  stroke-width: 4 !important;
  stroke-linecap: round !important;
  opacity: .8;
  stroke-dasharray: 10;
  stroke-dashoffset: 10;
  animation: mofaLoaderDash 2.4s ease-in-out infinite !important;
}

/* Target Element Plus warning message used for empty searches. */
body.cinema .mofa-message {
  position: fixed !important;
  top: 50px !important;
  left: 50% !important;
  z-index: 999999999 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: max-content !important;
  max-width: calc(100vw - 32px) !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 100px !important;
  background: #fff !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .08) !important;
  color: #1d2129 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translate(-50%, -8px) !important;
  transition: opacity .3s ease, transform .4s ease, top .4s ease, visibility 0s linear .3s !important;
}
body.cinema .mofa-message.show {
  opacity: .96 !important;
  visibility: visible !important;
  transform: translate(-50%, 0) !important;
  transition: opacity .3s ease, transform .4s ease, top .4s ease !important;
}
body.cinema .mofa-message-icon {
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  color: #e6a23c !important;
}
body.cinema .mofa-message p {
  margin: 0 !important;
  color: #4e5969 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  white-space: nowrap !important;
}
body.cinema.cinema-night .mofa-message {
  background: #2b2f36 !important;
  color: #f2f3f5 !important;
}
body.cinema.cinema-night .mofa-message p { color: #c9cdd4 !important; }
@keyframes mofaLoaderDash {
  0% { stroke-dashoffset: 10; opacity: .8; }
  50% { stroke-dashoffset: 0; opacity: .4; }
  100% { stroke-dashoffset: 10; opacity: .8; }
}
@keyframes mofaLoaderSpin {
  from { transform: rotate(0); }
  to { transform: rotate(360deg); }
}

@media only screen and (max-width: 768px) {
  body.cinema.is-home-panel {
    position: relative !important;
    isolation: isolate !important;
    background: var(--color-bg-1, #f5f6f7) !important;
  }
  body.cinema.is-home-panel::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 300px !important;
    background: var(--hero-image, url("/views/index/mofa/common/static/mac/vajra-bg.jpg")) center / cover no-repeat !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
  body.cinema.is-home-panel::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 300px !important;
    background: linear-gradient(to bottom, rgba(37,37,43,0) 0%, var(--color-bg-1, #f5f6f7) 100%, var(--color-bg-1, #f5f6f7) 100%) !important;
    backdrop-filter: saturate(180%) blur(25px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(25px) !important;
    pointer-events: none !important;
  }
  body.cinema.is-home-panel.nav-stuck::before,
  body.cinema.is-home-panel.nav-stuck::after { opacity: 1 !important; }
  body.cinema .app { position: relative !important; z-index: 1 !important; }
  body.cinema .main { background: transparent !important; }
  body.cinema .hero {
    height: calc((100vw - 32px) * 9 / 16) !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 16px !important;
    overflow: hidden !important;
  }
  body.cinema .hero-slides { inset: 0 16px !important; border-radius: 12px !important; }
  body.cinema .hero-slide-info { bottom: 12px !important; left: 12px !important; width: 70% !important; max-width: 70% !important; }
  body.cinema .hero-slide-info h2 { font-size: 18px !important; line-height: 20.7px !important; }
  body.cinema .hero-slide-info p { margin-top: 5px !important; font-size: 14px !important; line-height: 16.1px !important; }
  body.cinema .banner-arrow,
  body.cinema .banner-prev,
  body.cinema .banner-next { display: none !important; }
  body.cinema .domain-box > .left { min-height: 0 !important; height: 159px !important; }
  body.cinema .domain-box > .right { min-height: 0 !important; height: 159px !important; }
  body.cinema .quick-cats,
  body.cinema .category-tabs { height: 32.1px !important; min-height: 32.1px !important; }
  body.cinema .recommend-section,
  body.cinema .recommend-header,
  body.cinema .header-right { height: 32.1px !important; min-height: 32.1px !important; }
  body.cinema .header-right { width: 100% !important; justify-content: space-between !important; gap: 8px !important; }
  body.cinema .menu-top { position: fixed !important; top: 0 !important; right: 0 !important; left: 0 !important; height: auto !important; min-height: 0 !important; background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transition: background-color .2s !important; }
  body.cinema .menu-box { height: auto !important; padding: 16px !important; }
  body.cinema .custom-search-input { height: auto !important; min-height: 0 !important; padding: 12px !important; gap: 8px !important; border-radius: 20px !important; background: rgba(216,216,216,.3) !important; transition: all .2s !important; }
  body.cinema .mobile-search-input,
  body.cinema .search-input { height: 16.1px !important; line-height: 16.1px !important; }
  body.cinema .menu-spacer { display: block !important; position: static !important; width: 100% !important; height: 72px !important; min-height: 72px !important; }
  body.cinema.nav-stuck .menu-top { position: fixed !important; top: 0 !important; height: auto !important; background: var(--bg-1) !important; backdrop-filter: saturate(180%) blur(25px) !important; -webkit-backdrop-filter: saturate(180%) blur(25px) !important; z-index: 20 !important; }
  body.cinema.nav-stuck .custom-search-input .search-icon-left,
  body.cinema.nav-stuck .mobile-search-input,
  body.cinema.nav-stuck .search-input,
  body.cinema.nav-stuck .mobile-search-input::placeholder,
  body.cinema.nav-stuck .search-input::placeholder { color: var(--color-text-3) !important; }
}

/* Mobile floating tools: keep the outer rail transparent in both themes. */
@media only screen and (max-width: 768px) {
  body.cinema .mofa-sidedbar .mofa-sidedbar-inner {
    background: transparent !important;
  }

  body.cinema .mofa-sidedbar #backTopBtn {
    width: 45px !important;
    height: 45px !important;
    margin-top: 8px !important;
    padding: 8px !important;
    border: 1px solid var(--btm-bk) !important;
    border-radius: 30px !important;
    background: var(--color-bg-2) !important;
    box-shadow: none !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
  }

  body.cinema .mofa-sidedbar #backTopBtn img {
    display: block !important;
    width: 25px !important;
    height: 25px !important;
    object-fit: contain !important;
  }
}

/* Target dark theme tokens and final component normalization. */
body.cinema.cinema-night {
  color-scheme: dark;
  --color-white: rgba(255, 255, 255, .9);
  --color-black: #000;
  --color-border: #333335;
  --color-bg-1: #17171a;
  --color-bg-2: #232324;
  --color-bg-3: #2a2a2b;
  --color-bg-4: #313132;
  --color-bg-5: #373739;
  --color-bg-white: #f6f6f6;
  --color-text-1: rgba(255, 255, 255, .9);
  --color-text-2: rgba(255, 255, 255, .7);
  --color-text-3: rgba(255, 255, 255, .5);
  --color-text-4: rgba(255, 255, 255, .3);
  --color-border-1: rgb(46, 46, 48);
  --color-fill-1: rgba(255, 255, 255, .04);
  --color-fill-2: rgba(255, 255, 255, .08);
  --color-fill-3: rgba(255, 255, 255, .12);
  --color-fill-4: rgba(255, 255, 255, .16);
  --color-mask-bg: rgba(23, 23, 26, .6);
  --bg-1: #17171a;
  --side-bg: rgba(50, 51, 53, .6);
  --h5-search: #17171a;
  --tm-bg: rgba(50, 51, 53, .5);
  --dh-bg: #fff;
  --search-bg: var(--color-fill-2);
  --play-bom: var(--color-bg-4);
  --btm-bk: rgba(160, 160, 160, .1);
  background: var(--color-bg-1) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .app,
body.cinema.cinema-night .main,
body.cinema.cinema-night .theme-page,
body.cinema.cinema-night .theme-panel,
body.cinema.cinema-night .short-page,
body.cinema.cinema-night .find-page,
body.cinema.cinema-night .mofa-user-page,
body.cinema.cinema-night .search-page,
body.cinema.cinema-night .search-body,
body.cinema.cinema-night .search-result,
body.cinema.cinema-night .search-result-list {
  background: var(--color-bg-1) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night.is-home-panel::after {
  background: linear-gradient(to bottom, rgba(23, 23, 26, 0) 0%, var(--color-bg-1) 100%) !important;
}

body.cinema.cinema-night.is-home-panel::before,
body.cinema.cinema-night .main::before {
  background:
    linear-gradient(180deg, rgba(23, 23, 26, .08) 0%, rgba(23, 23, 26, .48) 72%, var(--color-bg-1) 100%),
    var(--hero-image) center top / cover no-repeat !important;
}

body.cinema.cinema-night .menu-top,
body.cinema.cinema-night .top-nav {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night.nav-stuck .menu-top,
body.cinema.cinema-night.nav-stuck .top-nav {
  background: var(--h5-search) !important;
  border-color: var(--color-fill-2) !important;
  box-shadow: 0 1px 0 var(--color-fill-2) !important;
}

body.cinema.cinema-night .custom-search-input,
body.cinema.cinema-night .top-search,
body.cinema.cinema-night .home-search-row,
body.cinema.cinema-night .search-input-wrap {
  background: var(--search-bg) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .mobile-search-input,
body.cinema.cinema-night .home-search-input,
body.cinema.cinema-night .top-search input,
body.cinema.cinema-night .search-input,
body.cinema.cinema-night .search-back,
body.cinema.cinema-night .search-submit,
body.cinema.cinema-night .search-input-icon,
body.cinema.cinema-night .search-icon-left {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .mobile-search-input::placeholder,
body.cinema.cinema-night .home-search-input::placeholder,
body.cinema.cinema-night .top-search input::placeholder,
body.cinema.cinema-night .search-input::placeholder {
  color: var(--color-text-3) !important;
  opacity: 1 !important;
}

body.cinema.cinema-night .search-con,
body.cinema.cinema-night .left-box,
body.cinema.cinema-night .local-watch-card,
body.cinema.cinema-night .notice-strip,
body.cinema.cinema-night .hotmovie-con,
body.cinema.cinema-night .mofa-user-history-card,
body.cinema.cinema-night .mofa-user-feature-grid,
body.cinema.cinema-night .mofa-user-share-card {
  background: var(--color-bg-2) !important;
  color: var(--color-text-1) !important;
  box-shadow: none !important;
}

body.cinema.cinema-night .hito-text,
body.cinema.cinema-night .local-watch-card strong,
body.cinema.cinema-night .notice-strip,
body.cinema.cinema-night .card .title,
body.cinema.cinema-night .search-guess-title,
body.cinema.cinema-night .search-guess-grid .search-guess-card .title,
body.cinema.cinema-night .short-list-title,
body.cinema.cinema-night .find-title,
body.cinema.cinema-night .mofa-user-header-title,
body.cinema.cinema-night .mofa-user-history-title,
body.cinema.cinema-night .mofa-history-desktop-title,
body.cinema.cinema-night .mofa-history-mobile-title {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .local-watch-card > span,
body.cinema.cinema-night .notice-strip button,
body.cinema.cinema-night .refresh-btn,
body.cinema.cinema-night .cat-chip,
body.cinema.cinema-night .search-guess-subtitle,
body.cinema.cinema-night .search-guess-tab,
body.cinema.cinema-night .search-guess-refresh,
body.cinema.cinema-night .short-hot-info,
body.cinema.cinema-night .short-load-tip,
body.cinema.cinema-night .short-empty,
body.cinema.cinema-night .find-page .info .sub-title,
body.cinema.cinema-night .mofa-user-view-all,
body.cinema.cinema-night .mofa-user-empty-history p,
body.cinema.cinema-night .mofa-user-feature-item > span:last-child,
body.cinema.cinema-night .mofa-history-desktop-tip {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night .poster,
body.cinema.cinema-night .poster-shell,
body.cinema.cinema-night .short-list-img,
body.cinema.cinema-night .mofa-user-history-cover {
  background: var(--color-bg-3) !important;
}

body.cinema.cinema-night .bottom-tabs {
  background: rgba(35, 35, 36, .92) !important;
  border-color: var(--btm-bk) !important;
  box-shadow: none !important;
  color: var(--color-text-3) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

body.cinema.cinema-night .bottom-tabs .tab {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night .search-topbar {
  background: var(--h5-search) !important;
  border-bottom-color: var(--color-fill-2) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .search-section,
body.cinema.cinema-night .result-bar {
  background: var(--color-bg-1) !important;
  border-color: var(--color-fill-2) !important;
}

body.cinema.cinema-night .search-guess-section {
  background: transparent !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .search-sec-title,
body.cinema.cinema-night .hot-item,
body.cinema.cinema-night .search-resource-title,
body.cinema.cinema-night .search-empty-state strong,
body.cinema.cinema-night .result-summary,
body.cinema.cinema-night .resource-dialog-title,
body.cinema.cinema-night .resource-link-name {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .search-sec-action,
body.cinema.cinema-night .search-sec-extra,
body.cinema.cinema-night .result-count,
body.cinema.cinema-night .search-resource-meta,
body.cinema.cinema-night .search-pan-meta,
body.cinema.cinema-night .search-empty-state,
body.cinema.cinema-night .tree-row,
body.cinema.cinema-night .tree-tip,
body.cinema.cinema-night .mobile-suggestion-status,
body.cinema.cinema-night .resource-modal-loading,
body.cinema.cinema-night .resource-notice-card {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night .history-chip,
body.cinema.cinema-night .guess-cat,
body.cinema.cinema-night .guess-refresh,
body.cinema.cinema-night .hot-rank,
body.cinema.cinema-night .search-guess-tab,
body.cinema.cinema-night .search-guess-refresh {
  background: var(--color-fill-2) !important;
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .mobile-suggestions,
body.cinema.cinema-night .top-suggestions {
  background: var(--color-bg-2) !important;
  border-color: var(--color-fill-2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .24) !important;
}

body.cinema.cinema-night .mobile-suggestion-item,
body.cinema.cinema-night .top-suggestion-item {
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .mobile-suggestion-item:active,
body.cinema.cinema-night .mobile-suggestion-item.active,
body.cinema.cinema-night .top-suggestion-item:hover,
body.cinema.cinema-night .top-suggestion-item.active {
  background: var(--color-fill-2) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .search-resource-card,
body.cinema.cinema-night .resource-link-card,
body.cinema.cinema-night .resource-notice-card,
body.cinema.cinema-night .search-tree-panel,
body.cinema.cinema-night .resource-tree-panel {
  background: var(--color-bg-2) !important;
  border-color: var(--color-fill-2) !important;
  box-shadow: none !important;
}

body.cinema.cinema-night .search-resource-title,
body.cinema.cinema-night .search-tree-head,
body.cinema.cinema-night .resource-tree-head {
  border-color: var(--color-fill-2) !important;
}

body.cinema.cinema-night .resource-modal,
body.cinema.cinema-night .mofa-feedback-overlay,
body.cinema.cinema-night .mofa-history-mask,
body.cinema.cinema-night .mofa-user-share-mask {
  background: var(--color-mask-bg) !important;
}

body.cinema.cinema-night .resource-modal-card,
body.cinema.cinema-night .resource-modal-body,
body.cinema.cinema-night .resource-poster-stage,
body.cinema.cinema-night .resource-dialog-title-block,
body.cinema.cinema-night .mofa-feedback-dialog,
body.cinema.cinema-night .home-announcement-dialog,
body.cinema.cinema-night .mofa-history-desktop-panel,
body.cinema.cinema-night .mofa-history-mobile-page {
  background: var(--color-bg-2) !important;
  border-color: var(--color-fill-2) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .resource-poster-fade {
  background: linear-gradient(180deg, rgba(35, 35, 36, 0) 0%, rgba(35, 35, 36, .58) 58%, var(--color-bg-2) 100%) !important;
}

body.cinema.cinema-night .resource-modal.has-poster .resource-modal-body {
  background: linear-gradient(180deg, rgba(35, 35, 36, 0) 0, rgba(35, 35, 36, 0) 34px, var(--color-bg-2) 34px, var(--color-bg-2) 100%) !important;
}

body.cinema.cinema-night .resource-modal-close,
body.cinema.cinema-night .resource-modal-copy,
body.cinema.cinema-night .search-tree-btn,
body.cinema.cinema-night .resource-dialog-tree-toggle {
  background: var(--color-bg-3) !important;
  border-color: var(--color-fill-3) !important;
  color: var(--color-text-2) !important;
  box-shadow: none !important;
}

body.cinema.cinema-night .mofa-feedback-field > span:first-child,
body.cinema.cinema-night .home-announcement-content,
body.cinema.cinema-night .mofa-history-desktop-panel,
body.cinema.cinema-night .mofa-history-mobile-page {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .mofa-feedback-field textarea,
body.cinema.cinema-night .mofa-feedback-field input {
  background: var(--color-bg-1) !important;
  border-color: var(--color-bg-4) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .mofa-feedback-field textarea::placeholder,
body.cinema.cinema-night .mofa-feedback-field input::placeholder {
  color: var(--color-text-4) !important;
}

body.cinema.cinema-night .home-announcement-content .notice-content,
body.cinema.cinema-night .mofa-user-share-card > p {
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .mofa-history-desktop-item,
body.cinema.cinema-night .mofa-history-mobile-item {
  background: var(--color-bg-3) !important;
  border-color: var(--color-fill-2) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .mofa-history-mobile-nav,
body.cinema.cinema-night .mofa-history-mobile-select {
  background: var(--color-bg-2) !important;
  border-color: var(--color-fill-2) !important;
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .home-bottom-loader-inner,
body.cinema.cinema-night .search-toast,
body.cinema.cinema-night .search-status-line,
body.cinema.cinema-night .mofa-message {
  background: var(--color-bg-3) !important;
  color: var(--color-text-2) !important;
  border-color: var(--color-fill-2) !important;
  box-shadow: none !important;
}

body.cinema.cinema-night .mofa-sidedbar-inner {
  background: var(--side-bg) !important;
  border-color: var(--btm-bk) !important;
  color: var(--color-text-1) !important;
  box-shadow: none !important;
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
}

body.cinema.cinema-night .mofa-side-action,
body.cinema.cinema-night .back-top,
body.cinema.cinema-night .mofa-sidedbar #backTopBtn {
  background: var(--color-bg-2) !important;
  border-color: var(--btm-bk) !important;
  color: var(--color-text-1) !important;
  box-shadow: none !important;
}

body.cinema.cinema-night #shortPanel .loader line {
  stroke: var(--color-text-2) !important;
}

body.cinema.cinema-night #shortPanel .short-list-img {
  background: var(--color-bg-3) !important;
}

body.cinema.cinema-night #shortPanel .short-list-title {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night #shortPanel .short-hot-info,
body.cinema.cinema-night #shortPanel .short-load-tip,
body.cinema.cinema-night #shortPanel .short-empty {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night #minePanel .mofa-user-action-btn,
body.cinema.cinema-night #minePanel .mofa-user-header-title,
body.cinema.cinema-night #minePanel .mofa-user-history-title {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night #minePanel .mofa-user-view-all,
body.cinema.cinema-night #minePanel .mofa-user-empty-history p,
body.cinema.cinema-night #minePanel .mofa-user-feature-item > span:last-child {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night #minePanel .mofa-user-history-card,
body.cinema.cinema-night #minePanel .mofa-user-feature-grid {
  background: var(--color-bg-2) !important;
}

@media only screen and (max-width: 768px) {
  body.cinema.cinema-night .custom-search-input {
    background: var(--tm-bg) !important;
  }

  body.cinema.cinema-night:not(.nav-stuck) .menu-top {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.cinema.cinema-night .mofa-sidedbar-inner {
    background: transparent !important;
  }
}

/* Final source-level parity corrections shared by light and dark modes. */
html ::-webkit-scrollbar,
html *::-webkit-scrollbar,
body.cinema ::-webkit-scrollbar,
body.cinema *::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.cinema #minePanel .mofa-user-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.cinema .mofa-user-share-card > p {
  line-height: 18.4px !important;
}

body.cinema .mofa-history-mask,
body.cinema.cinema-night .mofa-history-mask {
  background: transparent !important;
}

body.cinema .search-guess-section {
  margin: -35px 0 16px !important;
}

body.cinema .mofa-feedback-overlay {
  z-index: 99999 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.cinema .mofa-feedback-dialog {
  width: 300px !important;
  padding: 30px 20px !important;
  border-radius: 20px !important;
  background: var(--color-bg-3) !important;
  box-shadow: none !important;
}

body.cinema .mofa-feedback-field > span:first-child {
  margin: 0 0 12px 5px !important;
  color: var(--color-text-1) !important;
  font-size: 16px !important;
}

body.cinema .mofa-feedback-overlay.open,
body.cinema .mofa-feedback-overlay.closing,
body.cinema .mofa-feedback-overlay.open .mofa-feedback-dialog,
body.cinema .mofa-feedback-overlay.closing .mofa-feedback-dialog {
  animation-duration: .4s !important;
}

body.cinema .home-announcement-overlay {
  z-index: 9999 !important;
}

body.cinema.cinema-night .notice-strip {
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .refresh-btn {
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .cat-chip {
  color: var(--color-text-3) !important;
}

body.cinema.cinema-night .cat-chip.active {
  color: #fff !important;
}

body.cinema.cinema-night .bottom-tabs {
  background: var(--bg-1) !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media only screen and (max-width: 768px) {
  body.cinema .mofa-feedback-dialog {
    width: 70% !important;
  }
}

/* Final component parity: SearchResult and History source values. */
body.cinema .search-page .search-input-wrap.search-input-container {
  background: var(--tm-bg) !important;
  box-shadow: none !important;
}

body.cinema .search-page .search-input-wrap.search-input-container .search-input {
  flex: 0 1 auto !important;
  width: 80% !important;
}

body.cinema .mofa-history-shell.mobile-mode .mofa-history-mobile-page {
  background: var(--color-bg-1) !important;
}

body.cinema .mofa-history-mobile-nav,
body.cinema .mofa-history-mobile-select {
  background: var(--bg-1) !important;
}

body.cinema .mofa-history-home-button {
  padding-right: 15px !important;
  padding-left: 15px !important;
}

/* HotMovie uses an unframed loading/error area; the generic .empty card is not used here. */
body.cinema .hotmovie-con > #message.empty {
  width: 100% !important;
  min-height: 180px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--color-text-3) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
}

/* The source layout is framed on desktop and unframed on phones. */
@media only screen and (min-width: 769px) {
  body.cinema.cinema-night .hotmovie-con {
    box-shadow: var(--shadow) !important;
  }
}

@media only screen and (max-width: 768px) {
  body.cinema .hotmovie-con,
  body.cinema.cinema-night .hotmovie-con {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* Search page dark palette. These selectors match the component rules that
   otherwise keep their light-theme literal colors. */
body.cinema.cinema-night .search-page,
body.cinema.cinema-night .search-page .search-body,
body.cinema.cinema-night .search-page .search-section {
  background: var(--color-bg-1) !important;
}

body.cinema.cinema-night .search-page .search-back.back-btn,
body.cinema.cinema-night .search-page .search-submit.search-btn,
body.cinema.cinema-night .search-page .search-input,
body.cinema.cinema-night .search-page .search-input-icon,
body.cinema.cinema-night .search-page .search-input-icon .search-icon-left,
body.cinema.cinema-night .search-page .history-title,
body.cinema.cinema-night .search-page .hot-search-title {
  color: var(--color-text-1) !important;
}

body.cinema.cinema-night .search-page .search-input::placeholder,
body.cinema.cinema-night .search-page .clear-history,
body.cinema.cinema-night .search-page .history-empty,
body.cinema.cinema-night .search-page .hot-search-subtitle {
  color: var(--color-text-3) !important;
  opacity: 1 !important;
}

body.cinema.cinema-night .search-page .hot-search-grid .hot-item {
  color: var(--color-text-2) !important;
}

body.cinema.cinema-night .search-page .history-icon {
  color: #637dff !important;
}

/* Search landing page parity with the target SearchResult component. */
body.cinema .search-page .search-history-hidden {
  display: none !important;
}

body.cinema .search-page .history-icon path {
  vector-effect: none !important;
}

body.cinema .search-page .history-chip {
  padding: 6px 14px !important;
  border: 1px solid transparent !important;
  border-radius: 30px !important;
  background: var(--color-bg-2) !important;
  color: var(--color-text-2) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  transition: all .25s ease !important;
}

body.cinema .search-page .hot-search.hot-search-section {
  margin: 0 0 24px !important;
  padding: 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(255, 107, 53, .1) 0%, rgba(255, 179, 71, .03) 20%, transparent 100%) !important;
}

body.cinema .search-page .hot-search-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-top: -5px !important;
  padding-top: 5px !important;
}

body.cinema .search-page .hot-card {
  gap: 14px !important;
  padding: 10px 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
}

body.cinema .search-page .hot-name {
  color: var(--color-text-2) !important;
}

body.cinema .search-page .hot-rank-badge.rank-normal .hot-rank {
  background: var(--color-fill-3) !important;
  color: var(--color-text-3) !important;
}

body.cinema .search-page .search-guess-section {
  padding: 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(99, 125, 255, .08) 0%, transparent 10%) !important;
}

body.cinema .search-page .search-guess-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-height: 32px !important;
  margin-bottom: 16px !important;
}

body.cinema .search-page .search-guess-tabs {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  gap: 8px !important;
  min-width: 0 !important;
  min-height: 32px !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.cinema .search-page .search-guess-tab {
  height: 32.1px !important;
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: transparent !important;
  color: var(--color-text-3) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 16.1px !important;
}

body.cinema .search-page .search-guess-tab.active {
  background: #165dff !important;
  color: #fff !important;
  font-weight: 700 !important;
}

body.cinema .search-page .search-guess-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 71px !important;
  width: 71px !important;
  height: 28px !important;
}

body.cinema .search-page .search-guess-refresh {
  flex: 0 0 71px !important;
  width: 71px !important;
  min-width: 71px !important;
  height: 28px !important;
  padding: 6px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-text-2) !important;
  font-size: 14px !important;
  line-height: 16.1px !important;
}

body.cinema .search-page .search-guess-refresh > svg {
  width: 16px !important;
  height: 16px !important;
}

body.cinema .search-page .search-guess-refresh > span {
  margin: 0 2px 0 5px !important;
  font-size: 12px !important;
  line-height: 13.8px !important;
}

body.cinema .search-page .search-guess-grid {
  grid-template-columns: repeat(3, 31%) !important;
  justify-content: space-between !important;
  gap: 0 !important;
}

@media only screen and (min-width: 769px) {
  body.cinema .search-page .search-guess-section {
    display: none !important;
  }
}

/* Preview/search landing aliases kept in sync with the target GuessLike block. */
body.cinema .search-page .guess-like-section {
  padding: 16px !important;
  margin: -35px 16px 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(99, 125, 255, .08) 0%, transparent 10%) !important;
}

body.cinema .search-page .guess-like-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

body.cinema .search-page .guess-like-title-wrapper,
body.cinema .search-page .guess-like-title-text {
  display: flex !important;
  align-items: center !important;
}

body.cinema .search-page .guess-like-title-wrapper { gap: 12px !important; }
body.cinema .search-page .guess-like-title-text { gap: 8px !important; }
body.cinema .search-page .guess-like-icon-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; }
body.cinema .search-page .guess-like-icon { display: block !important; width: 20px !important; height: 20px !important; color: #637dff !important; }
body.cinema .search-page .guess-like-title { color: var(--color-text-1) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 19.55px !important; }
body.cinema .search-page .guess-like-subtitle { color: var(--color-text-3) !important; font-size: 12px !important; line-height: 13.8px !important; }
body.cinema .search-page .guess-like-refresh { display: inline-flex !important; align-items: center !important; gap: 5px !important; height: 28px !important; padding: 6px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--color-text-2) !important; font-size: 12px !important; line-height: 13.8px !important; }
body.cinema .search-page .guess-like-refresh svg { width: 16px !important; height: 16px !important; }
body.cinema .search-page .guess-like-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px !important; }
body.cinema .search-page .guess-like-card { min-width: 0 !important; overflow: hidden !important; }
body.cinema .search-page .guess-like-poster { position: relative !important; overflow: hidden !important; aspect-ratio: 3 / 4 !important; border-radius: 8px !important; background: var(--color-bg-3) !important; }
body.cinema .search-page .guess-like-poster img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
body.cinema .search-page .guess-like-tag { position: absolute !important; top: 0 !important; left: 0 !important; padding: 4px !important; border-radius: 5px 0 !important; background: #703cff !important; color: #fff !important; font-size: 10px !important; line-height: 12px !important; }
body.cinema .search-page .guess-like-card-title { margin: 4px 0 0 !important; overflow: hidden !important; color: var(--color-text-1) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 16.1px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }

/* Result surface parity: the target uses a centered 800px desktop column and
   a transparent three-column poster rail on phones. */
body.cinema .search-page .search-result { width: 800px !important; max-width: 100% !important; margin: 0 auto !important; background: var(--color-bg-1) !important; }
body.cinema .search-page .result-pan-tabs { display: flex !important; align-items: center !important; gap: 0 !important; padding: 6px !important; border-radius: 12px !important; background: var(--color-bg-3) !important; box-shadow: var(--shadow) !important; }
body.cinema .search-page .result-pan-tab { position: relative !important; min-height: 40px !important; padding: 10px 20px !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--color-text-3) !important; font-size: 14px !important; font-weight: 400 !important; }
body.cinema .search-page .result-pan-tab.active { border-bottom-color: transparent !important; border-radius: 12px !important; background: #165dff !important; color: #fff !important; font-weight: 700 !important; }

@media only screen and (max-width: 768px) {
  body.cinema .search-page .guess-like-section { display: block !important; }
  body.cinema .search-page .guess-like-grid { grid-template-columns: repeat(3, 31%) !important; justify-content: space-between !important; gap: 0 !important; }
  body.cinema .search-page .search-result { width: 100% !important; min-height: 100vh !important; background: var(--color-bg-1) !important; }
  body.cinema .search-page .result-bar { position: static !important; padding: 86px 16px 0 !important; margin: 0 !important; background: transparent !important; border-bottom: 0 !important; }
  body.cinema .search-page .search-submit,
  body.cinema .search-page .search-back { border: 0 !important; outline: 0 !important; box-shadow: none !important; }
  body.cinema .search-page .result-summary { flex-direction: column !important; justify-content: flex-start !important; gap: 12px !important; min-height: 98px !important; padding: 14px 0 0 !important; color: var(--color-text-1) !important; text-align: center !important; }
  body.cinema .search-page .result-summary > * { display: none !important; }
  body.cinema .search-page .result-summary::before { content: "搜索结果" !important; position: static !important; display: block !important; width: auto !important; height: auto !important; border-radius: 0 !important; background: transparent !important; color: var(--color-text-1) !important; font-size: 30px !important; font-weight: 700 !important; line-height: 34.5px !important; }
  body.cinema .search-page .result-summary::after { content: "博文天下，遍理人间!" !important; display: block !important; color: var(--color-text-3) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 16.1px !important; }
  body.cinema .search-page .result-pan-tabs { height: 40px !important; margin: 6px -16px 0 !important; padding: 6px 16px !important; overflow-x: auto !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; }
  body.cinema .search-page .result-pan-tab { flex: 0 0 auto !important; min-height: 28px !important; padding: 6px 12px !important; margin-right: 8px !important; border: 0 !important; border-radius: 25px !important; background: var(--tm-bg) !important; color: var(--color-text-2) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 16.1px !important; }
  body.cinema .search-page .result-pan-tab.active { border-radius: 25px !important; background: var(--color-bg-2) !important; color: #703cff !important; font-weight: 500 !important; }
  body.cinema .search-page .result-pan-tab.active::after { content: "" !important; position: absolute !important; right: auto !important; bottom: -5px !important; left: 50% !important; width: 0 !important; height: 0 !important; border-right: 6px solid transparent !important; border-bottom: 0 !important; border-left: 6px solid transparent !important; border-top: 6px solid var(--color-bg-2) !important; border-radius: 0 !important; background: transparent !important; transform: translateX(-50%) !important; }
  body.cinema .search-page .search-result-list { width: auto !important; margin: 0 16px !important; padding: 18px 0 18px !important; gap: 12px !important; background: transparent !important; }
  body.cinema .search-page .search-list { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; width: auto !important; margin: 0 28px !important; padding: 12px 0 18px !important; background: transparent !important; }
  body.cinema .search-page .search-list-item { width: calc((100% - 16px) / 3) !important; overflow: hidden !important; border-radius: 8px !important; background: transparent !important; box-shadow: none !important; }
  body.cinema .search-page .search-list-item .list-img { width: 100% !important; aspect-ratio: 3 / 4 !important; overflow: hidden !important; border-radius: 8px !important; }
  body.cinema .search-page .search-list-item .list-bom { padding: 4px 0 4px 2px !important; }
  body.cinema .search-page .search-list-item .list-title p { font-size: 14px !important; font-weight: 500 !important; line-height: 16.1px !important; }
  body.cinema .search-page .search-list-item .list-actor p { margin-top: 4px !important; color: var(--color-text-2) !important; font-size: 12px !important; line-height: 13.8px !important; }
}

@media only screen and (min-width: 769px) {
  body.cinema .search-page .search-list { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 24px !important; width: 100% !important; padding: 12px !important; }
  body.cinema .search-page .search-list-item { width: 22% !important; overflow: hidden !important; border-radius: var(--fillet) !important; background: var(--color-bg-3) !important; box-shadow: var(--shadow) !important; }
}

body.cinema.cinema-night .search-page .search-topbar,
body.cinema.cinema-night .search-page .search-body { background: var(--color-bg-1) !important; }
body.cinema.cinema-night .search-page .search-input-wrap { background: rgba(50, 51, 53, .5) !important; }
body.cinema.cinema-night .search-page .guess-like-card-title { color: var(--color-text-1) !important; }