/* css/header-shell.css - 顶部导航外壳：置顶/置底浮动按钮、汉堡菜单、玩家 HUB
   从 lib/header.php 内联 <style> 抽出，目的：全站复用同一份缓存，不再随每次 HTML 下发。 */
#tt-scroll-fabs{opacity:0;pointer-events:none;transform:translateY(12px);z-index:145;}
#tt-scroll-fabs.show{opacity:1;pointer-events:auto;transform:none;}
.tt-fab{width:50px;height:50px;border:0;padding:0;background-color:transparent;background-repeat:no-repeat;background-position:center;background-size:contain;cursor:pointer;transition:transform .18s ease,filter .18s ease;filter:drop-shadow(0 0 6px rgba(0,0,0,.6));}
.tt-fab:hover{transform:scale(1.1);}
.tt-fab:active{transform:scale(.94);}
/* 箭头改用 WebP（96x96 带透明通道）：原 PNG 每张 12.9-15.6KB，WebP 为 2.9-3.8KB，
   桌面端首屏两张合计 28.5KB → 7.0KB。原本 :active 指向的 -3 文件从未存在，按下必 404，
   这里去掉这两条，按压反馈由上面的 transform:scale(.94) 负责。 */
.tt-fab-top{background-image:url('/img/ui/arrow-top-1.webp');}
.tt-fab-top:hover{background-image:url('/img/ui/arrow-top-2.webp');}
.tt-fab-bottom{background-image:url('/img/ui/arrow-bottom-1.webp');}
.tt-fab-bottom:hover{background-image:url('/img/ui/arrow-bottom-2.webp');}
/* 置顶/置底箭头：仅 PC 端使用，手机与平板直接隐藏，避免遮挡内容 */
@media (max-width:1024px){#tt-scroll-fabs{display:none!important;}}
.tt-menu{opacity:0;transform:translateY(-14px) scale(.97);transform-origin:top right;pointer-events:none;transition:opacity .3s ease,transform .32s cubic-bezier(.22,1,.36,1);}
.tt-menu.open{opacity:1;transform:none;pointer-events:auto;}
/* 右上角控制坞：统一高度/间距的玻璃面板 */
.tt-dock{padding:0;border-radius:0;background:transparent;border:0;backdrop-filter:none;}
@media(max-width:640px){.tt-dock{padding:.2rem;}}
/* 玩家 HUB（紧邻 logo 右侧）：新手村进度 / 等级+积分+游戏币；无底色无边框，纯链接直达个人中心 */
.tt-chip-ava{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;}
.tg-hub{position:relative;display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none;transition:opacity .2s;}
.tg-hub-wrap{position:relative;display:inline-flex;min-width:0;}
.tg-hub:hover{opacity:.88;}
.tg-hub-ava{width:40px;height:40px;flex:0 0 40px;display:inline-flex;align-items:center;justify-content:center;
    border:1px solid rgb(var(--color-main) / .5);background:rgba(0,0,0,.35);
    clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);}
.tg-hub-ava .avx-img{border-radius:0;opacity:1;border:0}
/* 头像框头部特写：--hy=头部垂直位置，--hz=放大倍率（由 avatar_head_crop 按立绘构图输出） */
.avx > .avx-img{object-position:50% var(--hy,50%)!important;transform:scale(var(--hz,1));transform-origin:50% var(--hy,50%)}
.avx:hover > .avx-img{transform:scale(calc(var(--hz,1) * 1.06))}
.tg-hub.is-guest .tg-hub-ava{opacity:.85}
/* 毕业尊贵态：金边 + 皇冠徽章 + 柔光 */
.tg-hub.is-premium .tg-hub-ava{border-color:rgb(var(--color-gold, 255 205 90) / .85);
    box-shadow:0 0 16px rgb(var(--color-gold, 255 205 90) / .45),inset 0 0 12px rgb(var(--color-gold, 255 205 90) / .18)}
.tg-hub.is-premium .tg-hub-main{color:rgb(var(--color-gold, 255 205 90));letter-spacing:.08em;
    text-shadow:0 0 14px rgb(var(--color-gold, 255 205 90) / .55)}
.tg-hub.is-premium .tg-hub-sub{color:rgba(255,255,255,.72)}
.tg-hub-badge{display:none;position:absolute;left:-6px;top:-7px;width:20px;height:20px;align-items:center;justify-content:center;
    background:linear-gradient(160deg,rgb(var(--color-gold, 255 205 90)),#c78d1f);color:#2b1a00;font-size:11px;
    clip-path:polygon(50% 0,100% 26%,100% 74%,50% 100%,0 74%,0 26%);box-shadow:0 0 14px rgb(var(--color-gold, 255 205 90) / .8)}
.tg-hub.is-lvlup .tg-hub-ava{animation:tgLvPulse 1.3s ease-in-out 2}
@keyframes tgLvPulse{0%,100%{box-shadow:0 0 0 rgb(var(--color-gold,255 205 90) / 0)}50%{box-shadow:0 0 30px rgb(var(--color-gold,255 205 90) / .95)}}
/* 管理员 HUB：主色铭牌感 */
.tg-hub.is-boss .tg-hub-main{color:rgb(var(--color-main));letter-spacing:.1em}
.tg-hub.is-boss .tg-hub-ava{border-color:rgb(var(--color-main) / .8);box-shadow:0 0 14px rgb(var(--color-main) / .4)}
.tg-hub-badge{pointer-events:none}
.tg-hub-tx{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.tg-hub-main{font-family:'SF TransRobotics','Zpix',sans-serif;font-size:14px;font-weight:700;letter-spacing:.05em;color:#fff;
    text-shadow:0 0 12px rgb(var(--color-main) / .45);white-space:nowrap}
.tg-hub-sub{font-style:normal;font-size:10.5px;letter-spacing:.04em;color:#8592a6;white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:520px){.tg-hub-sub{display:none}.tg-hub-main{font-size:11px}.tg-hub-ava{width:32px;height:32px;flex-basis:32px}.tg-hub{gap:8px}.tt-dock .cyber-nav-btn span{display:none}.tt-dock .cyber-nav-btn{padding-left:8px;padding-right:8px}}
