@charset "utf-8";

/* =========================================================
   Reset & Base
   ========================================================= */
html, body { width: 100%; height: 100%; padding-bottom: 0 !important; overflow-x: hidden; }
html { scrollbar-gutter: stable; }
@supports not (scrollbar-gutter: stable) { html { overflow-y: scroll; } }

body {
  margin: 0;
  font-family: "Microsoft YaHei","微软雅黑","STHeiti","WenQuanYi Micro Hei",SimSun,sans-serif;
  font-size: 14px; line-height: 1.4;
  background-color: #000; color: #fff;
  /* 顶/底固定广告占位，确保主内容不被遮挡 */
  padding-top: 80px; padding-bottom: 125px;
}

ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, table, td, img, tr { margin: 0; padding: 0; font-weight: normal; }
input, select { font-size: 12px; vertical-align: middle; border: none; }
ul, li { list-style: none; }
img { border: 0 none; }
p { margin: 0 0 10px; }
*, *::before, *::after { box-sizing: border-box; }

/* 滚动条 */
::-webkit-scrollbar { width: 4px; background-color: #0f0f0f; }
::-webkit-scrollbar-thumb { background-color: #008000; border-radius: 2px; transition: background-color .2s ease; }
::-webkit-scrollbar-thumb:hover { background-color: #008000; }

/* ===================== Typography & Utils ===================== */
h1 { font-size: 22px; line-height: 28px; }
h2 { font-size: 20px; line-height: 26px; }
h3 { font-size: 18px; line-height: 24px; }
h4 { font-size: 16px; line-height: 22px; }
h5 { font-size: 14px; line-height: 20px; }
h6 { font-size: 12px; line-height: 18px; }
h1, h2, h3, h4, h5, h6 { font-weight: 400; margin: 10px 0; }

a, button { text-decoration: none; color: #fff; outline: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
button:hover { cursor: pointer; }
a:focus, a:hover, a:active { text-decoration: none; color: #008000; }

.icon { font-size: 16px; overflow: hidden; }
.font-16 { font-size: 16px; }
.font-14 { font-size: 14px; }
.font-12 { font-size: 12px; }
.text-red { color: red; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.pull-right { margin-top: 2px; float: right !important; }
.hide { display: none !important; }
.visible-xs { display: none; }
.text-overflow { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===================== Grid & Helpers ===================== */
.container { position: relative; padding: 0 15px; margin: 0 auto; }
.row { position: relative; margin: 0 -15px; }
.container::before, .container::after,
.row::before, .row::after,
.clearfix::before, .clearfix::after { display: table; content: " "; clear: both; }

/* ===================== Common Widgets ===================== */
.pic-text { display:block; width:100%; position:absolute; bottom:0; left:0; padding:5px 10px; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-image:linear-gradient(transparent, rgba(0,0,0,.5)); color:#fff; }
.pic-tag { position:absolute; top:0; right:0; z-index:99; padding:2px 8px; font-size:12px; border-radius:0 0 0 8px; background-color:#FF9900; color:#fff; }
.play-bg { display:none; }
.stui-pannel, .stui-foot { margin-bottom:0; }

input, textarea { outline:none; -webkit-tap-highlight-color:transparent; }
input.form-control, input.btn { outline:0; -webkit-appearance:none; }
input[type="checkbox"] { vertical-align:-2px; }

.form-control { display:block; width:100%; height:35px; padding:0 10px; font-size:12px; line-height:20px; border-radius:4px; transition:border-color .15s ease-in-out, box-shadow .15s ease-in-out; background:#000; color:#e5e7eb; }
textarea.form-control { height:auto; }

/* ===================== Header（基础/旧布局兼容） ===================== */
.stui-header { margin: 5px 0 4px; }
.stui-header__logo, .stui-header__menu { float: left; margin-left: 10px; }
.stui-header__logo .logo { display:block; width:150px; height:50px; background:url(../images/logo1.png) no-repeat center/cover; }
.stui_header__user { float:right; margin-top:15px; margin-right:10px; }
.stui_header__user > li { position:relative; float:left; padding-bottom:10px; margin-left:30px; }
.stui_header__user > li > a { color:#fff; }
.stui_header__user > li > a:hover { color:#008000; }
.stui_header__user > li > a .iconfont { font-size:22px; }
.stui_header__user > li > span { font-size:24px; color:#fff; }

/* ===== 新布局：作用域 .ios26，避免影响旧布局 ===== */
.stui-header.ios26 { position: sticky; top: 0; z-index: 999; background:#000; border-bottom:1px solid rgba(255,255,255,.10); }
.stui-header.ios26 .container { padding: 6px 10px; }
.stui-header.ios26 .row { display:flex; align-items:center; flex-wrap:wrap; gap:6px 0; }
.stui-header.ios26 .stui_header__user { margin-left:auto; display:flex; align-items:center; gap:8px; }
.stui-header.ios26 .stui_header__user .btn-search { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; border:1px solid rgba(255,255,255,.12); background:#008000; color:#e5e7eb; box-shadow:0 4px 12px rgba(0,0,0,.25); }
.stui-header.ios26 .stui_header__user .btn-search .iconfont { font-size:18px; line-height:1; }

.search-wrap { display:flex; align-items:center; gap:8px; flex-shrink:1; }
.search-inline { position:relative; overflow:hidden; display:inline-flex; align-items:center; height:36px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:#000; box-shadow:0 6px 14px rgba(0,0,0,.22); width:0; opacity:0; pointer-events:none; transition:width .25s ease, opacity .2s ease; }
.search-inline .form-control { width:100%; height:34px; padding:0 12px; border:0; outline:0; background:#000; color:#e5e7eb; font-size:14px; min-width:0; }

/* 合并后的菜单样式 */
.stui-header__menu { margin-left:16px; display:flex; align-items:center; gap:6px; float:none !important; background-color:#222; padding:6px 14px; border-radius:50px; }
.stui-header__menu li { float:none; }
.stui-header__menu li a { position:relative; display:inline-flex; align-items:center; justify-content:center; height:36px; line-height:36px; padding:0 18px; border-radius:999px; background:linear-gradient(90deg,#006400,#00a000); border:1px solid rgba(255,255,255,.12); color:#e5e7eb; white-space:nowrap; box-shadow:0 6px 14px rgba(0,0,0,.22); font-size:13px; transition:background .3s ease, transform .2s ease, border-color .15s ease; }
.stui-header__menu li a:hover, .stui-header__menu li.active a { border-color:rgba(255,255,255,.28); background:linear-gradient(90deg,#00a000,#00ff00); color:#fff; transform:translateY(-2px); }
.stui-header__menu li.active a::before { content:""; position:absolute; left:25%; bottom:-10px; width:50%; height:3px; background-color:#00ff00; border-radius:2px; }

/* 搜索框宽度变量 */
:root { --search-w-pc: clamp(78px, 36vw, 138px); --search-w-m: min(78vw, 138px); }

@media (min-width: 1025px) {
  .stui-header__logo { order: 1; }
  .stui-header__menu { order: 2; margin-left: 16px; }
  .stui-header.ios26 .stui_header__user { order: 3; margin-left: auto; }
  .search-wrap.open .search-inline { width: var(--search-w-pc); opacity: 1; pointer-events: auto; }
  .stui-header.ios26 .row, .stui-header__menu, .stui-header.ios26 .stui_header__user { align-items: center; }
  .stui-header.ios26 .stui_header__user .btn-search, .search-wrap .search-inline { transform: translateY(4px); }
}

@media (max-width: 1024px) {
  .stui-header.ios26 .container { padding-left: 6px; padding-right: 6px; }
  .stui-header.ios26 .stui_header__user { order: 2; margin-left: auto; }
  .stui-header__menu { order: 3; width: 100%; margin: 0; padding: 0; display: flex; align-items: center; gap: 0; overflow-x: auto; overflow-y: hidden; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; position: relative; --nav-arrow-w: 0px; --nav-arrow-gap: 8px; }
  .stui-header__menu::-webkit-scrollbar { display: none; }
  .stui-header__menu li:first-child { margin-left: calc(var(--nav-arrow-w) + var(--nav-arrow-gap)); }
  .stui-header__menu li:last-child { margin-right: calc(var(--nav-arrow-w) + var(--nav-arrow-gap)); }
  .stui-header__menu::before, .stui-header__menu::after { content: ""; position: sticky; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; width: var(--nav-arrow-w); pointer-events: none; z-index: 1; opacity: 0; visibility: hidden; }
  .stui-header__menu::before { left: 0; background: linear-gradient(to right, rgba(0,0,0,.85), rgba(0,0,0,0)); }
  .stui-header__menu::after { right: 0; background: linear-gradient(to left, rgba(0,0,0,.85), rgba(0,0,0,0)); }
  .stui-header__menu.can-left::before, .stui-header__menu.can-right::after { opacity: .85; visibility: visible; }
  .search-wrap.open .search-inline { width: var(--search-w-m); opacity: 1; pointer-events: auto; }
}

/* ===================== Header Logo（品牌 + 官网徽章） ===================== */
.stui-header__logo { display:flex; align-items:center; gap:14px; margin-left: 10px; }
.stui-header__logo .logo-brand { display:inline-flex; align-items:center; gap:12px; padding: 4px 10px; border-radius:10px; text-decoration:none; line-height:1; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); color:#fff; transition: transform .15s ease, border-color .15s ease, box-shadow .2s ease; }
.stui-header__logo .logo-brand:hover { transform: translateY(-1px); border-color: rgba(255,255,255,.22); box-shadow: 0 8px 18px rgba(0,0,0,.26); }
.stui-header__logo .brand-icon { width: 60px; height: 60px; flex: 0 0 auto; display:block; object-fit:contain; }
.stui-header__logo .brand-text { font-size:22px; font-weight:800; letter-spacing:.5px; color:#fff; text-shadow:0 2px 4px rgba(0,0,0,.5); }

.stui-header__logo .logo-official { display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; line-height:1; text-decoration:none; background:linear-gradient(90deg,#006400,#00a000); color:#fff; border:1px solid rgba(255,255,255,.16); transition: transform .15s ease, filter .15s ease; }
.stui-header__logo .logo-official:hover { transform: translateY(-1px); filter: brightness(1.05); }
.stui-header__logo .logo-official .tag { opacity:.95; font-size:18px; }
.stui-header__logo .logo-official .host { font-size:18px; font-weight:800; letter-spacing:.4px; }

@media (max-width: 768px) {
  .stui-header__logo { gap: 15px; }
  .stui-header__logo .logo-brand { gap: 10px; }
  .stui-header__logo .brand-icon { width: 40px; height: 40px; }
  .stui-header__logo .brand-text { font-size: 18px; }
  .stui-header__logo .logo-official { padding: 6px 10px; gap: 6px; }
  .stui-header__logo .logo-official .host { font-size: 16px; }
}

/* ===================== Theme Vars & Card ===================== */
:root { --vod-radius: 12px; --vod-border: rgba(255,255,255,.12); --vod-surface: rgba(255,255,255,.06); --vod-text: #fff; --vod-text-dim: rgba(255,255,255,.8); }
.stui-vodlist__box { position: relative; border-radius: var(--vod-radius); overflow: hidden; background: var(--vod-surface); border: 1px solid var(--vod-border); transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease; content-visibility: auto; contain-intrinsic-size: auto; }
.stui-vodlist__box:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0,0,0,.28); border-color: rgba(255,255,255,.18); }

.stui-vodlist__thumb { position: relative; display:block; width:100%; padding-top:56.25%; overflow:hidden; background:#111 center/cover no-repeat; border-bottom:1px solid rgba(255,255,255,.12); border-top-left-radius: 12px; border-top-right-radius: 12px; }
.stui-vodlist__thumb::before { content: ""; position: absolute; inset: 0; background: url(../images/load.gif) center no-repeat; transition: opacity .2s ease; pointer-events: none; }
.stui-vodlist__thumb[style*="background-image"]::before { opacity: 0; visibility: hidden; }
.stui-vodlist__thumb .play { position:absolute; inset:0; background: radial-gradient(ellipse at center, rgba(255,255,255,.08), rgba(0,0,0,.18)); opacity:0; transition:opacity .2s ease; }
.stui-vodlist__box:hover .stui-vodlist__thumb .play { opacity: 1; }
.stui-vodlist__thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

@supports (aspect-ratio: 16 / 9) {
  .stui-vodlist__thumb{ aspect-ratio: 16 / 9; padding-top: 0; }
}

.stui-vodlist__detail { margin:0; padding:10px 10px 12px; background-color:transparent; }
.stui-vodlist__detail .title { font-size:14px; font-weight:600; margin:0; text-align:center; color:#fff; line-height:1.4; }
.stui-vodlist__detail .title a { color: inherit; }
.stui-vodlist__detail .text { margin-bottom:0; font-size:12px; color: rgba(255,255,255,.8); }

/* 海报上的信息胶囊 */
.meta-pills { position:absolute; left:6px; right:6px; bottom:4px; display:flex; justify-content:space-between; align-items:center; pointer-events:none; }
.meta-pills .pill { pointer-events:auto; display:inline-flex; align-items:center; gap:6px; padding:0 4px; margin:0; border:0; background:transparent; color:#fff; font-size:12px; line-height:1; white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,.6); }
.meta-pills .pill svg { width:16px; height:16px; stroke:currentColor; opacity:.95; filter: drop-shadow(0 1px 1px rgba(0,0,0,.45)); }

@media (max-width: 768px) {
  .meta-pills { left:6px; right:6px; bottom:2px; }
  .meta-pills .pill { font-size:11px; gap:4px; padding:0 3px; }
  .meta-pills .pill svg { width:14px; height:14px; }
  .stui-vodlist__detail { padding:8px 8px 10px; }
}

/* ===================== Content / Lists ===================== */
.stui-screen { padding: 10px; }
.stui-screen .head { padding: 15px; border-radius: 2px; background-color: #000; }
.stui-screen .head .text, .stui-screen .head .all { color: #fff; }
.stui-screen .head a { color: #fff; }
.stui-screen .item { display: block; background-color: #000; }
.stui-screen .item ul { padding: 15px; border-top: 1px solid #eee; }
.stui-screen .item ul li { float: left; }
.stui-screen .item ul li a { display: inline-block; padding-left: 20px; color: #fff; }
.stui-screen .item ul li.active a, .stui-screen .item ul li a:hover { color: #008000; }

.stui-vodlist__head { margin-top: 0; padding: 0 10px; }
.stui-vodlist__head h3, .stui-vodlist__head h3 a { color: #fff; }
.stui-vodlist__head p { padding-left: 20px; }
.stui-vodlist__head p a { display: inline-block; margin-right: 20px; }

.stui-vodlist li { float:left; padding:10px; width:25%; }
.stui-vodlist li.index { width:33.333333%; }
.stui-vodlist li.like { width:50%; padding:5px; }
.stui-vodlist li.topic { width:25%; }

/* 详情页左右布局 */
.stui-content { padding: 10px; }
.stui-content__detail, .stui-content__thumb, .stui-content__side { display: table-cell; vertical-align: top; }
.stui-content__thumb .pic { display: block; width: 220px; }
.stui-content__thumb .pic img { max-width: 100%; }
.stui-content__side { width: 280px; padding: 50px 30px; text-align: center; background-color: #eee; }
.stui-content__detail { width: 100%; padding: 20px; background-color: #fff; color: #333; }
.stui-content__detail .title { margin: 0 0 10px; font-size: 18px; color: #333; }
.stui-content__detail .data { margin-bottom: 10px; }
.stui-content__detail .desc { padding-left: 42px; line-height: 25px; }
.stui-content__detail .desc .left { margin-left: -42px; }
.stui-content__detail .play-btn { padding-left: 42px; margin-top: 20px; }
.stui-content__detail .play-btn a { display: inline-block; padding: 6px 25px; border-radius: 5px; background-color: #008000; font-size: 12px; color: #fff; }

/* 播放器与播放列表 */
.stui-player { position: relative; z-index: 2; padding: 10px; }
.stui-player__video { background-color: #000; }
.stui-player__left { position: relative; float: left; width: 100%; }
.stui-player__side { position: relative; float: left; width: 25%; background-color: #333; }
.stui-player__side .tab { padding: 15px; border-bottom: 1px solid #434145; }
.stui-player__side .tab li { float: left; padding-right: 20px; }
.stui-player__side .tab li a { position: relative; font-size: 16px; color: #fff; }
.stui-player__side .tab li.active a::before { content: " "; position: absolute; left: 25%; bottom: -15px; width: 50%; height: 2px; background-color: #008000; }
.stui-player__side .tab li.active a { color: #008000; }
.stui-player__side .item { display: none; position: relative; padding: 15px 10px; }
.stui-player__side .item.active { display: block; }
.stui-player__side .item .head { position: relative; padding-bottom: 10px; }
.stui-player__side .item .head h3 { margin: 0; color: #fff; }
.stui-player__side .item .head .switch-line { margin-top: 5px; }
.stui-player__side .item .tab-top { display: none; position: absolute; z-index: 999; top: 100%; right: 0; padding: 10px 15px; border-radius: 2px; background-color: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.stui-player__side .item .tab-top::after { content: " "; width: 10px; height: 10px; transform: rotate(-45deg); position: absolute; top: -5px; right: 15px; background-color: #fff; }
.stui-player__side .item .tab-top li { line-height: 25px; border-bottom: 1px solid #eee; text-align: center; }
.stui-player__side .item .tab-top li:last-child { border-bottom: 0; }
.stui-player__side .item .tab-top li a { font-size: 12px; }
.stui-player__side .item .tab-top li a:hover { color: #ff6600; }
.stui-player__side .item .cont { display: none; }
.stui-player__side .item .cont.active { display: block; }
.stui-player__detail { padding: 20px; background-color: #1c1b1e; }
.stui-player__detail .title { margin: 0 0 10px; font-size: 18px; color: #fff; }
.stui-player__detail .more { float: right; padding-top: 10px; }
.stui-player__detail .more a { display: inline-block; padding: 6px 15px; margin-left: 10px; border-radius: 2px; background-color: #252527; color: #fff; }
.stui-player__detail .more a:hover { color: #008000; }
.stui-player__detail .data { color: #fff; }
.stui-player__detail .data-more { padding-top: 10px; }
.stui-play__list li { float: left; width: 33.333333%; padding: 5px; }
.stui-play__list li.down { float: none; width: 100%; }
.stui-play__list li a { display: block; padding: 5px; border-radius: 2px; text-align: center; background-color: #1c1b1e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; }
.stui-play__list li a:hover { color: #008000; }
.stui-play__list li.active a { background-color: #008000; color: #fff; }

/* ===================== Pagination / Friends / Embed / GBook ===================== */
.stui-page__item { margin: 20px 0; }
.stui-page__item li { display: inline-block; padding: 0 5px; }
.stui-page__item li a { display: inline-block; padding: 6px 15px; border-radius: 4px; background-color: #f5f5f5; color: #333; }
.stui-page__item li.active a, .stui-page__item li.active span { background-color: #008000; color: #fff; }
.stui-page__item li a:hover { color: #008000; }
.stui-page__item li.num { display: none; }
.stui-page__all a { position: absolute; top: 50%; margin-top: -40px; display: block; width: 80px; height: 80px; text-align: center; line-height: 80px; }
.stui-page__all a .iconfont { font-size: 50px; color: #fff; }
.stui-page__all a:hover .iconfont { color: #008000; }
.stui-page__all a.left { left: 0; }
.stui-page__all a.right { right: 0; }
.stui-link__text { margin: 20px 0; text-align: center; }
.stui-link__text li { display: inline-block; margin-right: 20px; margin-bottom: 10px; }

.embed-responsive { position: relative; display: block; overflow: hidden; padding: 0; height: 0; }
.embed-responsive .embed-responsive-item, .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video { position:absolute; top:0; bottom:0; left:0; width:100%; height:100%; border:0; }
.embed-responsive-16by9 { padding-bottom: 56.25%; }
.embed-responsive-4by3 { padding-bottom: 75%; }

.stui-gbook { padding: 10px; }
.stui-gbook-form { padding-bottom: 20px; }
.stui-gbook-form .form-control { width: 100%; padding: 10px; border: 1px solid #333; border-radius: 4px; background: #000; color: #e5e7eb; }
.stui-gbook-form textarea.form-control { height: auto; }
.stui-gbook-form li { margin-top: 15px; }
.stui-gbook-form li:first-child { margin-top: 0; }
.stui-gbook-form li .submit { padding: 0 25px; height: 35px; line-height: 35px; border: 0; border-radius: 4px; cursor: pointer; background-color: #008000; color: #fff; }
.stui-gbook__item { padding: 10px 0; border-top: 1px dotted #333; }
.stui-gbook__item .name { color: #fff; }
.stui-gbook__item .cont { position: relative; margin: 10px 0; padding: 20px; border-radius: 2px; background-color: #1c1b1e; }
.stui-gbook__item .cont::before { content: " "; width: 10px; height: 10px; transform: rotate(-45deg); border-width: 1px 1px 0 0; position: absolute; top: -5px; left: 10px; border-style: solid; background-color: #1c1b1e; border-color: #1c1b1e; }
.stui-gbook__item .cont p { margin: 10px 0 0; }

/* ===================== Footer & Spacing ===================== */
.stui-foot { margin-bottom: 0 !important; padding-bottom: calc(var(--foot-gap, 0) + env(safe-area-inset-bottom, 0px)) !important; }
.stui-foot *:last-child { margin-bottom: 0 !important; }
.stui-foot .container, .stui-foot .foot-card { margin-bottom: 0 !important; }

/* ===================== Theme Color Vars (footer/glass/FAB) ===================== */
:root { --pink-from:#008000; --pink-to:#008000; --pink-ring:#008000; --glass-top:#008000; --glass-bot:#008000; --foot-meta-max:780px; --foot-meta-pad:16px; --foot-meta-radius:16px; }
.stui-foot .foot-card { padding: var(--foot-meta-pad); border-radius: var(--foot-meta-radius); border: 1px solid rgba(255,255,255,0.18); background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.05)); }
.stui-foot .foot-grid { display: block; }
.stui-foot .foot-col + .foot-col { margin-top: 12px; }
@media (min-width: 992px) {
  .stui-foot .foot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 32px; align-items: start; }
  .stui-foot .foot-col + .foot-col { margin-top: 0; }
}
.stui-foot .foot-col { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; }
.stui-foot h4 { margin: 0 0 6px; font-weight: 600; }
.stui-foot p { margin: 0 0 8px; line-height: 1.65; }
.stui-foot .meta-wrap { max-width: var(--foot-meta-max); margin: 12px auto 0; }
.stui-foot .meta-box { border-radius: var(--foot-meta-radius); border: 1px solid rgba(255,255,255,0.18); background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.05)); padding: var(--foot-meta-pad); }
.stui-foot .meta-row { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 992px) {
  .stui-foot .meta-row { grid-template-columns: 1fr 1fr; gap: 12px; }
  .stui-foot .meta-row.meta-asym-7-5 { grid-template-columns: 7fr 5fr; }
  .stui-foot .meta-row.meta-asym-6-4 { grid-template-columns: 6fr 4fr; }
}

/* ===================== FAB ===================== */
.fab { position: fixed; right: max(12px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 10px; z-index: 2147483647; pointer-events: auto; }
.fab .fab-btn { pointer-events: auto; height: 44px; min-width: 56px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9999px; border: 1px solid rgba(255,255,255,0.18); background: linear-gradient(180deg, var(--glass-top), var(--glass-bot)); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 6px 18px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.35); color: #fff; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease, background .15s ease, opacity .2s ease, filter .15s ease; }
.fab .fab-btn svg { width: 20px; height: 20px; stroke: currentColor; }
.fab .fab-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.45); }
.fab .fab-btn:active { transform: translateY(0); box-shadow: 0 4px 12px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.35); }
.fab .fab-btn.home { background: linear-gradient(180deg, var(--pink-from), var(--pink-to)); border-color: var(--pink-ring); box-shadow: 0 10px 26px rgba(255,80,170,0.35), inset 0 1px 0 rgba(255,255,255,0.45); }
.fab .fab-btn.to-top { background: linear-gradient(180deg, rgba(255,96,178,0.28), rgba(255,96,178,0.12)), linear-gradient(180deg, var(--glass-top), var(--glass-bot)); border-color: var(--pink-ring); box-shadow: 0 8px 22px rgba(255,80,170,0.25), inset 0 1px 0 rgba(255,255,255,0.40); }
.fab .to-top { opacity: 1; visibility: visible; transform: translateY(0); }
@media (prefers-color-scheme: dark) {
  .fab .fab-btn { border-color: rgba(255,255,255,0.18); background: linear-gradient(180deg, rgba(40,40,40,0.65), rgba(30,30,30,0.55)); }
  .fab .fab-btn.home { background: linear-gradient(180deg, var(--pink-from), var(--pink-to)); border-color: var(--pink-ring); }
  .fab .fab-btn.to-top { background: linear-gradient(180deg, rgba(255,96,178,0.24), rgba(255,96,178,0.10)), linear-gradient(180deg, rgba(40,40,40,0.65), rgba(30,30,30,0.55)); border-color: var(--pink-ring); }
}
@media (max-width: 420px) { .fab { gap: 8px; } .fab .fab-btn { height: 40px; min-width: 52px; padding: 0 12px; } .fab .fab-btn svg { width: 18px; height: 18px; } }
@media (prefers-reduced-motion: reduce) { .fab .fab-btn { transition: none; } }

/* ===================== Ads & Icon Grid ===================== */
.tp_advertising { width: 100%; display: flex; justify-content: space-around; background: #fff; position: relative; box-shadow: 0 0 5px rgba(0,0,0,.2); border: .2px solid #000; }
.tp_advertising p { color: rgba(255,255,255,0); font-size: 13px; line-height: 22px; background: #6F8EC5; position: absolute; bottom: 3px; right: 3px; margin: 3px; padding: 3px 8px; border-top-left-radius: 10px; opacity: .3; }
.list2 a, .list3 a, .list4 a { display:block; width:100%; margin:2px 0; }
.list3 a { margin:1px 0; }
.list4 a { margin:3px 0; }
.list2 a img, .list3 a img, .list4 a img { width:100%; max-width:100%; height:60px; object-fit:cover; }
.list4 a img { height:80px; }
.div_text { width:100%; display:flex; flex-wrap:wrap; justify-content:space-around; align-items:center; margin-bottom:1px; }
.div_text a { flex:1; height:35px; text-align:center; line-height:33px; color:#fff; font-size:14px; text-decoration:none; margin:0 1px; border-radius:8px; }

.icon ul { padding:0; margin:0; }
.icon ul li { float:left; width:25%; text-align:center; }
.icon ul li a { font-size:14px; color:#fff; text-decoration:none; }
.icon ul li a:hover { color:#fff; }
.icon ul li img { margin:0 auto; padding:2px; width:70px; height:70px; border-radius:15px; object-fit:cover; }
.icon ul li img:hover { background-color:#e37189; }

@media (min-width: 961px) { .icon ul li { width: 12.5%; } }
@media (max-width: 960px) {
  .icon ul li { width: 25%; }
  .txtguanggao a { width:24.3%; float:left; border-radius:3px; line-height:33px; height:33px; text-align:center; font-size:14px; color:#fff; display:inline-block; background-color: rgb(255,153,159); margin:1px; transition-duration:.3s; }
}

.div_img > a, .mbads1 > a { border-radius: 8px; overflow: hidden; }
.div_img img, .mbads1 img { border-radius: inherit; }

/* 顶/底广告容器（配合 body 的内边距占位） */
.mbads { position: fixed; bottom: 0; left: 0; right: 0; text-align: center; z-index: 9999; }
.mbads1 { position: fixed; top: 0; left: 0; right: 0; text-align: center; z-index: 10010; }
.mbads1 img { width: 1170px; height: 80px; }

@media (max-width: 720px) {
  body { padding-top: 80px; padding-bottom: 0; }
  .mbads img { width: 100%; height: 0; }
  .mbads1 img { width: 100%; height: 80px; }
  .mbads1 { display: block; }
}

/* ===================== Top badge / links ===================== */
@keyframes gradient-flow { 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }
.top_text { position: relative; display: grid; grid-template-columns: max-content 1fr; align-items: center; column-gap: 16px; padding: 12px 14px 10px; }
.top_text::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, #008000 0%, #e24aa2 100%); opacity: .95; }
.top_text__badge { background: linear-gradient(90deg, #00FFFF, #008000, #00FFFF); background-size: 300% 100%; animation: gradient-flow 4s ease infinite; color: #800080; border-radius: 12px; padding: 6px 10px; font-weight: 600; font-size: 16px; display: inline-flex; align-items: center; justify-content: center; line-height: 1.1; white-space: nowrap; text-align: center; }
.top_text__badge i { font-style: normal; display: inline; }
.top_text__links { width: 100%; min-width: 0; display: grid; text-align: center; column-gap: clamp(16px, 4vw, 80px); }
.top_text__links a { background: linear-gradient(180deg, #00FFFF 0%, #008000 100%); text-decoration: none; border-radius: 18px; line-height: 1; padding: 6px 0; transition: transform .18s ease, opacity .18s ease; }
.top_text__links a:hover { transform: translateY(-1px); opacity: .9; }
@media (min-width: 992px) {
  .top_text__links { grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: clamp(10px, 2.5vw, 60px); justify-items: center; }
  .top_text__links a { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:6px 4px; max-width:100%; min-width:0; white-space:nowrap; word-break:keep-all; overflow:hidden; text-overflow:clip; font-size: clamp(14px, 1.05vw, 18px); line-height: 1.05; }
  .top_text__links a:nth-child(n+9) { display: none; }
}
@media (min-width: 769px) and (max-width: 991px) {
  .top_text__links { grid-template-columns: repeat(4, 1fr); row-gap: 12px; }
  .top_text__links a { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:6px 4px; font-size: clamp(13px, 1.8vw, 16px); line-height: 1.05; }
  .top_text__links a:nth-child(n+9) { display: none; }
}
@media (max-width: 768px) {
  .top_text { padding-left: 12px; padding-right: 12px; column-gap: 12px; }
  .top_text__badge { flex-direction: column; gap: 4px; white-space: normal; line-height: 1.12; font-size: 15px; padding: 7px 9px; }
  .top_text__badge i { display: block; }
  .top_text__links { grid-template-columns: repeat(4, 1fr); column-gap: 10px; row-gap: 10px; }
  .top_text__links a { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:6px 4px; font-size: clamp(12px, 3.8vw, 15px); line-height: 1.05; }
  .top_text__links a:nth-child(n+9) { display: none; }
}
@media (max-width: 360px) { .top_text__badge { font-size: 14px; } .top_text__links a { font-size: 13.5px; } }
.top_text__links a .ico { flex: 0 0 auto; }
.top_text__links a .txt { flex: 1 1 auto; min-width: 0; }

/* ===================== Responsive Breakpoints ===================== */
@media (min-width: 768px) { .container { width: 750px; } }
@media (min-width: 992px) { .container { width: 920px; } }
@media (min-width: 1200px) { .container { width: 1170px; } }
@media (max-width: 1200px) { .stui-page__all, .stui-content__side { display: none; } }

@media (max-width: 1024px) {
  .stui-header { margin-top: 2px; }
  .stui-header__menu { display: none; } /* 旧布局在窄屏隐藏；新布局在下方统一强制显示 */
  .stui-screen .item ul { white-space: nowrap; overflow-y: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .stui-screen .item ul li { float: none; display: inline-block; margin-bottom: 0; }
  .stui-screen .item ul li a { padding-left: 10px; }
  .stui-vodlist li { width: 25%; }
  .stui-vodlist li.index { width: 50%; }
  .stui-vodlist li.topic { width: 50%; }
  .stui-player__left { float: none; width: 100%; }
  .stui-player__side { float: none; width: 100%; background-color: #333; }
  .stui-player__detail .more a.menu-switch { display: none; }
  .stui-player__detail .title { margin: 0 0 5px; }
  #play-box .item { min-height: 200px; }
  .stui-play__list li { width: 20%; }
}

@media (max-width: 767px) {
  .visible-xs { display: inline-block; }
  .stui-pannel__bd { padding: 0; }
  .play-bg { display: none; }
  .stui-header { margin-bottom: 2px; }
  .stui-header__logo .logo { width: 100px; height: 50px; background: url(../images/logo.png) no-repeat center/cover; }
  .stui_header__user { float: right; margin-top: 15px; margin-right: 10px; }
  .stui_header__user > li { float: left; padding-bottom: 10px; margin-left: 15px; }
  .stui_header__user > li > a .iconfont { font-size: 22px; }
  .stui_header__user > li > span { font-size: 18px; color: #fff; }
  .stui-header.play { margin: 10px 10px 0; padding: 10px; background-color: #000; }
  .stui-header.play .stui_header__user { margin-right: 0; }
  .dropdown.search, .dropdown.type { right: -60px; }
  .dropdown.search::after, .dropdown.type::after { right: 65px; }
  .stui-screen { padding: 5px; }
  .stui-screen .head { padding: 10px; }
  .stui-screen .head .all { display: none; }
  .stui-screen .item ul { padding: 10px; }
  .stui-vodlist li { padding: 5px; width: 50%; }
  .stui-vodlist li.index { width: 100%; }
  .stui-vodlist li.like { width: 33.333333%; }
  .stui-vodlist__detail { padding: 5px 10px; }
  .stui-vodlist__detail.index .title { margin-bottom: 5px; }
  .stui-vodlist__head p { display: none; }
  .stui-content { padding: 0 5px; }
  .stui-content__detail, .stui-content__thumb { display: block; }
  .stui-content__thumb { display: none; }
  .stui-content__detail { padding: 20px 10px; }
  .stui-player { padding: 0 5px; }
  .stui-player__detail { padding: 10px; }
  .stui-player__detail .more { float: none; margin: -10px -10px 10px; padding-bottom: 10px; text-align: center; background-color: #333; }
  .stui-player__detail .more a { margin-left: 0; margin-right: 10px; }
  .stui-play__list li { width: 33.333%; }
  .stui-content__playlist { padding-right: 5px; }
  .stui-content__playlist li { width: 25%; margin: 0; padding-top: 10px; padding-left: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .stui-content__playlist li a { display: block; text-align: center; padding: 6px 0; }
  .stui-page__item li { display: block; float: left; width: 20%; margin: 0; padding: 0; }
  .stui-page__item li.num { display: block; }
  .stui-gbook { padding: 10px; }
  .stui-gbook__item .cont { padding: 10px; }
  .hidden-xs { display: none !important; }
}

/* ===================== Badge ===================== */
.in-badge { position:relative; display:inline-flex; align-items:center; justify-content:center; padding:.25rem .8rem; border-radius:999px; background:linear-gradient(180deg,#19c37d,#0ea764); color:#fff; font-weight:700; font-size:.875rem; line-height:1; white-space:nowrap; box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 2px 6px rgba(0,0,0,.18); isolation:isolate; }

.stui-vodlist::after { content:""; display:block; clear:both; }

/* ===================== 统一的 Mobile Header（合并去重，保持功能一致） ===================== */
@media (max-width:1024px){
  :root{ --adH: 80px; --row1: 50px; --row2: 44px; --searchW: 138px; }

  /* 顶部广告固定 */
  .mbads1{ position: fixed !important; top: env(safe-area-inset-top) !important; left: 0; right: 0; z-index: 10010 !important; }

  /* 头部固定在广告下方，两行布局 */
  .stui-header.ios26{ position: fixed !important; top: calc(var(--adH) + env(safe-area-inset-top)) !important; left: 0; right: 0; z-index: 10005 !important; background: #000 !important; border-bottom: 1px solid rgba(255,255,255,.12) !important; margin: 0 !important; }
  .stui-header.ios26 .container{ padding: 0 8px !important; }
  .stui-header.ios26 .row{ display:flex !important; align-items:center !important; flex-wrap: wrap !important; gap: 0 8px !important; margin:0 !important; overflow: visible !important; }

  /* 第1行：Logo + 放大镜 */
  .stui-header__logo{ order:1 !important; flex:1 1 auto !important; min-width:0 !important; height: var(--row1) !important; display:flex !important; align-items:center !important; gap:10px !important; margin:0 !important; padding:0 !important; overflow: visible !important; }
  .stui-header__logo .logo{ display:inline-block !important; width:110px !important; height:40px !important; background:url(../images/logo1.png) center/contain no-repeat !important; }
  .stui-header__logo .brand-icon{ width:40px !important; height:40px !important; object-fit:contain !important; }

  .stui-header.ios26 .stui_header__user{ order:2 !important; flex:0 0 auto !important; height: var(--row1) !important; margin-left:auto !important; display:flex !important; align-items:center !important; gap:8px !important; overflow: visible !important; }
  .stui-header.ios26 .stui_header__user .btn-search{ display:inline-flex !important; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; border:1px solid rgba(255,255,255,.15) !important; background:#008000 !important; color:#fff !important; z-index:10020 !important; }

  /* 搜索框：默认收起，打开 .open 展开 */
  .search-inline{ width:0 !important; opacity:0 !important; pointer-events:none !important; }
  .search-wrap.open .search-inline{ width:min(78vw, var(--searchW)) !important; opacity:1 !important; pointer-events:auto !important; }

  /* 第2行：菜单（整行 + 横向滚动） */
  .stui-header__menu{ order:3 !important; flex:0 0 100% !important; height: var(--row2) !important; display:flex !important; align-items:center !important; gap:6px !important; margin:-2px 0 0 0 !important; padding:6px 10px !important; background:#111 !important; border-radius: 999px !important; white-space:nowrap !important; overflow-x:auto !important; overflow-y:hidden !important; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; touch-action:pan-x; scrollbar-width:none; position:relative; z-index:10004; }
  .stui-header__menu::-webkit-scrollbar{ display:none; }
  .stui-header__menu li{ display:inline-block !important; float:none !important; margin:0 4px !important; }
  .stui-header__menu li a{ display:inline-flex !important; align-items:center !important; justify-content:center !important; height:36px !important; line-height:36px !important; padding:0 14px !important; border-radius:20px !important; background:linear-gradient(90deg,#006400,#00a000) !important; border:1px solid rgba(255,255,255,.12) !important; color:#fff !important; font-size:14px !important; box-shadow: 0 6px 14px rgba(0,0,0,.22); }
  .stui-header__menu li a:hover, .stui-header__menu li.active a{ background:linear-gradient(90deg,#00a000,#00ff00) !important; color:#fff !important; }

  /* 旧头部的菜单仍隐藏，避免冲突 */
  .stui-header:not(.ios26) .stui-header__menu{ display:none !important; }

  /* 主体让出“广告 + 两行头部”的空间 */
  body{ padding-top: calc(var(--adH) + env(safe-area-inset-top) + var(--row1) + var(--row2)) !important; }

  /* 内容层级兜底（内容 < 头部 < 广告） */
  body, .container, .row, .stui-pannel, .tp_advertising{ position: relative; z-index: 1; }
  .stui-header{ z-index: 10005 !important; }
}
/* —— 搜索常驻展开 —— */
.stui-header.ios26 .search-wrap { display:flex; align-items:center; gap:8px; }

/* 默认就当作 .open 状态处理 */
.stui-header.ios26 .search-inline {
  width: var(--search-w-pc);
  opacity: 1;
  pointer-events: auto;
}

/* PC 微调：按钮与输入垂直对齐 */
@media (min-width:1025px) {
  .stui-header.ios26 .stui_header__user .btn-search { transform:none; }
}

/* 手机端同样常驻展开，并用移动端宽度变量 */
@media (max-width:1024px) {
  .stui-header.ios26 .search-inline{
    width: var(--search-w-m) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

/* 输入框宽度自适应（避免被菜单挤压） */
.stui-header.ios26 .search-inline .form-control{
  min-width: 0;
}
/* 手机端：再给正文多让出一点高度，防止被头部压住 */
@media (max-width:1024px){
  :root{
    /* 这三个是你现在用的值，如果你已定义过就不用重复 */
    --adH: 80px;   /* 顶部广告高度 */
    --row1: 48px;  /* 行1：logo/搜索区域高度 */
    --row2: 42px;  /* 行2：绿色菜单高度 */

    /* 新增一个余量，解决被盖住的那一点点 */
    --headGap: 16px;   /* 可按效果改成 8~16px */
  }

  /* 让正文从“广告 + 头部”正下方开始，多加一点余量 */
  body{
    padding-top: calc(var(--adH) + var(--row1) + var(--row2) + var(--headGap)) !important;
  }

  /* 防止头部自身产生额外外边距把布局顶高 */
  .stui-header.ios26{ margin:0 !important; }
  .stui-header__menu{ margin:0 !important; }
}
/* ——让头部永远单行—— */
.stui-header.ios26 .row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;                 /* 关键：不换行 */
}

/* 菜单条：单行 + 不换行 + 横向滚动（窄屏时） */
.stui-header__menu{
  flex:1 1 auto;                    /* 占据剩余空间 */
  display:flex;
  align-items:center;
  flex-wrap:nowrap;                 /* 不换行 */
  white-space:nowrap;               /* 不换行 */
  overflow-x:auto; overflow-y:hidden;
  scrollbar-width:none;
}
.stui-header__menu::-webkit-scrollbar{ display:none; }
.stui-header__menu li{ flex:0 0 auto; }  /* 每个按钮不被压缩 */

/* 搜索区放在最右，不参与换行 */
.stui-header.ios26 .stui_header__user{ margin-left:auto; flex:0 0 auto; }
.stui-header.ios26 .search-wrap{ flex:0 0 auto; }
.stui-header.ios26 .search-inline{ width: 260px; }  /* 你想要的固定宽度，可调整 */

/* ——覆盖可能导致换行的旧样式（非常重要）—— */
@media (max-width:1024px){
  /* 如果你之前给菜单写过 width:100% / flex:0 0 100% 等，强制覆盖掉 */
  .stui-header__menu{ width:auto !important; flex:1 1 auto !important; }
  /* 搜索框保持在同一行；如果不够放，菜单会横向滑动而不是折行 */
  .stui-header.ios26 .search-inline{ width: min(78vw, 240px); }
}
/* 让搜索输入框更短一点 */
.stui-header.ios26 .search-wrap{ gap:8px; }               /* 图标与输入框间距 */
.stui-header.ios26 .search-inline{ width: 125px; }        /* ← 想多短改这里 */

/* 输入框内边距稍微紧凑些（可选） */
.stui-header.ios26 .search-inline .form-control{
  padding-left: 12px; padding-right: 12px;
}