/* =====================================================================
   6SQ统计 · 前台风格切换器 UI
   右下角浮动按钮 + 风格选择面板（专业、克制、不喧宾夺主）
   ===================================================================== */

.ts-toggle{
  position:fixed;right:22px;bottom:22px;z-index:99999;
  width:52px;height:52px;border-radius:50%;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#1f3a5f,#0a1838);
  color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.28);
  transition:transform .2s ease,box-shadow .2s ease;
}
.ts-toggle:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 14px 30px rgba(0,0,0,.34);}
.ts-toggle svg{width:24px;height:24px;}
.ts-toggle .ts-dot-badge{
  position:absolute;top:6px;right:6px;width:11px;height:11px;border-radius:50%;
  border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.3);
}

.ts-panel{
  position:fixed;right:22px;bottom:84px;z-index:99999;
  width:236px;background:#fff;border-radius:16px;
  box-shadow:0 20px 50px rgba(15,23,42,.22);
  padding:14px;opacity:0;visibility:hidden;transform:translateY(8px) scale(.98);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  border:1px solid #eef2f8;
}
.ts-panel.open{opacity:1;visibility:visible;transform:none;}
.ts-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:2px 4px 10px;border-bottom:1px solid #f0f3f8;}
.ts-panel-head b{font-size:13px;color:#1f2733;font-weight:700;letter-spacing:.3px;}
.ts-panel-head span{font-size:11px;color:#94a3b8;}
.ts-opt{
  display:flex;align-items:center;gap:12px;width:100%;
  padding:10px 10px;border:1px solid transparent;border-radius:11px;
  background:none;cursor:pointer;text-align:left;transition:.18s ease;
}
.ts-opt:hover{background:#f4f7fc;}
.ts-opt.active{background:#eaf2ff;border-color:#c7dbff;}
.ts-dot{width:22px;height:22px;border-radius:7px;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);}
.ts-opt .ts-name{font-size:14px;color:#1f2733;font-weight:600;flex:1;}
.ts-opt .ts-check{width:16px;height:16px;color:#2563eb;opacity:0;transition:.18s;}
.ts-opt.active .ts-check{opacity:1;}
.ts-foot{margin-top:10px;padding:9px 4px 2px;border-top:1px solid #f0f3f8;font-size:11px;color:#94a3b8;line-height:1.5;}

@media (max-width:480px){
  .ts-toggle{right:16px;bottom:16px;width:48px;height:48px;}
  .ts-panel{right:16px;bottom:74px;width:208px;}
}