@netless/telebox-insider 1.0.0-alpha.3 → 1.0.0-alpha.30

package/dist/style.css

@@ -1 +1,650 @@
-.tele-fancy-scrollbar{overscroll-behavior:contain;overflow:auto;overflow-y:scroll;overflow-y:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.tele-fancy-scrollbar::-webkit-scrollbar{height:8px;width:8px}.tele-fancy-scrollbar::-webkit-scrollbar-track{background-color:transparent}.tele-fancy-scrollbar::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1);background-color:transparent;border-radius:4px;transition:background-color .4s}.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical{min-height:50px}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-box{position:absolute;top:0;left:0;z-index:100;transition:width .4s cubic-bezier(.4, .9, .71, 1.02),height .4s cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .4s ease}.telebox-box-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#f9f9fc;box-shadow:0 4px 10px 0 rgba(47,65,146,.15);border-radius:6px;border:1px solid #e3e3ec}.telebox-titlebar-wrap{flex-shrink:0;position:relative;z-index:1}.telebox-content-wrap{flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative}.telebox-content{width:100%;height:100%;position:relative}.telebox-footer-wrap{flex-shrink:0;display:flex;flex-direction:column}.telebox-footer-wrap::before{content:"";display:block;flex:1}.telebox-resize-handle{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;z-index:2147483647}.telebox-n{width:100%;height:5px;left:0;top:-5px;cursor:n-resize}.telebox-s{width:100%;height:5px;left:0;bottom:-5px;cursor:s-resize}.telebox-w{width:5px;height:100%;left:-5px;top:0;cursor:w-resize}.telebox-e{width:5px;height:100%;right:-5px;top:0;cursor:e-resize}.telebox-nw{width:15px;height:15px;top:-5px;left:-5px;cursor:nw-resize}.telebox-ne{width:15px;height:15px;top:-5px;right:-5px;cursor:ne-resize}.telebox-se{width:15px;height:15px;bottom:-5px;right:-5px;cursor:se-resize}.telebox-sw{width:15px;height:15px;bottom:-5px;left:-5px;cursor:sw-resize}.telebox-track-mask{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:fixed;top:0;left:0;z-index:2147483647;width:100%;height:100%;background:rgba(0,0,0,.0001);cursor:move}.telebox-cursor-n{cursor:n-resize}.telebox-cursor-s{cursor:s-resize}.telebox-cursor-w{cursor:w-resize}.telebox-cursor-e{cursor:e-resize}.telebox-cursor-nw{cursor:nw-resize}.telebox-cursor-ne{cursor:ne-resize}.telebox-cursor-se{cursor:se-resize}.telebox-cursor-sw{cursor:sw-resize}.telebox-maximized .telebox-resize-handles,.telebox-no-resize .telebox-resize-handles{display:none}.telebox-maximized{box-shadow:none;transition:none}.telebox-minimized{transition:width 50ms cubic-bezier(.4, .9, .71, 1.02),height 50ms cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .6s ease;opacity:0;pointer-events:none;user-select:none}.telebox-transforming{will-change:transform;transition:opacity .6s cubic-bezier(.7, 0, .84, 0)}.telebox-readonly .telebox-resize-handle{cursor:initial!important;pointer-events:none!important}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-box-main{color:#e9e9e9;background:#212126;border-color:#43434d}.telebox-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;box-sizing:border-box;height:26px;display:flex;align-items:center;background:#fff;user-select:none;border-bottom:1px solid #eeeef7;touch-action:manipulation}.telebox-title-area{padding-left:16px;overflow:hidden;position:relative;height:100%;flex:1;display:flex;align-items:center}.telebox-title{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;overflow:hidden;margin:0;padding:0;font-size:14px;font-weight:400;font-family:PingFangSC-Regular,PingFang SC;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;color:#191919}.telebox-drag-area{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;z-index:10}.telebox-titlebar-btns{padding-right:16px;white-space:nowrap;word-break:keep-all;margin-left:auto;font-size:0}.telebox-titlebar-btn{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;width:22px;height:22px;padding:0;outline:0;border:none;background:0 0;cursor:pointer}.telebox-titlebar-btn~.telebox-titlebar-btn{margin-left:10px}.telebox-titlebar-btn-icon{width:22px;height:22px}.telebox-readonly .telebox-titlebar-btn{cursor:not-allowed}.telebox-titlebar-icon-minimize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-titlebar-icon-maximize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==")}.telebox-titlebar-icon-maximize.is-active{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K")}.telebox-titlebar-icon-close{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}.telebox-color-scheme-dark .telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-box-stage-container{display:none;position:absolute;z-index:2100;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.telebox-box-stage-container.is-active{display:flex}.telebox-box-stage-mask{background:rgba(0,0,0,.05)}.telebox-box-stage-frame{flex:1;position:relative}.telebox-box-stage-frame-corner{position:absolute;width:8px;height:8px}.telebox-box-stage-frame-corner.is-0{top:0;left:0}.telebox-box-stage-frame-corner.is-1{top:0;right:0}.telebox-box-stage-frame-corner.is-2{bottom:0;left:0}.telebox-box-stage-frame-corner.is-3{bottom:0;right:0}.telebox-collector{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;visibility:hidden;display:block;position:absolute;z-index:200;width:40px;height:40px;margin:0;padding:0;border:none;outline:0;font-size:0;border-radius:50%;background:#fff;box-shadow:0 2px 6px 0 rgba(47,65,146,.15);cursor:pointer;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:18px 16px;background-position:center;-webkit-tap-highlight-color:transparent}.telebox-collector-visible{visibility:visible;pointer-events:initial}.telebox-collector-readonly{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-collector{background-color:#43434d}.telebox-max-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;display:none;position:absolute;top:0;left:0;z-index:50000}.telebox-max-titlebar .telebox-title{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title{display:block}.telebox-max-titlebar-maximized{display:flex}.telebox-titles{height:100%;margin:0;overflow-y:hidden;overflow-x:scroll;overflow-x:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.telebox-titles::-webkit-scrollbar{height:8px;width:8px}.telebox-titles::-webkit-scrollbar-track{background-color:transparent}.telebox-titles::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8);background-color:transparent;border-radius:4px;transition:background-color .4s}.telebox-titles:hover::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8)}.telebox-titles::-webkit-scrollbar-thumb:hover{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:active{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:vertical{min-height:50px}.telebox-titles::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-titles-content{height:100%;display:flex;flex-wrap:nowrap;align-items:center;padding:0}.telebox-titles-tab{height:100%;overflow:hidden;max-width:182px;min-width:50px;padding:0 26px 0 16px;outline:0;font-size:13px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;border:none;border-right:1px solid #e5e5f0;color:#7b88a0;background:0 0;cursor:pointer;user-select:none}.telebox-titles-tab-focus{color:#357bf6}.telebox-readonly .telebox-titles-tab{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-color-scheme-dark .telebox-titles-tab{border-right-color:#7b88a0}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}
+.tele-fancy-scrollbar {
+  overscroll-behavior: contain;
+  overflow: auto;
+  overflow-y: scroll;
+  overflow-y: overlay;
+  -webkit-overflow-scrolling: touch;
+  -ms-overflow-style: -ms-autohiding-scrollbar;
+  scrollbar-width: auto;
+}
+.tele-fancy-scrollbar::-webkit-scrollbar {
+  height: 8px;
+  width: 8px;
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-thumb {
+  background-color: rgba(68, 78, 96, 0.1);
+  background-color: transparent;
+  border-radius: 4px;
+  transition: background-color 0.4s;
+}
+.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb {
+  background-color: rgba(68, 78, 96, 0.1);
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(68, 78, 96, 0.2);
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active {
+  background-color: rgba(68, 78, 96, 0.2);
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical {
+  min-height: 50px;
+}
+.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal {
+  min-width: 50px;
+}
+.telebox-quarantine {
+  all: initial;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.telebox-body-wrap {
+  color: #191919;
+  color: var(--tele-boxColor, #191919);
+  flex: 1;
+  width: 100%;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+}
+.telebox-content {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background-color: #f9f9f9;
+  background-color: var(--tele-boxContainerBackground, #f9f9f9);
+}
+.telebox-box-stage {
+  position: absolute;
+  z-index: 1;
+  overflow: hidden;
+  background-color: #fff;
+  background-color: var(--tele-boxStageBackground, #fff);
+  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
+  box-shadow: var(--tele-boxStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.08));
+}
+.telebox-footer-wrap {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  color: #191919;
+  color: var(--tele-boxFooterColor, #191919);
+  background-color: #fff;
+  background-color: var(--tele-boxFooterBackground, #fff);
+}
+.telebox-footer-wrap::before {
+  content: "";
+  display: block;
+  flex: 1;
+}
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+.telebox-color-scheme-dark .telebox-body-wrap {
+  color: #e9e9e9;
+  color: var(--tele-boxColor, #e9e9e9);
+}
+.telebox-color-scheme-dark .telebox-content {
+  background-color: #25282e;
+  background-color: var(--tele-boxContainerBackground, #25282e);
+}
+.telebox-color-scheme-dark .telebox-box-stage {
+  background-color: #272a30;
+  background-color: var(--tele-boxStageBackground, #272a30);
+  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.24);
+  box-shadow: var(--tele-boxStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.24));
+}
+.telebox-color-scheme-dark .telebox-footer-wrap {
+  color: #e9e9e9;
+  color: var(--tele-boxFooterColor, #e9e9e9);
+  background-color: #383b42;
+  background-color: var(--tele-boxFooterBackground, #383b42);
+}
+.telebox-box {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 100;
+  transition: width 0.4s cubic-bezier(0.4, 0.9, 0.71, 1.02), height 0.4s cubic-bezier(0.55, 0.82, 0.63, 0.95), opacity 0.6s cubic-bezier(0.7, 0, 0.84, 0), transform 0.4s ease;
+}
+.telebox-box-main {
+  border: 1px solid #e3e3ec;
+  border: var(--tele-boxBorder, 1px solid #e3e3ec);
+  box-shadow: 0px 4px 10px 0px rgba(47, 65, 146, 0.15);
+  box-shadow: var(--tele-boxShadow, 0px 4px 10px 0px rgba(47, 65, 146, 0.15));
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  border-radius: 6px;
+}
+.telebox-titlebar-wrap {
+  flex-shrink: 0;
+  position: relative;
+  z-index: 1;
+}
+.telebox-main {
+  position: relative;
+  flex: 1;
+  width: 100%;
+  overflow: hidden;
+}
+.telebox-quarantine-outer {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.telebox-resize-handle {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  position: absolute;
+  z-index: 2147483647;
+  touch-action: none;
+}
+.telebox-n {
+  width: 100%;
+  height: 5px;
+  left: 0;
+  top: -5px;
+  cursor: n-resize;
+}
+.telebox-s {
+  width: 100%;
+  height: 5px;
+  left: 0;
+  bottom: -5px;
+  cursor: s-resize;
+}
+.telebox-w {
+  width: 5px;
+  height: 100%;
+  left: -5px;
+  top: 0;
+  cursor: w-resize;
+}
+.telebox-e {
+  width: 5px;
+  height: 100%;
+  right: -5px;
+  top: 0;
+  cursor: e-resize;
+}
+.telebox-nw {
+  width: 15px;
+  height: 15px;
+  top: -5px;
+  left: -5px;
+  cursor: nw-resize;
+}
+.telebox-ne {
+  width: 15px;
+  height: 15px;
+  top: -5px;
+  right: -5px;
+  cursor: ne-resize;
+}
+.telebox-se {
+  width: 15px;
+  height: 15px;
+  bottom: -5px;
+  right: -5px;
+  cursor: se-resize;
+}
+.telebox-sw {
+  width: 15px;
+  height: 15px;
+  bottom: -5px;
+  left: -5px;
+  cursor: sw-resize;
+}
+.telebox-track-mask {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 2147483647;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.0001);
+  cursor: move;
+}
+.telebox-cursor-n {
+  cursor: n-resize;
+}
+.telebox-cursor-s {
+  cursor: s-resize;
+}
+.telebox-cursor-w {
+  cursor: w-resize;
+}
+.telebox-cursor-e {
+  cursor: e-resize;
+}
+.telebox-cursor-nw {
+  cursor: nw-resize;
+}
+.telebox-cursor-ne {
+  cursor: ne-resize;
+}
+.telebox-cursor-se {
+  cursor: se-resize;
+}
+.telebox-cursor-sw {
+  cursor: sw-resize;
+}
+.telebox-maximized .telebox-resize-handles,
+.telebox-no-resize .telebox-resize-handles {
+  display: none;
+}
+.telebox-maximized {
+  box-shadow: none;
+  transition: none;
+}
+.telebox-minimized {
+  transition: width 0.05s cubic-bezier(0.4, 0.9, 0.71, 1.02), height 0.05s cubic-bezier(0.55, 0.82, 0.63, 0.95), opacity 0.6s cubic-bezier(0.7, 0, 0.84, 0), transform 0.6s ease;
+  opacity: 0;
+  pointer-events: none;
+  user-select: none;
+}
+.telebox-transforming {
+  will-change: transform;
+  transition: opacity 0.6s cubic-bezier(0.7, 0, 0.84, 0);
+}
+.telebox-readonly .telebox-resize-handle {
+  cursor: initial !important;
+  pointer-events: none !important;
+}
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+.telebox-color-scheme-dark .telebox-box-main {
+  border: 1px solid #383b42;
+  border: var(--tele-boxBorder, 1px solid #383b42);
+  box-shadow: 0px 4px 10px 0px rgba(56, 59, 66, 0.15);
+  box-shadow: var(--tele-boxShadow, 0px 4px 10px 0px rgba(56, 59, 66, 0.15));
+}.telebox-titlebar {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  box-sizing: border-box;
+  height: 26px;
+  display: flex;
+  align-items: center;
+  user-select: none;
+  touch-action: manipulation;
+  color: #191919;
+  color: var(--tele-titlebarColor, #191919);
+  background-color: #fff;
+  background-color: var(--tele-titlebarBackground, #fff);
+  border-bottom: 1px solid #eeeef7;
+  border-bottom: var(--tele-titlebarBorderBottom, 1px solid #eeeef7);
+}
+
+.telebox-title-area {
+  padding-left: 16px;
+  overflow: hidden;
+  position: relative;
+  height: 100%;
+  flex: 1;
+  display: flex;
+  align-items: center;
+}
+
+.telebox-title {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  color: #191919;
+  color: var(--tele-titlebarColor, #191919);
+  overflow: hidden;
+  margin: 0;
+  padding: 0;
+  font-size: 14px;
+  font-weight: 400;
+  font-family: PingFangSC-Regular, PingFang SC;
+  white-space: nowrap;
+  word-break: keep-all;
+  text-overflow: ellipsis;
+}
+
+.telebox-drag-area {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  z-index: 10;
+  touch-action: none;
+}
+
+.telebox-titlebar-btns {
+  padding-right: 16px;
+  white-space: nowrap;
+  word-break: keep-all;
+  margin-left: auto;
+  font-size: 0;
+}
+
+.telebox-titlebar-btn {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  width: 22px;
+  height: 22px;
+  padding: 0;
+  outline: none;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+}
+
+.telebox-titlebar-btn ~ .telebox-titlebar-btn {
+  margin-left: 10px;
+}
+
+.telebox-titlebar-btn-icon {
+  width: 22px;
+  height: 22px;
+}
+
+.telebox-readonly .telebox-titlebar-btn {
+  cursor: not-allowed;
+}
+
+.telebox-titlebar-icon-minimize {
+  background: center/cover no-repeat;
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=");
+  background-image: var(--tele-titlebarIconMinimize, url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo="));
+}
+
+.telebox-titlebar-icon-maximize {
+  background: center/cover no-repeat;
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==");
+  background-image: var(--tele-titlebarIconMaximize, url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg=="));
+}
+
+.telebox-titlebar-icon-maximize.is-active {
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K");
+  background-image: var(--tele-titlebarIconMaximizeActive, url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K"));
+}
+
+.telebox-titlebar-icon-close {
+  background: center/cover no-repeat;
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=");
+  background-image: var(--tele-titlebarIconClose, url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo="));
+}
+
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+
+.telebox-color-scheme-dark .telebox-title {
+  color: #e9e9e9;
+  color: var(--tele-titlebarColor, #e9e9e9);
+}
+
+.telebox-color-scheme-dark .telebox-titlebar {
+  color: #e9e9e9;
+  color: var(--tele-titlebarColor, #e9e9e9);
+  background-color: #383b42;
+  background-color: var(--tele-titlebarBackground, #383b42);
+  border-bottom: none;
+  border-bottom: var(--tele-titlebarBorderBottom, none);
+}.telebox-manager-container {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  --tele-managerContainerBackground: #f9f9f9;
+  --tele-managerStageBackground: #fff;
+  --tele-managerStageShadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
+  --tele-boxContainerBackground: #f9f9f9;
+  --tele-boxStageBackground: #fff;
+  --tele-boxStageShadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
+  --tele-boxColor: #191919;
+  --tele-boxBorder: 1px solid #e3e3ec;
+  --tele-boxShadow: 0px 4px 10px 0px rgba(47, 65, 146, 0.15);
+  --tele-boxFooterColor: #191919;
+  --tele-boxFooterBackground: #fff;
+  --tele-titlebarColor: #191919;
+  --tele-titlebarBackground: #fff;
+  --tele-titlebarBorderBottom: 1px solid #eeeef7;
+  --tele-titlebarTabColor: #7b88a0;
+  --tele-titlebarTabFocusColor: #357bf6;
+  --tele-titlebarTabBackground: transparent;
+  --tele-titlebarTabDividerColor: #e5e5f0;
+  --tele-collectorBackground: #fff;
+  --tele-collectorShadow: 0px 2px 6px 0px rgba(47, 65, 146, 0.15);
+  background: #f9f9f9;
+  background: var(--tele-managerContainerBackground, #f9f9f9);
+}
+.telebox-manager-container.telebox-is-maximized > .telebox-manager-stage, .telebox-manager-container.telebox-is-minimized > .telebox-manager-stage {
+  overflow: visible;
+}
+.telebox-manager-container.telebox-is-fullscreen .telebox-titlebar-icon-maximize,
+.telebox-manager-container.telebox-is-fullscreen .telebox-titlebar-icon-minimize {
+  display: none !important;
+}
+.telebox-manager-container.telebox-hide-fullscreen-titlebar .telebox-titlebar {
+  display: none !important;
+}
+.telebox-manager-stage {
+  position: relative;
+  overflow: hidden;
+  background: #fff;
+  background: var(--tele-managerStageBackground, #fff);
+  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
+  box-shadow: var(--tele-managerStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.08));
+}
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+.telebox-color-scheme-dark.telebox-manager-container {
+  --tele-managerContainerBackground: #25282e;
+  --tele-managerStageBackground: #272a30;
+  --tele-managerStageShadow: 0px 0px 16px rgba(0, 0, 0, 0.24);
+  --tele-boxContainerBackground: #25282e;
+  --tele-boxStageBackground: #272a30;
+  --tele-boxStageShadow: 0px 0px 16px rgba(0, 0, 0, 0.24);
+  --tele-boxColor: #e9e9e9;
+  --tele-boxBorder: 1px solid #383b42;
+  --tele-boxShadow: 0px 4px 10px 0px rgba(56, 59, 66, 0.15);
+  --tele-boxFooterColor: #e9e9e9;
+  --tele-boxFooterBackground: #383b42;
+  --tele-titlebarColor: #e9e9e9;
+  --tele-titlebarBackground: #383b42;
+  --tele-titlebarBorderBottom: none;
+  --tele-titlebarTabColor: #e9e9e9;
+  --tele-titlebarTabFocusColor: #357bf6;
+  --tele-titlebarTabBackground: transparent;
+  --tele-titlebarTabDividerColor: #7b88a0;
+  --tele-collectorBackground: #383b42;
+  --tele-collectorShadow: 0px 2px 6px 0px rgba(47, 65, 146, 0.15);
+  background: #25282e;
+  background: var(--tele-managerContainerBackground, #25282e);
+}
+.telebox-color-scheme-dark.telebox-manager-container > .telebox-manager-stage {
+  background: #272a30;
+  background: var(--tele-managerStageBackground, #272a30);
+  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.24);
+  box-shadow: var(--tele-managerStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.24));
+}.telebox-collector {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  visibility: hidden;
+  display: block;
+  position: absolute;
+  z-index: 5120;
+  width: 40px;
+  height: 40px;
+  margin: 0;
+  padding: 0;
+  border: none;
+  outline: none;
+  font-size: 0;
+  border-radius: 50%;
+  cursor: pointer;
+  user-select: none;
+  pointer-events: none;
+  background-repeat: no-repeat;
+  background-size: 18px 16px;
+  background-position: center;
+  -webkit-tap-highlight-color: transparent;
+  background-color: #fff;
+  background-color: var(--tele-collectorBackground, #fff);
+  box-shadow: 0px 2px 6px 0px rgba(47, 65, 146, 0.15);
+  box-shadow: var(--tele-collectorShadow, 0px 2px 6px 0px rgba(47, 65, 146, 0.15));
+}
+
+.telebox-collector-visible {
+  visibility: visible;
+  pointer-events: initial;
+}
+
+.telebox-collector-readonly {
+  cursor: not-allowed;
+}
+
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+
+.telebox-color-scheme-dark.telebox-collector {
+  background-color: #383b42;
+  background-color: var(--tele-collectorBackground, #383b42);
+  box-shadow: 0px 2px 6px 0px rgba(47, 65, 146, 0.15);
+  box-shadow: var(--tele-collectorShadow, 0px 2px 6px 0px rgba(47, 65, 146, 0.15));
+}.telebox-max-titlebar {
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  display: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  z-index: 5100;
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+}
+.telebox-max-titlebar .telebox-title {
+  display: none;
+}
+.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles {
+  display: none;
+}
+.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title {
+  display: block;
+}
+.telebox-max-titlebar-maximized {
+  display: flex;
+}
+.telebox-titles {
+  height: 100%;
+  margin: 0;
+  overflow-y: hidden;
+  overflow-x: scroll;
+  overflow-x: overlay;
+  -webkit-overflow-scrolling: touch;
+  -ms-overflow-style: -ms-autohiding-scrollbar;
+  scrollbar-width: auto;
+}
+.telebox-titles::-webkit-scrollbar {
+  height: 4px;
+  width: 4px;
+}
+.telebox-titles::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+.telebox-titles::-webkit-scrollbar-thumb {
+  background-color: rgba(238, 238, 247, 0.8);
+  background-color: transparent;
+  border-radius: 2px;
+  transition: background-color 0.4s;
+}
+.telebox-titles:hover::-webkit-scrollbar-thumb {
+  background-color: rgba(238, 238, 247, 0.8);
+}
+.telebox-titles::-webkit-scrollbar-thumb:hover {
+  background-color: #eeeef7;
+}
+.telebox-titles::-webkit-scrollbar-thumb:active {
+  background-color: #eeeef7;
+}
+.telebox-titles::-webkit-scrollbar-thumb:vertical {
+  min-height: 50px;
+}
+.telebox-titles::-webkit-scrollbar-thumb:horizontal {
+  min-width: 50px;
+}
+.telebox-titles-content {
+  height: 100%;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  padding: 0;
+}
+.telebox-titles-tab {
+  height: 100%;
+  overflow: hidden;
+  max-width: 182px;
+  min-width: 150px;
+  padding: 0 26px 0 16px;
+  outline: none;
+  font-size: 13px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  word-break: keep-all;
+  border: none;
+  border-right-width: 1px;
+  border-right-style: solid;
+  cursor: pointer;
+  user-select: none;
+  color: #7b88a0;
+  color: var(--tele-titlebarTabColor, #7b88a0);
+  background-color: transparent;
+  background-color: var(--tele-titlebarTabBackground, transparent);
+  border-right-color: #e5e5f0;
+  border-right-color: var(--tele-titlebarTabDividerColor, #e5e5f0);
+}
+.telebox-titles-tab-focus {
+  color: #357bf6;
+  color: var(--tele-titlebarTabFocusColor, #357bf6);
+}
+.telebox-readonly .telebox-titles-tab {
+  cursor: not-allowed;
+}
+.telebox-color-scheme-dark {
+  color-scheme: dark;
+}
+.telebox-color-scheme-dark .telebox-titles-tab {
+  color: #e9e9e9;
+  color: var(--tele-titlebarTabColor, #e9e9e9);
+  background-color: transparent;
+  background-color: var(--tele-titlebarTabBackground, transparent);
+  border-right-color: #7b88a0;
+  border-right-color: var(--tele-titlebarTabDividerColor, #7b88a0);
+}
+.telebox-color-scheme-dark .telebox-titles-tab-focus {
+  color: #357bf6;
+  color: var(--tele-titlebarTabFocusColor, #357bf6);
+}