/* 全站设计令牌：与 bscc-hymn-style.css 顶部 :root 逐字同值。首页等非诗歌页只加载本文件与 bscc-playlist.css，
   不加载 bscc-hymn-style.css，故此处必须再定义一份；改任一处必须同步另一处（机检 mcheck.sh §9 对账）。*/
:root {
    --ink:#181818;
    --ink-2:#3d3d3d;
    --ink-3:#686868;
    --ink-4:#9a9a9a;
    --paper:#ffffff;
    --paper-2:#f6f6f6;
    --paper-3:#efefef;
    --line:#e6e6e6;
    --line-2:#d6d6d6;
    --sh-1:0 1px 2px rgba(24,24,24,.05);
    --sh-2:0 1px 2px rgba(24,24,24,.06), 0 12px 32px -16px rgba(24,24,24,.22);
    --sh-3:0 1px 0 rgba(24,24,24,.06), 0 8px 24px -16px rgba(24,24,24,.28);
    --sh-4:0 -8px 28px -16px rgba(0,0,0,.35);
    --r-s:4px;
    --r-m:10px;
    --font-title:"Noto Serif SC",serif;
    --font-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","WenQuanYi Zen Hei",sans-serif;
    --black:#000;
    --paper-glass:rgba(255,255,255,.96);
    --play-paper:rgba(255,255,255,.92);
    --white-line:rgba(255,255,255,.12);
    --white-muted:rgba(255,255,255,.72);
    --overlay:rgba(24,24,24,.45);
    --duration-bg:rgba(0,0,0,.72);
    --cover-mask:linear-gradient(180deg,rgba(0,0,0,0) 48%,rgba(0,0,0,.58));
    --lyrics-fade:linear-gradient(var(--black) 88%,transparent 100%);
    --lyrics-sync-fade:linear-gradient(transparent,var(--black) 15%,var(--black) 85%,transparent);
    --drawer-shadow:8px 0 32px -16px rgba(24,24,24,.35);
}
:root{--bscc-tb-h:52px;--bscc-tb-off:var(--bscc-tb-h)}
.bscc-topbar{position:fixed;top:0;left:0;right:0;height:var(--bscc-tb-h);z-index:1100;background:var(--paper-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);color:var(--ink);box-shadow:none;}
.bscc-topbar,.tb-drawer{font-family:var(--font-ui)}
.bscc-topbar *,.tb-drawer,.tb-drawer *{box-sizing:border-box}
.tb-inner{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;height:100%;max-width:1200px;margin:0 auto;padding:0 8px;gap:8px}
.tb-brand{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;color:var(--ink);font-family:var(--font-ui);font-weight:600;font-size:17px;letter-spacing:.3px}
.tb-brand-short{display:none}
.tb-brand-h{margin:0;padding:0;min-width:0;max-width:100%;justify-self:center;display:block;font-size:inherit;font-weight:inherit;line-height:inherit;text-align:center}
.tb-btn{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border:0;background:none;color:var(--ink);font:inherit;text-decoration:none;cursor:pointer;flex-shrink:0}
.tb-btn:focus-visible,.tb-brand:focus-visible,.tb-menu-list a:focus-visible,.tb-search input:focus-visible{outline:2px solid var(--paper);box-shadow:0 0 0 4px var(--ink);outline-offset:2px}
.tb-auth{display:flex;align-items:center;min-width:0}
.tb-login,.tb-logout{font-size:13px;white-space:nowrap;height:32px;min-height:32px;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r-s);color:var(--ink-2);font-weight:500;}
.tb-user{gap:6px}
.tb-avatar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--line);font-size:14px}
.tb-user-name{max-width:6em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
body.bscc-has-topbar{padding-top:var(--bscc-tb-h)}
html{scroll-padding-top:calc(var(--bscc-tb-h) + 8px)}
body.admin-bar .bscc-topbar,body.admin-bar .tb-drawer{top:32px}
body.admin-bar{--bscc-tb-off:calc(var(--bscc-tb-h) + 32px)}
.tb-drawer{position:fixed;top:0;bottom:0;left:0;width:min(320px,86vw);background:var(--paper);color:var(--ink);z-index:9996;transform:translateX(-100%);transition:transform .25s ease;overflow-y:auto;padding:0 0 24px;box-shadow:var(--drawer-shadow);}
.tb-drawer.is-open{transform:none}
.tb-backdrop{position:fixed;inset:0;background:var(--overlay);z-index:9995}
.tb-drawer[hidden],.tb-backdrop[hidden]{display:none}
body.tb-drawer-open{overflow:hidden}
.tb-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:4px 12px 4px 20px;border-bottom:1px solid var(--line)}
.tb-drawer-title{font-size:17px;font-weight:600}
.tb-menu-list{list-style:none;margin:0;padding:8px 0}
.tb-menu-list a{display:block;padding:12px 20px;color:var(--ink-2);text-decoration:none;font-size:16px}
.tb-menu-list .sub-menu{list-style:none;margin:0;padding:0}
.tb-menu-list .sub-menu a{padding-left:36px;font-size:15px;color:var(--ink-3)}
.tb-menu-list .current-menu-item>a,.tb-menu-list [aria-current="page"]{color:var(--ink);font-weight:600;border-left:3px solid var(--ink);padding-left:17px;}
.tb-sep{margin:8px 20px;border:0;border-top:1px solid var(--line)}
.tb-search{display:flex;align-items:center;gap:4px;padding:12px 16px}
.tb-search input{min-width:0;width:100%;min-height:44px;margin:0;padding:8px;border:1px solid var(--line-2);border-radius:var(--r-s);background:var(--paper-3);color:var(--ink);font:inherit;font-size:14px}
.tb-search input::placeholder{color:var(--ink-3);opacity:1}
.tb-search-btn{font-size:14px;color:var(--ink)}
body.bscc-has-topbar #wrapper{border-top:0}
.tb-drawer .screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:782px){body.admin-bar .bscc-topbar,body.admin-bar .tb-drawer{top:46px}body.admin-bar{--bscc-tb-off:calc(var(--bscc-tb-h) + 46px)}}
@media(max-width:768px){:root{--bscc-tb-h:48px}}
@media(max-width:600px){.tb-brand-full{display:none}.tb-brand-short{display:inline}.tb-brand{font-size:15px}}
@media(max-width:480px){.tb-user-name{display:none}}
@media(max-width:400px){.tb-login-text{font-size:13px}}
@media(prefers-reduced-motion:reduce){.tb-drawer{transition:none;background:var(--paper);}}
body.bscc-topbar-hidden .bscc-topbar{display:none}
body.bscc-has-topbar.bscc-topbar-hidden{padding-top:0}
html:fullscreen .bscc-topbar,body:fullscreen .bscc-topbar{display:none}

.bscc-topbar.is-scrolled{box-shadow:var(--sh-3);border-bottom-color:transparent}
.tb-login:hover,.tb-logout:hover{background:var(--paper-2)}
