/*
 * AVLOG reference layout v2
 * 独立前缀 avref26；仅作用于公共页头和首页指定模块。
 */

/* 公共顶部导航：Logo 左、搜索居中、导航右 */
.avref26-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1200 !important;
  isolation: isolate;
  background: rgba(8, 14, 11, .96) !important;
  border-bottom: 1px solid rgba(39, 185, 111, .22) !important;
  box-shadow: 0 8px 26px rgba(0,0,0,.28) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%);
  backdrop-filter: blur(16px) saturate(130%);
}
.avref26-header::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 2%, rgba(22,163,74,.35) 18%, #22c878 50%, rgba(22,163,74,.35) 82%, transparent 98%);
  box-shadow: 0 0 9px rgba(34,200,120,.48), 0 0 18px rgba(34,200,120,.2);
}
.avref26-header .site-header-inner {
  display: grid !important;
  grid-template-columns: minmax(150px, 220px) minmax(300px, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(14px, 2vw, 30px) !important;
  width: min(100% - 32px, 1600px) !important;
  max-width: 1600px !important;
  min-height: 84px !important;
  margin-inline: auto !important;
  padding: 10px 0 !important;
  box-sizing: border-box !important;
}
.avref26-header .site-brand {
  grid-column: 1 !important; grid-row: 1 !important;
  justify-self: start !important; min-width: 0 !important;
}
.avref26-header .site-search-wrap {
  grid-column: 2 !important; grid-row: 1 !important;
  justify-self: center !important;
  position: relative !important;
  width: min(100%, 840px) !important;
  max-width: 840px !important;
  min-width: 0 !important;
  margin: 0 !important;
  z-index: 5;
}
.avref26-header .site-main-nav {
  grid-column: 3 !important; grid-row: 1 !important;
  justify-self: end !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(3px, .55vw, 10px) !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
.avref26-header .site-main-nav .site-nav-link {
  padding: 10px clamp(8px, .9vw, 15px) !important;
  border-radius: 11px !important;
  white-space: nowrap !important;
}
.avref26-header .site-search-form {
  min-height: 54px !important;
  height: 54px !important;
  border: 1px solid rgba(104, 154, 120, .38) !important;
  border-radius: 19px !important;
  background: #111b15 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 0 0 3px rgba(36, 184, 108, .035) !important;
  padding: 5px 7px 5px 18px !important;
}
.avref26-header .site-search-form:focus-within {
  border-color: rgba(61, 210, 133, .75) !important;
  box-shadow: 0 0 0 3px rgba(36,184,108,.10), 0 0 20px rgba(36,184,108,.08) !important;
}
.avref26-header .site-search-input { font-size: 15px !important; }
.avref26-header .site-search-submit {
  height: 42px !important;
  border-radius: 13px !important;
  background: #2fc66e !important;
  color: #06150c !important;
  transition: filter .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.avref26-header .site-search-submit:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 16px rgba(47,198,110,.24) !important;
}
.avref26-header .site-hot-search-dropdown {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  left: 0 !important; right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  z-index: 1300 !important;
  box-sizing: border-box !important;
  padding: 20px 21px !important;
  border: 1px solid rgba(69, 172, 111, .38) !important;
  border-radius: 19px !important;
  background: #101a14 !important;
  box-shadow: 0 20px 48px rgba(0,0,0,.52), 0 0 22px rgba(36,184,108,.055) !important;
}
.avref26-header .site-hot-search-heading {
  display: flex !important; align-items: center !important;
  justify-content: space-between !important;
  margin: 0 0 13px !important;
  color: #edf7f0 !important;
  font-size: 16px !important; font-weight: 800 !important;
}
.avref26-header .site-hot-search-heading small { color: #84968b !important; font-size: 12px !important; font-weight: 500 !important; }
.avref26-header .site-hot-search-list {
  display: flex !important; flex-wrap: wrap !important;
  gap: 9px 10px !important;
}
.avref26-header .site-hot-search-item {
  display: inline-flex !important; align-items: center !important;
  min-height: 37px !important;
  padding: 6px 15px !important;
  border: 1px solid rgba(145,177,153,.15) !important;
  border-radius: 22px !important;
  background: #18241c !important;
  color: #d9e6dd !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
}
.avref26-header .site-hot-search-item:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(47,198,110,.5) !important;
  background: rgba(47,198,110,.14) !important;
  color: #fff !important;
}
.avref26-header .site-hot-search-empty { color: #91a196 !important; font-size: 13px !important; }

/* 首页四个快捷入口：第二张参考图的卡片比例与排布 */
.avref26-home .avref26-shortcuts {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.avref26-home .avref26-shortcuts > .hub-shortcut {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-width: 0 !important;
  min-height: 174px !important;
  padding: 20px 22px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(25, 169, 91, .16) !important;
  border-left: 5px solid #16a34a !important;
  border-radius: 17px !important;
  background: #0d1d15 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.018), 0 0 16px rgba(22,163,74,.035) !important;
  overflow: visible !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}
.avref26-home .avref26-shortcuts > .hub-shortcut:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(42, 207, 119, .42) !important;
  border-left-color: #20c56b !important;
  background: #10251a !important;
  box-shadow: 0 12px 27px rgba(0,0,0,.2), 0 0 18px rgba(22,163,74,.12) !important;
}
.avref26-home .avref26-shortcuts > .hub-shortcut-random {
  border-left-color: #a855f7 !important;
  border-color: rgba(168,85,247,.13) !important;
  background: #0d1d15 !important;
}
.avref26-home .avref26-shortcuts > .hub-shortcut-random:hover {
  border-left-color: #a855f7 !important;
  border-color: rgba(168,85,247,.42) !important;
  background: #122018 !important;
  box-shadow: 0 12px 27px rgba(0,0,0,.2), 0 0 18px rgba(168,85,247,.12) !important;
}
.avref26-home .avref26-shortcuts .hub-icon {
  display: flex !important; flex: 0 0 60px !important;
  align-items: center !important; justify-content: center !important;
  width: 60px !important; height: 60px !important;
  border-radius: 15px !important;
  background: #0b3823 !important;
  color: #16c784 !important;
  font-size: 25px !important;
}
.avref26-home .avref26-shortcuts .hub-shortcut-random .hub-icon {
  background: #8249d5 !important; color: #fff !important;
  box-shadow: 0 7px 18px rgba(130,73,213,.2) !important;
}
.avref26-home .avref26-shortcuts .hub-shortcut > span:last-child {
  display: block !important; flex: 1 1 auto !important;
  min-width: 0 !important;
}
.avref26-home .avref26-shortcuts .hub-shortcut h2 {
  margin: 0 0 7px !important;
  color: #f4faf5 !important;
  font-size: 18px !important; line-height: 1.35 !important;
  font-weight: 800 !important;
}
.avref26-home .avref26-shortcuts .hub-shortcut p {
  margin: 0 !important;
  color: #b5c7bb !important;
  font-size: 14px !important; line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

/* 指定三个“更多”按钮：绿色底、白字 */
.avref26-home .avref26-green-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 36px !important;
  padding: 7px 14px !important;
  border: 1px solid #2fc66e !important;
  border-radius: 10px !important;
  background: #25b965 !important;
  color: #fff !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(37,185,101,.13) !important;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
.avref26-home .avref26-green-action:hover {
  background: #2fcf75 !important;
  border-color: #58df91 !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 7px 17px rgba(37,185,101,.22) !important;
}

/* 换一批只精修形状与交互，不指定背景/文字颜色 */
.avref26-home .avref26-batch-action {
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  padding: 7px 14px !important;
  border: 1px solid currentColor !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 10px rgba(0,0,0,.14) !important;
  transition: border-radius .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, filter .18s ease !important;
  cursor: pointer !important;
}
.avref26-home .avref26-batch-action:hover {
  border-radius: 10px !important;
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 7px 17px rgba(0,0,0,.22) !important;
}
.avref26-home .avref26-batch-action:active {
  transform: translateY(1px) scale(.98) !important;
  filter: brightness(.96) !important;
}

@media (max-width: 1100px) {
  .avref26-header .site-header-inner {
    grid-template-columns: minmax(120px, 180px) minmax(180px,1fr) auto !important;
    gap: 10px !important;
    width: calc(100% - 24px) !important;
  }
  .avref26-header .site-main-nav .site-nav-link { padding-inline: 7px !important; }
  .avref26-home .avref26-shortcuts > .hub-shortcut { padding: 17px 14px !important; gap: 11px !important; }
  .avref26-home .avref26-shortcuts .hub-icon { flex-basis: 50px !important; width: 50px !important; height: 50px !important; }
}
@media (max-width: 767px) {
  .avref26-header { position: sticky !important; }
  .avref26-header .site-header-inner {
    grid-template-columns: minmax(0,1fr) auto !important;
    grid-template-rows: auto auto !important;
    gap: 8px 10px !important;
    width: calc(100% - 20px) !important;
    min-height: 0 !important;
    padding: 8px 0 !important;
  }
  .avref26-header .site-brand { grid-column: 1 !important; grid-row: 1 !important; }
  .avref26-header .site-main-nav { grid-column: 2 !important; grid-row: 1 !important; gap: 2px !important; }
  .avref26-header .site-main-nav .site-nav-link { padding: 7px 6px !important; font-size: 11px !important; }
  .avref26-header .site-main-nav .site-nav-link i { font-size: 13px !important; }
  .avref26-header .site-search-wrap { grid-column: 1 / -1 !important; grid-row: 2 !important; width: 100% !important; }
  .avref26-header .site-search-form { height: 43px !important; min-height: 43px !important; border-radius: 13px !important; }
  .avref26-header .site-search-submit { height: 34px !important; }
  .avref26-header .site-hot-search-dropdown { top: calc(100% + 7px) !important; padding: 14px !important; }
  .avref26-header .site-hot-search-list { gap: 7px !important; }
  .avref26-header .site-hot-search-item { min-height: 32px !important; padding: 5px 11px !important; font-size: 12px !important; }
  .avref26-home .avref26-shortcuts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .avref26-home .avref26-shortcuts > .hub-shortcut {
    min-height: 112px !important;
    padding: 13px 10px !important;
    gap: 9px !important;
    border-left-width: 4px !important;
    border-radius: 13px !important;
  }
  .avref26-home .avref26-shortcuts .hub-icon {
    flex: 0 0 38px !important; width: 38px !important; height: 38px !important;
    border-radius: 11px !important; font-size: 18px !important;
  }
  .avref26-home .avref26-shortcuts .hub-shortcut h2 { font-size: 13px !important; margin-bottom: 5px !important; }
  .avref26-home .avref26-shortcuts .hub-shortcut p {
    font-size: 10px !important; line-height: 1.45 !important;
    display: -webkit-box !important; -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important; overflow: hidden !important;
  }
}
@media (max-width: 380px) {
  .avref26-home .avref26-shortcuts > .hub-shortcut { padding: 11px 8px !important; gap: 7px !important; }
  .avref26-home .avref26-shortcuts .hub-icon { flex-basis: 34px !important; width: 34px !important; height: 34px !important; }
  .avref26-home .avref26-shortcuts .hub-shortcut h2 { font-size: 12px !important; }
  .avref26-home .avref26-shortcuts .hub-shortcut p { font-size: 9px !important; }
}

/* AVLOG 2026-11-13 finishing pass */
.avref26-header { position: relative !important; top: auto !important; }
@media (max-width: 767px) { .avref26-header { position: relative !important; top: auto !important; } }

/* Shortcut cards: green-tinted surfaces like the supplied reference; 4 desktop / 2 mobile. */
.avref26-home .avref26-shortcuts > .hub-shortcut {
  background: #0c1d15 !important;
  border-color: rgba(28, 166, 91, .12) !important;
  border-left-color: #16a34a !important;
}
.avref26-home .avref26-shortcuts > .hub-shortcut-random {
  background: #0c1d15 !important;
  border-left-color: #a855f7 !important;
}
@media (max-width: 767px) {
  .avref26-home .avref26-shortcuts { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

/* AI-video section shares the same content edges as latest videos. */
html body.body .main .hub-wrap > .ai-video-section {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  box-sizing: border-box !important;
}
html body.body .ai-video-section .ai-video-grid {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
}

/* Green outline actions (no solid fill). */
html body.body .avref26-green-action,
html body.body a.avref26-green-action,
html body.body .ai-video-more.avref26-green-action {
  border: 1px solid #20b86a !important;
  background: transparent !important;
  color: #63d995 !important;
  box-shadow: none !important;
}
html body.body .avref26-green-action:hover,
html body.body a.avref26-green-action:hover {
  border-color: #48df8b !important;
  background: rgba(32,184,106,.10) !important;
  color: #a5f3c4 !important;
}

/* Search hot-keyword title matches the framed latest-video section heading. */
html body.body #search-hot-keywords > .hub-section-head {
  display: flex !important;
  align-items: center !important;
  min-height: 48px !important;
  margin: 0 0 16px !important;
  padding: 0 15px !important;
  border: 1px solid rgba(57,185,120,.22) !important;
  border-radius: 11px !important;
  background: linear-gradient(110deg,rgba(22,163,74,.11),rgba(13,29,21,.72)) !important;
  box-sizing: border-box !important;
}
html body.body #search-hot-keywords > .hub-section-head h2 { margin: 0 !important; color: #edf8f0 !important; }

/* Play page spacing and episode title frame. */
body.body .play-page-home-layout {
  margin-top: 8px !important;
  gap: 16px !important;
}
body.body .play-page-home-layout .play-episode-heading {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 46px !important;
  margin: 0 0 14px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(57,185,120,.22) !important;
  border-radius: 10px !important;
  background: linear-gradient(110deg,rgba(22,163,74,.11),rgba(13,29,21,.72)) !important;
  box-sizing: border-box !important;
}
body.body .play-page-home-layout .play-episode-heading h2 { margin: 0 !important; }
body.body .play-page-home-layout .play-episode-heading-mark { flex: 0 0 4px !important; height: 19px !important; border-radius: 4px !important; background: #22c55e !important; }
@media (max-width: 767px) {
  body.body .play-page-home-layout { margin-top: 6px !important; gap: 13px !important; }
}

/* Related recommendation thumbnails: remove the centered play glyph overlay. */
body.body .play-related-v2-cover .icon-bofang,
body.body .play-related-v2-cover > i { display: none !important; }
body.body .play-related-v2-cover:after { display: none !important; }

/* Footer rebuilt as a compact, bordered dark-green information panel. */
html body.body .footer {
  margin-top: 42px !important;
  padding: 0 16px 28px !important;
  border: 0 !important;
  background: transparent !important;
}
html body.body .footer .container { width: min(1240px,100%) !important; max-width: 1240px !important; }
html body.body .footer .footer-block {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 13px !important;
  padding: 28px 24px !important;
  border: 1px solid rgba(53,169,101,.22) !important;
  border-radius: 18px !important;
  background: radial-gradient(ellipse at 50% 0%,rgba(31,130,73,.15),transparent 65%),linear-gradient(145deg,#101b14,#0b120e) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.025) !important;
  text-align: center !important;
}
html body.body .footer .footer-brand { color: #e9f8ee !important; font-size: 21px !important; font-weight: 850 !important; letter-spacing: .04em !important; }
html body.body .footer .copyright { max-width: 900px !important; margin: 0 !important; color: #9eafa4 !important; line-height: 1.8 !important; font-size: 12px !important; }
html body.body .footer .footer-contact { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 8px 14px !important; color: #b9d4c2 !important; font-size: 13px !important; }
html body.body .footer .footer-note { color: #6f8a78 !important; font-size: 11px !important; }
@media (max-width: 767px) {
  html body.body .footer { margin-top: 28px !important; padding-inline: 10px !important; }
  html body.body .footer .footer-block { padding: 22px 14px !important; border-radius: 14px !important; }
  html body.body .footer .footer-contact { flex-direction: column !important; gap: 5px !important; }
  html body.body .footer .footer-separator { display: none !important; }
}
/* Match AI section inner gutters to the latest-video panel content gutters. */
html body.body .main .hub-wrap > .ai-video-section { padding: 0 clamp(18px,2.2vw,30px) !important; }
@media (max-width: 767px) {
  html body.body .main .hub-wrap > .ai-video-section { padding: 0 15px !important; }
}
/* Play page begins at the same compact offset as the type/list pages. */
html body.body main.main:has(.play-page-home-layout) { padding-top: 0 !important; }