/* ============================================================
   工具箱 · 首页右侧第八枚悬浮气泡
   ------------------------------------------------------------
   与「数字西湖」「反省墙」「五十三参」「刹车大师」「案例馆」
   「实验室」同一容器 #side-bubbles（flex 竖排）。

   几何参数与 lab-bubble.css 的 V6.0 窄条规格逐项一致：
   20px 宽、圆角 6px、图标 12px、竖排文字 10px。
   配色取天蓝（#38bdf8 → #0369a1），与工具箱页面同色系。

   为什么样式单独成文件：Z-Blog 模板引擎会把 { } 当模板标签，
   内联 <style> 里的 #id{...} 会被误判。
   ============================================================ */

#side-bubbles #toolbox-bubble{
    position:relative;
    display:block;
    width:20px !important;
    min-width:20px !important;
    max-width:20px !important;
    margin:0 !important;
    padding:0 !important;
    background:none;
    border:0;
    color:#f0f9ff;
    text-align:center;
    text-decoration:none;
    transition:transform .3s cubic-bezier(.2,.8,.24,1), filter .3s;
    -webkit-tap-highlight-color:transparent;
    outline:none;
}

#side-bubbles #toolbox-bubble .tb-core{
    width:20px !important;
    min-width:20px !important;
    max-width:20px !important;
    padding:8px 1px !important;
    border-radius:6px 0 0 6px !important;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    background:linear-gradient(158deg,#38bdf8 0%,#0ea5e9 46%,#0369a1 100%);
    box-shadow:-2px 2px 6px rgba(0,0,0,.18);
}

#side-bubbles #toolbox-bubble .tb-ico{
    width:12px !important;
    height:12px !important;
    margin:0 auto 3px auto !important;
    filter:drop-shadow(0 0 4px rgba(224,244,255,.5));
}

#side-bubbles #toolbox-bubble .tb-txt{
    font-size:10px !important;
    line-height:1.05;
    letter-spacing:0.5px !important;
    writing-mode:vertical-rl;
    text-orientation:upright;
    transform:scale(0.85);
    transform-origin:center top;
    white-space:nowrap;
    padding:0 !important;
    font-weight:600;
    text-shadow:0 1px 2px rgba(0,0,0,.22);
}

#toolbox-bubble:hover,
#toolbox-bubble:focus-visible{
    transform:translateX(-5px);
    filter:brightness(1.08);
    color:#ffffff;
}
#toolbox-bubble:hover .tb-core,
#toolbox-bubble:focus-visible .tb-core{
    box-shadow:-3px 3px 12px rgba(14,165,233,.45);
}
#toolbox-bubble:active{ transform:translateX(-2px); }

@media (prefers-reduced-motion:reduce){
    #toolbox-bubble{ transition:none; }
}