/* A3：公共组件独立作用域，正文继续使用各页原有版式。 */
:is(.topbar.v2,.site-footer.v2,.tabbar.v2){--paper:#FAF8F2;--card:#FFFFFF;--ink:#20332C;--muted:#53645C;--line:#D8DFD6;--primary:#315E48;--primary-hover:#284F3C;--primary-active:#224332;
 --serif:"Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC","SimSun",serif;--sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;
 --pad:20px;--gap:40px;--tab-h:64px;--safe-b:env(safe-area-inset-bottom,0px);--tone:#315E48;--tone-bg:#EDF4EE;--read-fs:18px}

:is(header.topbar.v2,footer.site-footer.v2){max-width:960px;margin-inline:auto;padding-inline:var(--pad);box-sizing:content-box}
:is(.topbar.v2,.site-footer.v2,.tabbar.v2){font:18px/1.8 var(--sans);color:var(--ink)}
:is(.topbar.v2,.site-footer.v2,.tabbar.v2) a{color:var(--primary);text-underline-offset:4px}
:is(.topbar.v2,.site-footer.v2,.tabbar.v2) :focus-visible{outline:2px solid var(--primary);outline-offset:2px}
:is(.topbar.v2,.tabbar.v2) .icon{width:24px;height:24px;flex:none}
.topbar.v2 .brand{font-family:var(--serif);font-weight:700;line-height:1.4}
.topbar.v2 .menu-panel nav{gap:4px 8px}
:is(.topbar.v2,.site-footer.v2,.tabbar.v2) a[aria-current=page]{text-decoration:none}
.tabbar.v2{gap:0}
.tabbar.v2 a{padding:0}
header.topbar.v2{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px;min-height:64px;padding-block:8px;position:relative;border-bottom:1px solid var(--line)}
.topbar.v2 .brand{display:inline-flex;align-items:center;min-height:44px;font-size:24px;letter-spacing:.12em;text-decoration:none;color:var(--ink);white-space:nowrap;flex:none}
.topbar.v2 .topbar-actions{display:flex;gap:4px;align-items:center;min-width:0}
.topbar.v2 .icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:44px;min-width:44px;padding:0 8px;border-radius:10px;color:var(--primary);font-size:16px;line-height:1.4;text-decoration:none;cursor:pointer;list-style:none;background:none;border:0}
.topbar.v2 .icon-btn::-webkit-details-marker{display:none}.topbar.v2 .icon-btn:hover{background:var(--tone-bg)}.topbar.v2 .icon-btn:active{background:#DCE8DF}
.topbar.v2 .menu{position:static}.topbar.v2 .menu[open]>.icon-btn{background:var(--tone-bg)}
.topbar.v2 .menu .i-menu,.topbar.v2 .menu .t-menu{display:inline-flex}.topbar.v2 .menu .i-close,.topbar.v2 .menu .t-close{display:none}
.topbar.v2 .menu[open] .i-menu,.topbar.v2 .menu[open] .t-menu{display:none}.topbar.v2 .menu[open] .i-close,.topbar.v2 .menu[open] .t-close{display:inline-flex}
.topbar.v2 .menu-panel{position:absolute;right:var(--pad);top:calc(100% + 6px);z-index:50;width:min(300px,calc(100vw - 2*var(--pad)));box-sizing:border-box;padding:8px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 28px rgba(32,51,44,.14)}
.topbar.v2 .menu-panel nav{display:flex;flex-direction:column}
.topbar.v2 .menu-panel nav a{display:flex;align-items:center;min-height:48px;padding:0 14px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:17px}
.topbar.v2 .menu-panel nav a:hover{background:var(--tone-bg)}.topbar.v2 .menu-panel nav a:active{background:#DCE8DF}
.topbar.v2 .menu-panel nav a[aria-current=page]{color:var(--primary);font-weight:700;background:var(--tone-bg)}
.topbar.v2 .sound-toggle{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;margin-top:6px;padding:0 14px;border:0;border-top:1px solid var(--line);border-radius:0 0 10px 10px;background:none;color:var(--ink);font:16px/1.4 var(--sans);cursor:pointer;text-align:left}
.topbar.v2 .sound-toggle[hidden],.topbar.v2 .sound-toggle[hidden]+.sound-note{display:none}
.topbar.v2 .sound-toggle .i-on,.topbar.v2 .sound-toggle .i-off{display:inline-flex;color:var(--primary)}.topbar.v2 .sound-toggle .i-off,.topbar.v2 .sound-toggle.is-off .i-on{display:none}.topbar.v2 .sound-toggle.is-off .i-off{display:inline-flex;color:var(--muted)}
.topbar.v2 .sound-toggle b{color:var(--primary)}.topbar.v2 .sound-toggle.is-off b{color:var(--muted)}
.topbar.v2 .sound-note{font-size:14px;line-height:1.6;color:var(--muted);margin:0;padding:0 14px 6px}
footer.site-footer.v2{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;margin-top:44px;padding-block:20px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
footer.site-footer.v2 a{display:inline-flex;align-items:center;min-height:44px}
:is(.v2 .tabbar, .tabbar.v2){position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);max-width:none;margin:0;padding:0 0 var(--safe-b);background:rgba(255,255,255,.98);border-top:1px solid var(--line);box-shadow:0 -2px 10px rgba(32,51,44,.06)}
:is(.v2 .tabbar, .tabbar.v2) a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:var(--tab-h);min-width:0;font-size:14px;line-height:20px;color:var(--muted);text-decoration:none;font-weight:500}
:is(.v2 .tabbar, .tabbar.v2) a[aria-current=page]{color:var(--primary);font-weight:700}
:is(.v2 .tabbar, .tabbar.v2) a[aria-current=page]::after{content:"";position:absolute;top:6px;left:calc(50% + 15px);width:6px;height:6px;border-radius:50%;background:var(--primary)}

:is(.topbar.v2 .icon-btn,.topbar.v2 .sound-toggle,.tabbar.v2 a){transition:transform .12s ease-out,background-color .12s ease-out}
:is(.topbar.v2 .icon-btn,.topbar.v2 .sound-toggle,.tabbar.v2 a):active{transform:translateY(1px)}
body:has(> .tabbar.v2){padding-bottom:calc(81px + env(safe-area-inset-bottom,0px))}
@media(max-width:359.98px){:is(.topbar.v2,.site-footer.v2,.tabbar.v2){--pad:16px}.topbar.v2 .brand{font-size:22px;letter-spacing:.06em}.topbar.v2 .icon-btn{padding:0 6px}}
@media(min-width:600px){:is(.topbar.v2,.site-footer.v2,.tabbar.v2){--pad:32px}}
@media(min-width:900px){nav.tabbar.v2{left:50%;right:auto;transform:translateX(-50%);width:min(640px,100%);border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0}}
@media(prefers-reduced-motion:reduce){:is(.topbar.v2,.site-footer.v2,.tabbar.v2) *{transition:none!important;scroll-behavior:auto!important}}
