/* 途灵智能门户 · 悬浮留言板 & 加入我们（科幻玻璃风） */
.cb-overlay{
  position:fixed; inset:0; z-index:50; display:none; opacity:0;
  background:radial-gradient(80% 70% at 30% 20%, rgba(60,80,180,.28), transparent 60%), rgba(3,5,12,.72);
  backdrop-filter:blur(16px) saturate(1.2); -webkit-backdrop-filter:blur(16px) saturate(1.2);
  transition:opacity .35s ease;
}
.cb-overlay.on{display:flex; opacity:1; align-items:center; justify-content:center; padding:24px}
.cb-panel{
  position:relative; width:min(920px, 96vw); max-height:86vh; border-radius:20px; overflow:hidden;
  background:linear-gradient(165deg, rgba(20,25,44,.92), rgba(9,12,24,.95));
  border:1px solid rgba(130,155,255,.20);
  box-shadow:0 40px 100px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.08);
  display:flex; flex-direction:column;
  transform:translateY(14px) scale(.985); transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.cb-overlay.on .cb-panel{transform:none}
.cb-panel::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(60% 40% at 50% -10%, rgba(120,150,255,.18), transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 30%);
}
.cb-head{
  position:relative; display:flex; align-items:center; justify-content:space-between;
  padding:20px 24px 14px; border-bottom:1px solid rgba(130,155,255,.12);
}
.cb-title{font-size:16px; font-weight:600; letter-spacing:.5px; color:#e8eeff; display:flex; align-items:center; gap:9px}
.cb-title i{width:7px;height:7px;border-radius:50%;background:#7d95ff;box-shadow:0 0 10px #7d95ff;animation:cbPulse 2.2s ease-in-out infinite}
@keyframes cbPulse{0%,100%{opacity:.4}50%{opacity:1}}
.cb-sub{font-size:12.5px; color:#a2b3d2; margin-top:3px; letter-spacing:.3px}
.cb-close{
  width:32px;height:32px;border-radius:9px;border:1px solid rgba(140,160,210,.18);
  background:rgba(255,255,255,.03); color:#c0cde8; cursor:pointer; font-size:18px; line-height:1;
  transition:all .2s;
}
.cb-close:hover{background:rgba(240,120,120,.14); border-color:rgba(240,120,120,.4); color:#ffc2c2}

/* 留言流：悬浮胶囊 */
.cb-stream{
  position:relative; flex:1; min-height:260px; overflow-y:auto; padding:22px 24px;
}
.cb-stream::-webkit-scrollbar{width:7px}
/* 轨道 / 滑块配色由 /portal/tl-scrollbar.css 全站统一提供 */
.cb-bubble{
  position:relative; margin:0 0 14px; padding:13px 16px; border-radius:14px;
  background:linear-gradient(150deg, rgba(38,46,74,.72), rgba(20,25,42,.72));
  border:1px solid rgba(130,155,255,.14);
  box-shadow:0 8px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
  animation:cbFloatIn .6s cubic-bezier(.16,1,.3,1) both, cbDrift 9s ease-in-out infinite;
  will-change:transform;
}
.cb-bubble:nth-child(3n){animation-delay:.05s, .8s}
.cb-bubble:nth-child(3n+2){animation-delay:.12s, 1.6s}
@keyframes cbFloatIn{from{opacity:0; transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes cbDrift{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.cb-meta{display:flex; align-items:center; gap:8px; margin-bottom:6px}
.cb-avatar{
  width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:12.5px;color:#0b1020;background:linear-gradient(140deg,#cfd9f5,#8fa6e8);font-weight:600;
}
.cb-name{font-size:13px; color:#c3cee6; letter-spacing:.3px}
.cb-time{font-size:12px; color:#93a5c6; margin-left:auto}
.cb-text{font-size:14px; color:#dbe3f4; line-height:1.7; word-break:break-word}
.cb-empty{text-align:center; color:#93a5c6; font-size:13.5px; padding:60px 0; letter-spacing:.5px}

/* 输入区 */
.cb-compose{
  position:relative; padding:14px 20px 18px; border-top:1px solid rgba(130,155,255,.12);
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  background:linear-gradient(180deg, rgba(12,16,30,.5), rgba(8,10,20,.8));
}
.cb-input{
  flex:1 1 200px; height:42px; border-radius:11px; padding:0 14px; font-size:14px;
  background:rgba(255,255,255,.04); border:1px solid rgba(130,155,255,.18); color:#e6ecfa; outline:none;
  transition:border .2s, box-shadow .2s;
}
.cb-input::placeholder{color:#93a5c6}
.cb-input:focus{border-color:rgba(130,160,255,.6); box-shadow:0 0 0 3px rgba(110,140,255,.14)}
.cb-send{
  height:42px; padding:0 22px; border:none; border-radius:11px; cursor:pointer;
  font-size:14.5px; font-weight:600; color:#101728;
  background:linear-gradient(135deg,#eef3fb,#c3cee0 55%,#e8eefa);
  box-shadow:0 8px 22px rgba(140,165,230,.25); transition:transform .18s, box-shadow .25s;
}
.cb-send:hover{transform:translateY(-1px); box-shadow:0 12px 28px rgba(150,175,240,.34)}
.cb-send:disabled{opacity:.6; cursor:not-allowed; transform:none}
.cb-note{width:100%; font-size:12.5px; color:#59657d; letter-spacing:.2px}
.cb-toast{
  position:absolute; left:50%; bottom:76px; transform:translateX(-50%) translateY(6px);
  padding:8px 16px; border-radius:9px; font-size:13.5px; opacity:0; pointer-events:none;
  background:rgba(24,32,54,.95); border:1px solid rgba(130,160,255,.3); color:#cfd9f0;
  transition:all .3s ease;
}
.cb-toast.on{opacity:1; transform:translateX(-50%)}

/* 加入我们表单 */
.cb-form{padding:22px 26px 26px; overflow-y:auto}
.cb-field{margin-bottom:15px}
.cb-label{display:block; font-size:13px; color:#8b98b3; margin-bottom:7px; letter-spacing:.3px}
.cb-label em{color:#7d95ff; font-style:normal; margin-left:3px}
.cb-textarea{
  width:100%; min-height:96px; resize:vertical; border-radius:12px; padding:12px 14px;
  font-size:14px; line-height:1.7; font-family:inherit;
  background:rgba(255,255,255,.04); border:1px solid rgba(130,155,255,.18); color:#e6ecfa; outline:none;
  transition:border .2s, box-shadow .2s;
}
.cb-textarea:focus{border-color:rgba(130,160,255,.6); box-shadow:0 0 0 3px rgba(110,140,255,.14)}
.cb-submit{width:100%; height:46px; margin-top:6px}
.cb-fine{font-size:12.5px; color:#59657d; margin-top:12px; text-align:center; letter-spacing:.2px}

/* 页脚可点击 */
.foot-link{color:#8ea6ff; cursor:pointer; text-decoration:none; border-bottom:1px dashed rgba(142,166,255,.45); transition:color .2s}
.foot-link:hover{color:#c2d1ff}