/*<meta name="theme-color" content="#FF5C9A">*/

:root{
  --pink-0:#FFF0F5;
  --pink-1:#FFE3EE;
  --pink-2:#FFD1E4;
  --pink-3:#FFB6D4;
  --pink-4:#FF8FBF;
  --pink-5:#FF5C9A;
  --pink-6:#E83A7D;

  --ink-0:#111317;
  --ink-1:#1B1F2A;
  --ink-2:#2A2F3A;
  --ink-3:#3A4050;

  --muted:#5A6172;
  --muted-2:#7A8296;

  --card:#FFF7FB;
  --panel:#FFEAF3;
  --border:rgba(17,19,23,.14);
  --border-soft:rgba(17,19,23,.10);

  --shadow:0 10px 28px rgba(17,19,23,.14);
  --shadow-2:0 6px 18px rgba(17,19,23,.10);

  --radius:14px;
  --radius-2:10px;

  --focus:0 0 0 .22rem rgba(255,92,154,.28);
}

html,body{
  margin:0;
  padding:0;
  overflow-x:hidden;
  background:linear-gradient(180deg,var(--pink-2) 0%,var(--pink-1) 38%,var(--pink-0) 100%) !important;
  color:var(--ink-0);
  font-family:Arial,sans-serif;
}

body{
  margin:0;
  padding:0;
  background:linear-gradient(180deg,var(--pink-2) 0%,var(--pink-1) 38%,var(--pink-0) 100%) !important;
  color:var(--ink-0);
}

a{
  text-decoration:none;
  color:var(--ink-1);
}

a:hover{
  color:var(--pink-6);
}

.text-muted{
  color:var(--muted) !important;
}

.text-dark{
  color:var(--ink-0) !important;
}

.bg-light{
  background:rgba(255,227,238,.88) !important;
}

header{
  background:linear-gradient(90deg,var(--pink-5) 0%,var(--pink-4) 50%,var(--pink-5) 100%) !important;
  color:#fff;
  padding:10px 20px;
  box-shadow:0 10px 22px rgba(17,19,23,.16);
}

header nav ul{
  list-style-type:none;
  margin:0;
  padding:0;
}

header nav ul li{
  display:inline;
  margin-right:15px;
}

header nav ul li a{
  color:#fff;
  text-decoration:none;
}

header nav ul li a:hover{
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.08);
}

footer{
  text-align:center;
  padding:10px 0;
  background:rgba(255,227,238,.95);
  color:var(--ink-2);
  margin-top:20px;
  border-top:1px solid var(--border-soft);
}

.navbar{
  box-shadow:0 6px 16px rgba(17,19,23,.12);
  background:linear-gradient(90deg,var(--pink-5),var(--pink-4)) !important;
  border-bottom:1px solid rgba(255,255,255,.22);
}

.navbar-brand,
.navbar-brand:hover{
  color:#fff !important;
}

.navbar a,
.navbar .nav-link{
  color:rgba(255,255,255,.92) !important;
}

.navbar a:hover,
.navbar .nav-link:hover{
  color:#fff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.10);
}

.navbar-toggler{
  border-color:rgba(255,255,255,.55) !important;
}

.navbar-toggler-icon{
  filter:invert(1);
}

.navbar-brand img{
  margin-right:10px;
}

.navbar-nav .dropdown-menu{
  border-radius:12px;
  background:var(--card) !important;
  border:1px solid var(--border);
  box-shadow:var(--shadow-2);
}

.navbar-nav .dropdown-item{
  transition:background-color 0.25s ease;
  color:var(--ink-1) !important;
}

.navbar-nav .dropdown-item:hover{
  background:rgba(255,92,154,.14) !important;
  color:var(--ink-0) !important;
}

.form-control{
  border-radius:25px;
  padding:0.5rem 1rem;
  background:rgba(255,255,255,.85) !important;
  color:var(--ink-0) !important;
  border:1px solid rgba(232,58,125,.28) !important;
}

.form-control::placeholder{
  color:rgba(27,31,42,.55) !important;
}

.form-control:focus{
  border-color:rgba(232,58,125,.60) !important;
  box-shadow:var(--focus) !important;
}

.btn-outline-primary{
  border-radius:25px;
  padding:0.5rem 1rem;
  border-color:rgba(255,255,255,.75) !important;
  color:#fff !important;
  background:rgba(255,255,255,.12) !important;
}

.btn-outline-primary:hover{
  background:rgba(255,255,255,.20) !important;
  border-color:rgba(255,255,255,.88) !important;
  color:#fff !important;
}

.input-diy{
  width:75%;
}

.form-diy{
  justify-content:center;
}

.ul-diy{
  width:50%;
}

.no-static{
  position:absolute !important;
}

.video-section{
  margin-bottom:2rem;
  background:rgba(255,234,243,.92) !important;
  border:1px solid rgba(232,58,125,.16);
  border-radius:var(--radius);
  padding:14px 14px 8px;
  box-shadow:var(--shadow);
}

.section-title{
  font-weight:bold;
  font-size:1.25rem;
  color:var(--ink-0);
}

.card{
  box-shadow:0 6px 18px rgba(17,19,23,.10);
  transition:transform 0.2s ease, box-shadow 0.2s ease;
  background:var(--card) !important;
  border:1px solid rgba(232,58,125,.14) !important;
  border-radius:var(--radius) !important;
}

.card:hover{
  transform:scale(1.03);
  box-shadow:0 14px 30px rgba(17,19,23,.16);
}

.card-body{
  color:var(--ink-0);
}

.container{
  max-width:1200px;
}

.card-img-top{
  height:200px;
  object-fit:cover;
  width:100%;
  border-top-left-radius:var(--radius);
  border-top-right-radius:var(--radius);
  filter:contrast(1.04) saturate(1.04);
}

@media (max-width: 768px) {
  .card-img-top {
    height: 120px;
  }
}

.card-title{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  line-height:1.5;
  margin-bottom:0;
  color:var(--ink-0);
}

.card{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:100%;
}

a{
  text-decoration:none;
  color:var(--ink-1);
}

a:hover .card{
  transform:scale(1.02);
  box-shadow:0 14px 30px rgba(17,19,23,.16);
}

.card-title{
  margin-bottom:0;
}

.badge{
  position:absolute;
  top:10px;
  left:10px;
  background:linear-gradient(90deg,var(--pink-6),var(--pink-5)) !important;
  color:#fff;
  padding:5px 10px;
  border-radius:8px;
  font-size:12px;
  font-weight:bold;
  box-shadow:0 8px 18px rgba(232,58,125,.20);
}

.pagination{
  flex-wrap:wrap;
}

.pagination .page-item{
  margin:2px;
}

.pagination .page-item .page-link{
  color:var(--ink-1);
  border-radius:10px;
  padding:8px 12px;
  background:rgba(255,247,251,.92);
  border:1px solid rgba(232,58,125,.18);
}

.pagination .page-item .page-link:hover{
  background:rgba(255,209,228,.75);
  border-color:rgba(232,58,125,.30);
  color:var(--ink-0);
}

.pagination .page-item.active .page-link{
  background:linear-gradient(90deg,var(--pink-6),var(--pink-5));
  color:#fff;
  border:none;
  box-shadow:0 10px 20px rgba(232,58,125,.22);
}

.pagination .page-item.disabled .page-link{
  color:rgba(27,31,42,.45);
  pointer-events:none;
  cursor:not-allowed;
  background:rgba(255,247,251,.65);
}

.video-player{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0;
  overflow:hidden;
  border-radius:var(--radius);
}

.responsive-iframe{
  display:block;
  width:100%;
  height:400px;
  border:none;
  overflow:hidden;
  margin:0;
  padding:0;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  background:rgba(255,247,251,.95);
}

@media (min-width: 992px) {
  .responsive-iframe {
    height: 600px;
  }
}

@media (max-width: 768px) {
  .responsive-iframe {
    height: 245px;
  }
}

.marquee-container{
  position:fixed;
  bottom:0;
  width:100%;
  background:linear-gradient(90deg,rgba(255,92,154,.92),rgba(255,143,191,.92));
  color:#fff;
  overflow:hidden;
  white-space:nowrap;
  border-top:1px solid rgba(255,255,255,.28);
  padding:5px 0;
  z-index:999;
  box-shadow:0 -10px 22px rgba(17,19,23,.14);
}

.marquee{
  display:inline-block;
  will-change:transform;
  animation:scroll-left 29s linear infinite;
}

@keyframes scroll-left{
  from{ transform: translateX(110%); }
  to{ transform: translateX(-110%); }
}

.marquee:hover{
  animation-play-state:paused;
}

.marquee a{
  margin-right:50px;
  font-size:16px;
  font-weight:bold;
  color:#fff;
  text-decoration:none;
  transition:opacity 0.3s;
}

.marquee a:hover{
  opacity:.85;
}

footer{
  padding-bottom:36px;
}

.nimad{
  width:100%;
  display:flex;
  justify-content:center;
  margin:1px 0;
}

.nimad a{
  display:block;
}

.abcdHF{
  width:1200px;
  height:60px;
}

.abcdHF1{
  width:1200px;
  height:120px;
}

@media (max-width: 768px) {
  .abcdHF {
    height: 40px;
    width: 100vw;
  }
  .abcdHF1 {
    height: 80px;
    width: 100vw;
  }
}

.bba-container{
  max-width:1200px;
  margin:auto;
  display:block;
  box-sizing:border-box;
}

@media screen and (max-width: 750px) {
  .menu {
    margin: 0px 0 0;
    border-radius: 0;
    padding: 0;
    width: 100%;
  }
}

.menu-wrap dl{
  margin:auto;
  display:block;
  float:left;
  width:100%;
  padding:15px 0;
  background:rgba(255,234,243,.95);
  border:1px solid rgba(232,58,125,.14);
  border-radius:var(--radius);
  box-shadow:var(--shadow-2);
}

.menu-wrap dt{
  width:8%;
  font-size:20px;
  color:var(--ink-0);
}

.menu-wrap dt, .menu-wrap dd{
  float:left;
  line-height:40px;
  text-align:center;
}

@media screen and (max-width: 750px) {
  .menu dt {
    width: 14%;
    line-height: 70px;
    font-size: 14px;
  }
}

.menu-wrap dd{
  width:11.5%;
  font-size:16px;
}

@media screen and (max-width: 750px) {
  .menu-wrap dl {
    padding: 10px 0;
  }
}

.menu dl:first-child{
  border-top:0;
}

.menu-wrap dt a{
  background:linear-gradient(90deg,rgba(255,92,154,.22),rgba(255,143,191,.22));
  padding:5px 10px;
  border-radius:12px;
  color:var(--ink-0);
  font-size:16px;
  border:1px solid rgba(232,58,125,.20);
}

.menu-wrap dt a:hover{
  background:linear-gradient(90deg,rgba(255,92,154,.30),rgba(255,143,191,.30));
  color:var(--ink-0);
}

.menu-wrap dd a{
  color:var(--ink-1);
}

.menu-wrap dd a:hover{
  color:var(--pink-6);
}

.menu-wrap::after{
  content:"";
  display:table;
  clear:both;
}

@-webkit-keyframes hue{
  from{
    -webkit-filter: hue-rotate(0deg);
    -moz-filter: hue-rotate(0deg)
  }
  to{
    -webkit-filter: hue-rotate(-360deg);
    -moz-filter: hue-rotate(-360deg)
  }
}

.bba-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(66px, 1fr));
  gap:4px;
  max-width:1200px;
  margin:2px auto;
  padding:8px;
  background:rgba(255,209,228,.55);
  border:1px solid rgba(232,58,125,.16);
  border-radius:var(--radius-2);
  box-shadow:var(--shadow-2);
}

@media screen and (max-width: 750px) {
  .menu-wrap dd {
    width: 21%;
    line-height: 30px;
    font-size: 12px;
  }
  .bba-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(55px, 1fr));
    gap: 4px;
    max-width: 85%;
    margin: 2px 0;
    padding: 8px;
    background: rgba(255,209,228,.45);
    border: 1px solid rgba(232,58,125,.14);
    border-radius: var(--radius-2);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0);
  }
}

.bba-item{
  margin:2px;
  text-align:center;
  border-radius:12px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background:rgba(255,247,251,.80);
  border:1px solid rgba(232,58,125,.10);
}

.bba-item:hover{
  transform:translateY(-5px);
  box-shadow:0 12px 22px rgba(17,19,23,.12);
}

.bba-item img{
  width:80%;
  object-fit:contain;
  border-radius:12px;
  max-width:80px;
  filter:contrast(1.02) saturate(1.02);
}

.bba-item div{
  font-size:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:bold;
  color:var(--pink-6);
  background-image:-webkit-linear-gradient(92deg, var(--pink-6), var(--pink-5));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-animation:hue 10s infinite linear;
}

@media (max-width: 768px) {
  .bba-item img {
    width: 100%;
  }
}

#ppap{
  position:relative;
  z-index:9999;
}

.ppap{
  position:fixed;
  z-index:9999;
  cursor:pointer;
  transition:transform 0.3s ease;
  filter:drop-shadow(0 10px 20px rgba(17,19,23,.18));
}

.ppap:hover{
  transform:scale(1.1);
}

.ppap.zuo1{ top:20%; right:1%; }
.ppap.zuo2{ top:30%; right:1%; }
.ppap.zuo3{ top:40%; right:1%; }
.ppap.zuo4{ top:50%; right:1%; }
.ppap.zuo5{ top:60%; right:1%; }
.ppap.zuo6{ top:70%; right:1%; }
.ppap.xia1{ top:88%; left:5%; }
.ppap.xia2{ top:88%; left:29%; }
.ppap.xia3{ top:88%; left:53%; }
.ppap.xia4{ top:88%; left:78%; }

.ppap img{
  width:60px;
  height:60px;
  border-radius:14px;
  border:2px solid rgba(255,255,255,.75);
  background:rgba(255,247,251,.95);
}

.btn,
button,
input[type="button"],
input[type="submit"]{
  outline:none;
}

.btn:focus,
button:focus,
input:focus,
textarea:focus,
select:focus{
  box-shadow:var(--focus);
}

.video-section a{
  color:var(--ink-1);
}

.video-section a:hover{
  color:var(--pink-6);
}

.card .btn,
.card button{
  border-radius:12px;
}

.card .btn-primary,
.btn-primary{
  background:linear-gradient(90deg,var(--pink-6),var(--pink-5)) !important;
  border:none !important;
  color:#fff !important;
  box-shadow:0 10px 20px rgba(232,58,125,.20);
}

.card .btn-primary:hover,
.btn-primary:hover{
  filter:brightness(1.02);
}

.badge.bg-primary{
  background:linear-gradient(90deg,var(--pink-6),var(--pink-5)) !important;
}

.navbar .btn-outline-primary{
  border-color:rgba(255,255,255,.78) !important;
  color:#fff !important;
}

.navbar .form-control{
  border-color:rgba(255,255,255,.55) !important;
}

.navbar .form-control:focus{
  border-color:rgba(255,255,255,.78) !important;
  box-shadow:0 0 0 .2rem rgba(255,255,255,.22) !important;
}

.page-link:focus{
  box-shadow:var(--focus) !important;
}

.container,
.container-fluid,
.row{
  background:transparent !important;
}

.bg-white,
.bg-body,
.bg-body-tertiary{
  background:transparent !important;
}

.card,
.video-section,
.menu-wrap dl,
.bba-grid{
  color:var(--ink-0);
}

.card p,
.video-section p{
  color:var(--ink-1);
}

.card small,
small{
  color:var(--muted);
}

hr{
  border-color:rgba(17,19,23,.12);
}

table{
  color:var(--ink-0);
}

thead th{
  color:var(--ink-0);
}

tbody td{
  color:var(--ink-1);
}

.alert{
  border-radius:var(--radius);
}

.alert-primary{
  background:rgba(255,92,154,.12);
  border:1px solid rgba(232,58,125,.20);
  color:var(--ink-0);
}

.alert-secondary{
  background:rgba(255,227,238,.75);
  border:1px solid rgba(17,19,23,.10);
  color:var(--ink-0);
}

.modal-content{
  background:var(--card);
  border:1px solid rgba(232,58,125,.16);
  border-radius:var(--radius);
}

.dropdown-divider{
  border-top:1px solid rgba(17,19,23,.10);
}

.list-group-item{
  background:rgba(255,247,251,.92);
  border:1px solid rgba(17,19,23,.10);
  color:var(--ink-0);
}

.list-group-item:hover{
  background:rgba(255,227,238,.75);
}

input[type="text"],
input[type="number"],
input[type="search"],
textarea{
  color:var(--ink-0);
}

::-webkit-scrollbar{
  width:10px;
  height:10px;
}

::-webkit-scrollbar-track{
  background:rgba(255,227,238,.75);
}

::-webkit-scrollbar-thumb{
  background:rgba(232,58,125,.35);
  border-radius:20px;
  border:2px solid rgba(255,227,238,.75);
}

::-webkit-scrollbar-thumb:hover{
  background:rgba(232,58,125,.50);
}

@media (max-width: 768px){
  .video-section{
    padding:12px 12px 8px;
  }
  .navbar{
    box-shadow:0 6px 16px rgba(17,19,23,.12);
  }
  .menu-wrap dl{
    border-radius:12px;
  }
}

@media (prefers-reduced-motion: reduce){
  .card,
  .bba-item,
  .ppap{
    transition:none !important;
  }
  .marquee{
    animation:none !important;
  }
}

.card,
.stui-vodlist__thumb,
.vodlist__thumb,
.thumb,
.thumb-wrap,
.video-thumb,
.poster,
.pic,
.cover,
.imgbox{
  position: relative !important;
  overflow: hidden !important;
  border-radius: 14px;
}

.badge,
.pic-text,
.play,
.tag,
.label,
.corner,
.mark,
.vod-tag,
.stui-vodlist__thumb .pic-text,
.stui-vodlist__thumb .play{
  position: absolute !important;
  z-index: 999 !important;
  top: 10px;
  left: 10px;
  pointer-events: none;
}

.stui-vodlist__thumb img,
.vodlist__thumb img,
.card-img-top,
.thumb img,
.poster img,
.cover img{
  position: relative !important;
  z-index: 1 !important;
  display: block;
}
