/* AVLOG Search Experience Redesign · 2026-11-15
   Fresh visual system for homepage aggregate search and PanSou result cards.
   Markup/API/search behavior remain unchanged. */

/* ===== Homepage aggregate search ===== */
html body.body.avref26-home .pan-home-search{
  --sr-green:#42e39a;
  position:relative;
  isolation:isolate;
  width:100%;
  margin:4px 0 30px;
  padding:26px 30px 22px;
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid rgba(93,224,158,.24);
  border-radius:24px;
  background:
    radial-gradient(ellipse at 92% 8%,rgba(50,205,130,.19),transparent 34%),
    radial-gradient(ellipse at 5% 100%,rgba(24,123,82,.16),transparent 38%),
    linear-gradient(128deg,#10291e 0%,#0d1e17 52%,#101f19 100%);
  box-shadow:0 18px 48px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.045);
}
html body.body.avref26-home .pan-home-search:before{
  content:"";
  position:absolute;
  z-index:-1;
  width:310px;height:310px;
  right:-130px;top:-190px;
  border:1px solid rgba(94,226,160,.15);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(94,226,160,.035),0 0 0 58px rgba(94,226,160,.025);
  pointer-events:none;
}
html body.body.avref26-home .pan-home-search:after{
  content:"";
  position:absolute;
  z-index:-1;
  left:0;top:25px;bottom:25px;width:3px;
  border-radius:0 5px 5px 0;
  background:linear-gradient(180deg,#62efaa,rgba(40,174,111,.12));
}
html body.body.avref26-home .pan-home-search .pan-search-form{
  position:relative;
  z-index:1;
}
html body.body.avref26-home .pan-home-search .pan-search-label{
  display:flex;align-items:center;gap:12px;
  margin:0 0 17px;
  color:#f0fff6;
  font-size:21px;font-weight:850;letter-spacing:.1px;
}
html body.body.avref26-home .pan-home-search .pan-home-title-icon{
  display:grid;place-items:center;
  width:42px;height:42px;flex:0 0 42px;
  border:1px solid rgba(124,245,181,.36);
  border-radius:13px;
  background:linear-gradient(145deg,#2dc982,#14784f);
  color:#fff;
  box-shadow:0 8px 22px rgba(25,177,109,.22);
}
html body.body.avref26-home .pan-home-search .pan-home-title-icon svg{
  width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
html body.body.avref26-home .pan-home-search .pan-home-search-modes{
  display:flex;flex-wrap:wrap;gap:7px;
  margin:0 0 13px;
}
html body.body.avref26-home .pan-home-search .pan-mode-button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:35px;padding:0 14px;
  border:1px solid rgba(190,220,202,.13);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:#a9bdb1;
  font-size:12px;font-weight:700;
  transition:all .2s ease;
}
html body.body.avref26-home .pan-home-search .pan-mode-button svg{
  width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
html body.body.avref26-home .pan-home-search .pan-mode-button:hover{
  border-color:rgba(90,226,157,.4);color:#d8f9e6;background:rgba(48,190,121,.09);
}
html body.body.avref26-home .pan-home-search .pan-mode-button.is-active{
  border-color:rgba(76,226,151,.65);
  background:linear-gradient(135deg,rgba(51,193,124,.22),rgba(31,133,86,.13));
  color:#76edaa;
  box-shadow:inset 0 0 0 1px rgba(76,226,151,.07);
}
html body.body.avref26-home .pan-home-search .pan-search-control{
  display:flex;align-items:center;gap:8px;
  min-height:62px;padding:7px;
  border:1px solid rgba(107,225,163,.32);
  border-radius:15px;
  background:rgba(4,15,10,.62);
  box-shadow:0 10px 28px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035);
  transition:border-color .2s ease,box-shadow .2s ease;
}
html body.body.avref26-home .pan-home-search .pan-search-control:focus-within{
  border-color:rgba(96,237,165,.78);
  box-shadow:0 0 0 4px rgba(53,197,125,.11),0 12px 30px rgba(0,0,0,.2);
}
html body.body.avref26-home .pan-home-search .pan-search-control input{
  flex:1;min-width:0;height:46px;padding:0 14px;
  border:0!important;outline:0!important;background:transparent!important;
  box-shadow:none!important;color:#effff5!important;
  font-size:15px;
}
html body.body.avref26-home .pan-home-search .pan-search-control input::placeholder{color:#82998b}
html body.body.avref26-home .pan-home-search .pan-search-control button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  flex:0 0 auto;min-width:116px;min-height:46px;padding:0 20px;
  border:0;border-radius:10px;
  background:linear-gradient(135deg,#4be49b,#1a9b64);
  color:#062515;font-size:14px;font-weight:850;
  box-shadow:0 6px 16px rgba(30,185,112,.24);
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}
html body.body.avref26-home .pan-home-search .pan-search-control button svg{
  width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}
html body.body.avref26-home .pan-home-search .pan-search-control button:hover{
  transform:translateY(-1px);filter:brightness(1.06);
  box-shadow:0 9px 20px rgba(30,185,112,.3);
}
html body.body.avref26-home .pan-home-search .pan-keyword-tools{margin-top:17px}
html body.body.avref26-home .pan-home-search .pan-keyword-heading{
  display:flex;align-items:center;gap:9px;margin:0 0 9px;
}
html body.body.avref26-home .pan-home-search .pan-keyword-caption{
  color:#c8dfd1;font-size:12px;font-weight:800;letter-spacing:.3px;
}
html body.body.avref26-home .pan-home-search .pan-keyword-caption:before{
  content:"";display:inline-block;width:5px;height:5px;margin:0 7px 2px 0;
  border-radius:50%;background:#55e6a0;box-shadow:0 0 9px rgba(85,230,160,.6);
}
html body.body.avref26-home .pan-home-search .pan-keyword-list{
  display:flex;flex-wrap:wrap;gap:7px;
}
html body.body.avref26-home .pan-home-search .pan-keyword-item{display:inline-flex;min-width:0}
html body.body.avref26-home .pan-home-search .pan-keyword-chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:29px;padding:0 11px;
  border:1px solid rgba(173,211,187,.16);border-radius:7px;
  background:rgba(255,255,255,.035);color:#a9c5b4;
  font-size:11px;line-height:1.2;text-decoration:none;
  transition:all .18s ease;
}
html body.body.avref26-home .pan-home-search .pan-keyword-chip:hover{
  border-color:rgba(91,228,157,.55);background:rgba(45,183,115,.13);color:#8df0b7;
}
html body.body.avref26-home .pan-home-search .pan-search-hint{
  margin:13px 1px 0;color:#7f9b8b;font-size:11px;line-height:1.6;
}
@media(max-width:767px){
  html body.body.avref26-home .pan-home-search{
    margin:2px 0 22px;padding:18px 14px 16px;border-radius:17px;
  }
  html body.body.avref26-home .pan-home-search:after{top:18px;bottom:18px}
  html body.body.avref26-home .pan-home-search .pan-search-label{gap:10px;margin-bottom:14px;font-size:18px}
  html body.body.avref26-home .pan-home-search .pan-home-title-icon{width:37px;height:37px;flex-basis:37px;border-radius:11px}
  html body.body.avref26-home .pan-home-search .pan-home-search-modes{gap:6px;margin-bottom:10px}
  html body.body.avref26-home .pan-home-search .pan-mode-button{min-height:33px;padding:0 10px;font-size:11px}
  html body.body.avref26-home .pan-home-search .pan-mode-button svg{width:13px;height:13px}
  html body.body.avref26-home .pan-home-search .pan-search-control{min-height:54px;padding:5px;gap:5px;border-radius:12px}
  html body.body.avref26-home .pan-home-search .pan-search-control input{height:42px;padding:0 9px;font-size:13px}
  html body.body.avref26-home .pan-home-search .pan-search-control button{min-width:78px;min-height:42px;padding:0 10px;gap:5px;font-size:12px}
  html body.body.avref26-home .pan-home-search .pan-keyword-tools{margin-top:14px}
  html body.body.avref26-home .pan-home-search .pan-keyword-list{gap:6px}
  html body.body.avref26-home .pan-home-search .pan-keyword-chip{min-height:27px;padding:0 9px;font-size:10px}
  html body.body.avref26-home .pan-home-search .pan-search-hint{margin-top:10px;font-size:10px}
}

/* ===== PanSou result cards: new resource-tile design =====
   Works on the standalone PanSou page and the embedded VOD search module. */
html body.body.pan-search-page #panSearchResults.pan-results-list,
html body.body.vod-search-page .pan-inline-search #panSearchResults.pan-results-list{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:15px!important;
  width:100%!important;max-width:100%!important;
  padding:16px 20px 22px!important;
  box-sizing:border-box!important;
}
html body.body.pan-search-page #panSearchResults > .pan-result-card,
html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card{
  position:relative;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  justify-content:flex-start!important;gap:0!important;
  width:auto!important;min-width:0!important;min-height:0!important;height:auto!important;
  margin:0!important;padding:16px!important;overflow:hidden!important;
  border:1px solid rgba(127,160,139,.2)!important;border-radius:16px!important;
  background:linear-gradient(155deg,rgba(25,43,33,.98),rgba(13,26,19,.99))!important;
  box-shadow:0 8px 22px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.035)!important;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease!important;
}
html body.body.pan-search-page #panSearchResults > .pan-result-card:before,
html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card:before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;
  background:linear-gradient(90deg,rgba(73,226,151,.9),rgba(73,226,151,.05) 72%,transparent);
  opacity:.72;pointer-events:none;
}
html body.body.pan-search-page #panSearchResults > .pan-result-card:hover,
html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card:hover{
  transform:translateY(-3px);
  border-color:rgba(77,224,148,.48)!important;
  background:linear-gradient(155deg,rgba(30,55,40,.99),rgba(15,31,22,.99))!important;
  box-shadow:0 15px 30px rgba(0,0,0,.22),0 0 0 1px rgba(67,207,132,.06)!important;
}
html body.body.pan-search-page #panSearchResults .pan-result-main,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-main{
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;
  width:100%!important;min-width:0!important;flex:1 1 auto!important;
}
html body.body.pan-search-page #panSearchResults .pan-cloud-tag,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-cloud-tag{
  display:inline-flex!important;flex-flow:row nowrap!important;align-items:center!important;
  gap:8px!important;width:auto!important;max-width:100%!important;min-width:0!important;
  margin:0 0 13px!important;padding:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;
  box-shadow:none!important;color:#8fe4b1!important;
  font-size:11px!important;font-weight:750!important;line-height:1.3!important;
  white-space:nowrap!important;overflow:visible!important;
}
html body.body.pan-search-page #panSearchResults .pan-cloud-mark,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-cloud-mark{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 30px!important;width:30px!important;min-width:30px!important;height:30px!important;
  padding:0!important;box-sizing:border-box!important;
  border:1px solid rgba(255,255,255,.11)!important;border-radius:9px!important;
  background:rgba(255,255,255,.07)!important;color:#eafff1!important;
  font-size:12px!important;font-weight:850!important;line-height:1!important;
  white-space:nowrap!important;overflow:hidden!important;
}
html body.body.pan-search-page #panSearchResults .pan-mark-quark,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-quark{background:rgba(255,174,61,.13)!important;color:#ffc46b!important;border-color:rgba(255,174,61,.2)!important}
html body.body.pan-search-page #panSearchResults .pan-mark-baidu,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-baidu{background:rgba(74,139,255,.14)!important;color:#8db8ff!important;border-color:rgba(74,139,255,.22)!important}
html body.body.pan-search-page #panSearchResults .pan-mark-aliyun,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-aliyun{background:rgba(70,153,255,.14)!important;color:#8fc5ff!important;border-color:rgba(70,153,255,.22)!important}
html body.body.pan-search-page #panSearchResults .pan-mark-tianyi,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-tianyi{background:rgba(80,165,255,.14)!important;color:#91c7ff!important}
html body.body.pan-search-page #panSearchResults .pan-mark-uc,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-uc{background:rgba(255,119,83,.14)!important;color:#ffad91!important}
html body.body.pan-search-page #panSearchResults .pan-mark-mobile,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-mobile{background:rgba(65,206,145,.14)!important;color:#81e8b0!important}
html body.body.pan-search-page #panSearchResults .pan-mark-123,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-123{background:rgba(255,184,75,.14)!important;color:#ffd083!important}
html body.body.pan-search-page #panSearchResults .pan-mark-115,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-115{background:rgba(162,133,255,.14)!important;color:#c1aeff!important}
html body.body.pan-search-page #panSearchResults .pan-mark-xunlei,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-xunlei{background:rgba(91,154,255,.14)!important;color:#9ec3ff!important}
html body.body.pan-search-page #panSearchResults .pan-mark-guangya,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-mark-guangya{background:rgba(61,211,177,.14)!important;color:#8cebd3!important}
html body.body.pan-search-page #panSearchResults .pan-result-card h2,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-card h2{
  display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:3!important;
  width:100%;min-width:0;margin:0!important;overflow:hidden!important;
  color:#eef7f0!important;font-size:14px!important;font-weight:750!important;
  line-height:1.65!important;letter-spacing:.05px!important;
  overflow-wrap:anywhere!important;word-break:break-word!important;
}
html body.body.pan-search-page #panSearchResults .pan-result-meta,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-meta{
  display:flex!important;flex-wrap:wrap!important;gap:5px 10px!important;
  min-width:0!important;margin:10px 0 0!important;
  color:#82998a!important;font-size:10px!important;line-height:1.5!important;
  overflow-wrap:anywhere!important;
}
html body.body.pan-search-page #panSearchResults .pan-result-meta span,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-meta span{
  display:inline-flex;align-items:center;min-width:0;
}
html body.body.pan-search-page #panSearchResults .pan-result-actions,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-actions{
  display:flex!important;flex-direction:row!important;align-items:center!important;
  justify-content:space-between!important;gap:8px!important;
  width:100%!important;min-width:0!important;margin-top:16px!important;padding-top:12px!important;
  border-top:1px solid rgba(142,174,151,.13)!important;
}
html body.body.pan-search-page #panSearchResults .pan-code,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-code{
  display:inline-flex!important;align-items:center!important;gap:4px!important;
  flex:1 1 auto!important;min-width:0!important;
  color:#a9c3b2!important;font-size:11px!important;line-height:1.4!important;
  white-space:normal!important;overflow-wrap:anywhere!important;
}
html body.body.pan-search-page #panSearchResults .pan-code b,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-code b{
  display:inline-block;padding:3px 7px;border:1px solid rgba(94,211,144,.18);
  border-radius:6px;background:rgba(51,178,111,.1);color:#8fe7b2!important;
  font-size:11px;letter-spacing:1px;
}
html body.body.pan-search-page #panSearchResults .pan-result-actions a,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-actions a{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;width:auto!important;max-width:58%!important;min-width:0!important;
  min-height:34px!important;padding:0 11px!important;
  border:1px solid rgba(79,220,145,.35)!important;border-radius:8px!important;
  background:rgba(42,177,109,.13)!important;color:#8feab5!important;
  font-size:11px!important;font-weight:800!important;line-height:1.25!important;
  text-align:center!important;text-decoration:none!important;white-space:normal!important;
  overflow-wrap:anywhere!important;transition:all .18s ease!important;
}
html body.body.pan-search-page #panSearchResults .pan-result-actions a:hover,
html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-actions a:hover{
  border-color:#5be49a!important;background:#4cda91!important;color:#092719!important;
}
html body.body.pan-search-page #panSearchResults > .pan-empty-state,
html body.body.pan-search-page #panSearchResults > .pan-loading,
html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-empty-state,
html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-loading{
  grid-column:1/-1!important;width:100%!important;min-width:0!important;box-sizing:border-box!important;
}
@media(max-width:700px){
  html body.body.pan-search-page #panSearchResults.pan-results-list,
  html body.body.vod-search-page .pan-inline-search #panSearchResults.pan-results-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;
    padding:12px 12px 17px!important;
  }
  html body.body.pan-search-page #panSearchResults > .pan-result-card,
  html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card{
    padding:12px!important;border-radius:13px!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-cloud-tag,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-cloud-tag{
    gap:6px!important;margin-bottom:10px!important;font-size:10px!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-cloud-mark,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-cloud-mark{
    flex-basis:25px!important;width:25px!important;min-width:25px!important;height:25px!important;border-radius:7px!important;font-size:10px!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-result-card h2,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-card h2{
    -webkit-line-clamp:3!important;font-size:12px!important;line-height:1.55!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-result-meta,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-meta{
    gap:4px 7px!important;margin-top:8px!important;font-size:9px!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-result-actions,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-actions{
    align-items:stretch!important;flex-direction:column!important;gap:8px!important;
    margin-top:12px!important;padding-top:9px!important;
  }
  html body.body.pan-search-page #panSearchResults .pan-code,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-code{font-size:10px!important}
  html body.body.pan-search-page #panSearchResults .pan-result-actions a,
  html body.body.vod-search-page .pan-inline-search #panSearchResults .pan-result-actions a{
    width:100%!important;max-width:none!important;min-height:32px!important;padding:0 7px!important;font-size:10px!important;
  }
}
@media(max-width:360px){
  html body.body.pan-search-page #panSearchResults.pan-results-list,
  html body.body.vod-search-page .pan-inline-search #panSearchResults.pan-results-list{gap:8px!important;padding-inline:9px!important}
  html body.body.pan-search-page #panSearchResults > .pan-result-card,
  html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card{padding:10px!important}
}
@media(prefers-reduced-motion:reduce){
  html body.body.avref26-home .pan-home-search *,
  html body.body.pan-search-page #panSearchResults > .pan-result-card,
  html body.body.vod-search-page .pan-inline-search #panSearchResults > .pan-result-card{transition:none!important}
}
