div.Online,div.Work,div.Prompt,div.sys,div.JiF {
  background: #7ba;
  padding: 5px 3px;
  border-radius: 10px;
}
div.Work {
  background: #ae3;
}
div.Prompt {
  background: #ea3;
}
div.sys{
  background:#aa3;
  font-size: 12px;
  padding:0 1px;
  text-align: center;
  div{
    margin:0 5px;
  }
}
div.JiF{
  background:#3a3;
}
DIv.flex-vertical .flex-vertical#id_12 {
  /* grid-column: span 2; */
}
.flex-vertical.List{
  flex-direction: row;
}
.TSC .flex-horizontal {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
#id_1 .form-row{
  /* grid-template-columns: 3fr 7fr; */
}
div.JDT, div.JDT div {
  border-radius: 15px;
  margin:2px 0;
      font-size: 12px;
}
div.SYS{
  /* grid-template-columns:20px 1fr; */
  display:flex;
  flex-direction: column;
  grid-row: 1/4;
  font-size:small;
  .SYSL{
    grid-auto-flow:row;
    #os{
      grid-row: 1/3;
      grid-column: 1/2;
    }
    #display{
      grid-row: 1/2;
      grid-column: 2/3;
    }
    #cpu{
      grid-row: 2/3;
      grid-column: 2/3;
    }
    #GPU{
      grid-row: 3/4;
      grid-column: 1/3;
    }
    #ram{
      grid-row: 4/5;
      grid-column: 1/2;
    }
    #net{
      grid-row: 4/5;
      grid-column: 2/3;
    }
    #disk{
      grid-row: 5/6;
      grid-column: 1/2;
    }
    #count {
      grid-row: 6/7;
      grid-column: 1/2;
    }
    #cpuL {
      grid-row: 4/7;
      grid-column: 2/3;
    }
    #diskfs{
      grid-row: 7/8;
      grid-column: 1/3;
    }
    #nets {
      grid-row: 8/9;
      grid-column: 1/3;
    }
  }
}
.SYS,.TSC,.flex-vertical.List,.KB {
  grid-template-columns: 20px 1fr;
  display:grid;
  align-items: center;
}
.CON .flex-vertical .flex-vertical.DL{
  /* display:flex; */
}
.CV {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
  .JDTI{
    margin:1px;
    height:120px;
    border-radius:15px;
    div{
      border-radius:15px;
      writing-mode: sideways-lr;
    }
  }
  div#jd{
    width: 16px;
    font-size:12px;
  }
}
.DD {
  display: flex;
  flex-direction: row;
}
.VV {
  div#jd{
    width: 16px;
    font-size:12px;
  }
}
div#mapJF ,div#OnLine {
  /* height: 215px; */
}
div.prompt {
  text-align:left;
  padding: 3px;
  border-radius: 10px;
}
div.prompt:before {
  background-color:green;
  color:white;
  font-weight:900;
  padding:3px;
  border-radius:3px;
}
div.Prompt {
  #chat{
    background-color: #ebf;
  }
  #chat:before{
    content:'聊天';
  }
  #translate{
    background-color: #eda;
  }
  #translate:before{
    content:'翻译';
  }
  #image{
    background-color: #dcf;
  }
  #image:before{
    content:'生图';
  }
  #audio{
    background-color: #eef;
  }
  #audio:before{
    content:'音频';
  }
  #music{
    background-color: #ecf;
  }
  #music:before{
    content:'音乐';
  }
  #video{
    background-color: #eac;
  }
  #video:before{
    content:'视频';
  }
}
img.KBimg {
  height: 500px;
}
div.Log#Images {
  width: 100%;
}.CCL {
  display: flex;
  width: fit-content;
  overflow: auto;
  div{
    margin: 3px;
  }
}
button#rushCache ,label[for=rushKB]{
  padding: 3px;
  box-shadow: 2px 2px 12px black;
  font-size:14px;
}
.flex-vertical .flex-vertical .flex-horizontal{
}
.flex-vertical .flex-vertical div.flex-horizontal.FS {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(60px,1fr));
  align-items: center;
}
.flex-vertical.FF {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
}
.seachBar .form-row{
  display:flex;
}
.flex-vertical.SYSL {
  display: grid;
  width: 100%;
  height: 100%;
  gap: 5px;
  padding:3px 3px;
  background-color: #a9d7ff;
  Flex-wrap: wrap;
  border-radius:10px;
  grid-template-columns: repeat(auto-fit,minmax(140px,1fr));
}
.info-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.NNet {
  display: grid;
  background-color:#a190a2;
  text-align: center;
  margin:12px 0;
  padding:2px;
  border-radius:5px;
  .Net{
    margin:3px;
    border-radius:5px;
    padding:3px;
    background:#3ef;
  }
  #Niface:before{
    content:'网卡: ';
  }
  #Niface{
    grid-column:1/2;
    grid-row:1/2;
  }
  div#Nip4 {
    grid-column: 2/3;
    grid-row:1/2;
  }
  #Nip4:before{
    content:'IP4地址: ';
  }
  div#Nip6 {
    grid-column: 1/4;
    grid-row: 2/3;
  }
  #Nip6:before{
    content:'IP6地址: ';
  }
  div#Nspeed {
    grid-column: 3/4;
    grid-row: 1/2;
  }
  #Nspeed:before{
    content:'网卡速率: ';
  }
}
span.info-label {
  /* font-size: large; */
  font-weight: 900;
}
.NETS {
  display: grid;
  background: #eea2fa;
  text-align:center;
  .Net{
    margin:2px;
    border-radius:5px;
    padding:3px;
    background-color:#eafe2a;
  }
  .Net::before{
    font-size: large;
    color: aqua;
    font-weight: 900;
  }
  #iface{
    grid-column:1/2;
    grid-row:1/3;
    color:#33efaa;
    font-size: larger;
    padding: 22px 0;
    font-weight: 900;
  }
  #iface::before{
    /* content:'网卡: '; */
  }
  #rx{
    grid-column:2/3;
    grid-row:1/2;
  }
  #tx{
    grid-column:2/3;
    grid-row:2/3;
  }
  #rx_bytes{
    grid-column:3/4;
    grid-row:1/2;
  }
  #rx_bytes::before,#tx_bytes::before{
    content:'总: ';
  }
  #rx_dropped{
    grid-column:4/5;
    grid-row:1/2;
  }
  #rx_dropped::before,#tx_dropped::before{
    content:'丢: ';
  }
  #rx_errors{
    grid-column:5/6;
    grid-row:1/2;
  }
  #rx_errors::before,#tx_errors::before{
    content:'错: ';
    color:red;
  }
  #rx_sec{
    grid-column:6/7;
    grid-row:1/2;
  }
  #rx_sec::before, #tx_sec::before {
    content:'速: ';
    color:green;
  }
  #tx_bytes{
    grid-column:3/4;
    grid-row:2/3;
  }
  #tx_dropped{
    grid-column:4/5;
    grid-row:2/3;
  }
  #tx_errors{
    grid-column:5/6;
    grid-row:2/3;
  }
  #tx_sec{
    grid-column:6/7;
    grid-row:2/3;
  }
}
.Login{
  .userLmenu{
    display:none;
    display: none;
    position: absolute;
    background: white;
    width: 90px;
    right: 0;
    cursor:default;
    border-radius: 10px;
    background: #ccc;
    /* justify-content: center; */
  }
  button{
    padding:3px;
    width:100%;
    background:black;
    border:unset;
  }
  button:hover{
    background:#ccc;
    color:red;
  }
}
.Login:hover{
  .userLmenu{
    display:block;
  }
}
.left{
}
.footer{
  /* bottom:0; */
  /* position:fixed; */
  width:100%;
  z-index: 10;
}
img.header {
  width: 45px;
  height: 45px;
}
.VV2V, .joinVIP,.oSER {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: smaller;
  padding: 0 3px;
  border-radius: var(--bordR);
}
.oSER{
  background: cornsilk;
  width:100%;
  border-radius:0 0 5px 5px;
}
.SERzt{
  background-color:#aef;
  border-radius: 5px 5px 0 0;
}
.joinVIP{
  flex-direction: column;
  gap:0;
  /* background-color:#eaf; */
  margin:0;
}
.VVV.uTop {
  background: aqua;
  width: 100%;
  border-radius: 10px;
  padding: 3px;
}
table.PT_tab tr:nth-child(even) {
  background: #ceecff;
}
h2 {
  margin: 100px 0 10px 0;
  text-shadow: 1px 1px #030;
  color: #4af;
}