/* Site presentation layer. Keep existing routes and player components intact. */
:root { --av-bg:#101116; --av-panel:#191b23; --av-line:#2a2d39; --av-muted:#a3a8b8; --av-accent:#ff4f83; }
body { background:var(--av-bg); color:#f4f5fa; font-family:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
button,input,select,textarea { font-family:inherit; }
.header,.sidebar,.footer { background:var(--av-bg); }
.header { border-bottom:1px solid var(--av-line); }
.header .menu a.active,.header .menu a:hover,.block-post .item:hover .title-post { color:var(--av-accent); }
.header .menu a.active::after,.header .menu a:hover::after { background:var(--av-accent); }
.btn.gradient,.block-post .item .img .type,.block-post .item .img .heart { background:var(--av-accent); color:#fff; }
.block-post .item .stat .atten { color:#ff83a8; }
.block-post .item .stat { color:var(--av-muted); }
.wrap { max-width:1370px; }
.section { margin-bottom:36px; }
.heading { margin-bottom:22px; }
.heading .title h1,.heading .title h2 { font-size:24px; font-weight:700; letter-spacing:-.03em; }
.block-post > .av-video-card .img { background:var(--av-panel); padding-bottom:56.25%; border:1px solid var(--av-line); border-radius:12px; margin-bottom:11px; }
.block-post > .av-video-card .img img { object-fit:cover; }
.block-post > .av-video-card .title-post { font-size:14px; line-height:1.55; font-weight:500; height:auto; min-height:43px; max-height:43px; overflow:hidden; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.block-post > .av-video-card .stat { margin-top:6px; }
.filter .select-item { background:var(--av-panel); border:1px solid var(--av-line); }
.av-discover { margin-bottom:34px; display:flex; align-items:center; gap:24px; }
.av-search { display:flex; flex:1; max-width:660px; border:1px solid var(--av-line); border-radius:12px; background:var(--av-panel); padding:5px; }
.av-search:focus-within { border-color:var(--av-accent); }
.av-search input { min-width:0; flex:1; width:100%; height:42px; padding:0 14px; background:transparent; border:0; outline:none; color:#fff; font-size:15px; }
.av-search input::placeholder { color:var(--av-muted); }
.av-search button { flex:none; padding:0 24px; border:0; border-radius:8px; background:var(--av-accent); color:#fff; font-size:14px; font-weight:600; cursor:pointer; }
.av-shortcuts { display:flex; gap:10px; flex-wrap:wrap; }
.av-shortcuts a { display:block; padding:11px 16px; border-radius:24px; border:1px solid var(--av-line); color:#d5d8e4; font-size:13px; white-space:nowrap; }
.av-shortcuts a:hover { color:#fff; border-color:var(--av-accent); background:#ff4f8314; }
.av-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
a:focus-visible,button:focus-visible { outline:2px solid var(--av-accent); outline-offset:4px; }
.footer { border-top:1px solid var(--av-line); }
.footer .copyright { color:var(--av-muted); }
@media (max-width:1100px) {
  .av-discover { flex-direction:column; align-items:stretch; gap:14px; }
  .av-search { max-width:none; }
}
@media (max-width:767px) {
  .header .logo img { width:153px; height:auto; }
  .av-discover { margin-bottom:26px; }
  .av-search input { height:38px; font-size:16px; }
  .av-search button { padding:0 20px; }
  .av-shortcuts { gap:8px; }
  .av-shortcuts a { padding:9px 14px; font-size:12px; }
  .heading { margin-bottom:16px; gap:12px; }
  .heading .title h1,.heading .title h2 { font-size:20px; line-height:1.4; }
  .block-post > .av-video-card { width:calc(50% - 20px); margin-bottom:22px; }
  .block-post > .av-video-card .title-post { font-size:13px; min-height:40px; max-height:40px; }
  .block-post > .av-video-card .img { border-radius:9px; margin-bottom:8px; }
  .block-post > .av-video-card .img .type { font-size:10px; padding:3px 7px; }
  .block-post > .av-video-card .img .heart { display:none; }
  .block-post > .av-video-card .stat { font-size:11px; display:flex; gap:10px; }
  .block-post > .av-video-card .stat span { margin:0; }
  .block-post > .av-video-card .stat span:first-child { display:none; }
  .section { margin-bottom:20px; }
}

.header .nav .menu li a.active,.header .nav .menu li a:hover { color:var(--av-accent); }
.header .nav .menu li a::before,.header .btn.gradient::before,.header .btn.gradient::after { background:var(--av-accent); }