/* Match the home topbar without applying the home page theme to the player. */
.topbar{--header-height:72px;--cyan:#35c9f2;position:sticky;top:0;height:var(--header-height);z-index:30;background:rgba(20,21,24,.97);color:#fff;backdrop-filter:blur(18px);color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-size:16px}
.nav-shell{position:relative;width:100%;height:100%;padding:0 30px;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:9px;font-size:24px;font-weight:850;letter-spacing:-1px}
.brand-mark{width:31px;height:31px;display:grid;place-items:center;border-radius:10px;background:var(--cyan);transform:rotate(-5deg)}
.brand-mark:before{content:"";border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #fff;margin-left:3px}
.brand small{display:none}
.search{position:absolute;left:50%;transform:translateX(-50%);width:clamp(260px,34vw,480px);margin:0}
.search-box{height:40px;width:100%;display:flex;align-items:center;gap:12px;padding:0 7px 0 18px;border:1px solid #46484d;border-radius:22px;background:#2d2f34;transition:background .2s,border-color .2s}
.search-box:focus-within{background:#373a40;border-color:#8d929b}
.search-box input{width:100%;min-width:0;color:#fff;background:none;border:0;outline:0;font-size:13px}
.search-box input::placeholder{color:#a3a6ae}
.search-btn{width:30px;height:30px;flex:none;display:grid;place-items:center;background:none;color:#d6d8df}
.search-icon{width:14px;height:14px;position:relative;border:2px solid currentColor;border-radius:50%}
.search-icon:after{content:"";position:absolute;right:-5px;bottom:-3px;width:6px;height:2px;border-radius:2px;background:currentColor;transform:rotate(45deg)}
.nav-actions{display:flex;align-items:center;gap:18px}
.upload-btn{height:34px;display:flex;align-items:center;gap:5px;padding:0 15px;border-radius:7px;background:var(--cyan);color:#09242e;font-size:13px}
.upload-btn span{font-size:20px}
.avatar{width:34px;height:34px;border-radius:50%;background:#ffb59e;color:#652f35;font-weight:700}
.nav-caption{font-size:12px;color:#aeb0b7}
.topbar .brand:hover{color:inherit}
.topbar .search-btn:hover{color:#d6d8df}
.topbar .upload-btn:hover{color:#09242e}
.topbar .vip-recharge-btn:hover{color:#e8c593}
.topbar button:focus-visible,.topbar a:focus-visible,.topbar input:focus-visible{outline-color:var(--cyan)}

@media(max-width:1100px){.nav-shell{padding:0 22px}.nav-caption{display:none}}
@media(max-width:900px){.nav-actions{gap:10px}.upload-btn{padding:0 10px}.brand{font-size:21px;gap:7px}}
@media(max-width:640px){
  .topbar{--header-height:110px}
  html{scroll-padding-top:126px}
  .nav-shell{align-items:flex-start;padding:13px 16px}
  .brand-mark{height:28px;width:28px;border-radius:8px}
  .brand{height:30px;font-size:22px}
  .nav-actions{height:30px;gap:12px}
  .avatar{height:30px;width:30px}
  .upload-btn{height:30px;font-size:12px}
  .search{top:61px;width:calc(100% - 32px);max-width:none}
  .search-box{height:35px}
  .search-box input{font-size:12px}
}