html.room-page, html.room-page body{
  width:100%;height:100%;
  overflow-x:hidden;overflow-y:auto;
}
html.room-page .page{
  width:1920px;height:100vh;min-height:100vh;
  box-sizing:border-box;
  overflow:hidden;transform:none;
  padding-top:52px;
}
html.room-page .nav{
  position:fixed;top:0;z-index:10;
  width:1920px;
}
.page .row{height:calc(100vh - 52px);align-items:flex-start}
.page .charle{
  position:fixed !important;
  top:52px;left:1540px;
  width:380px;height:calc(100vh - 52px);
  padding:24px 26px 18px 26px;
  z-index:9;
  display:flex;flex-direction:column;
}
.page .charle .log{flex:1;min-height:0;overflow:auto}
.page .charle .ask{flex:none}

.left-col{
  width:1540px;height:calc(100vh - 52px);flex:none;
  display:flex;flex-direction:row;
  background:#141518;
}
.charle .back{
  display:inline-block;align-self:flex-start;
  margin:0 0 14px 2px;padding:0;border:0;background:none;
  color:#c4a876;text-decoration:none;letter-spacing:.16em;font-size:13px;
}
.charle .back:hover{color:#e2c89a}
.charle h1{margin:0 0 14px}
.charle .back + .back{margin-top:-6px}

.cat-rail{
  width:220px;flex:none;
  box-sizing:border-box;
  padding:18px 14px 24px;
  display:flex;flex-direction:column;gap:6px;
  background:linear-gradient(180deg,#24262a 0%,#18191c 100%);
  border-right:1px solid rgba(196,168,118,.28);
}
.cat-h{
  margin:0 0 8px 8px;padding:0 0 0 12px;
  border-left:2px solid #c4a876;color:#f3efe6;
  font:600 15px/1.3 "Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  letter-spacing:.16em;
}
.cat-rail button{
  height:42px;width:100%;
  border:1px solid rgba(196,168,118,.38);
  background:transparent;
  color:#d8d4cc;
  font:600 14px/1.2 "Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  letter-spacing:.1em;border-radius:2px;cursor:pointer;
  text-align:left;padding:0 14px;
}
.cat-rail button:hover{border-color:rgba(220,192,140,.85);color:#f3efe6}
.cat-rail button.on{
  border-color:rgba(220,192,140,.9);
  background:rgba(196,168,118,.14);
  color:#f3efe6;
  box-shadow:inset 3px 0 0 #c4a876;
}

.list-pane{
  flex:1;min-width:0;min-height:0;
  display:flex;flex-direction:column;
  background:
    linear-gradient(90deg,rgba(196,168,118,.04) 0,transparent 48px),
    linear-gradient(180deg,#1c1e22,#141518);
}
.list-h{
  flex:none;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding:14px 22px 4px;
}
.list-title{
  padding:0 0 0 12px;border-left:2px solid #c4a876;
  color:#f3efe6;letter-spacing:.14em;
  font:600 16px/1.3 "Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
}
.list-count{color:#c4a876;letter-spacing:.12em;font-size:13px}
.list-note{
  flex:none;
  margin:0 22px 10px;
  padding:10px 12px;
  border:1px solid rgba(196,168,118,.16);
  border-left:3px solid rgba(196,168,118,.45);
  background:rgba(28,26,22,.55);
  color:#b8b0a4;
  font-size:12px;
  letter-spacing:.06em;
  line-height:1.7;
}
.list-body{flex:1;min-height:0;overflow:auto;padding:4px 16px 28px}

.list-row{
  display:grid;
  grid-template-columns:1fr 168px;
  gap:14px;
  align-items:center;
  min-height:54px;
  margin:0 0 5px;
  padding:10px 12px 10px 14px;
  border:1px solid rgba(196,168,118,.2);
  border-left:3px solid rgba(196,168,118,.4);
  border-radius:2px;
  background:rgba(26,28,32,.94);
  color:#e8e2d6;
  cursor:pointer;
  box-shadow:0 1px 0 rgba(0,0,0,.16);
}
.list-row:nth-child(even){background:rgba(30,32,36,.9)}
.list-row:hover{
  border-color:rgba(220,192,140,.5);
  border-left-color:rgba(220,192,140,.85);
  background:rgba(36,34,28,.95);
}
.list-main{min-width:0}
.list-name{
  color:#f3efe6;font-weight:600;line-height:1.35;
  font-size:15px;letter-spacing:.04em;
}
.list-q{
  display:block;margin-top:4px;
  color:#8f8a80;font-size:12px;font-weight:400;line-height:1.5;
}
.list-side{
  text-align:right;
  color:#c4a876;
  font-size:12px;
  letter-spacing:.1em;
  line-height:1.55;
}
.list-cat{display:block;color:#c4a876}
.list-date{display:block;color:#8f8a80;margin-top:4px;letter-spacing:.06em}
.list-empty{
  margin:18px 6px;
  padding:16px 18px;
  border:1px dashed rgba(196,168,118,.32);
  border-left:3px solid rgba(196,168,118,.5);
  background:rgba(28,26,22,.45);
  color:#c4c0b6;font-size:14px;line-height:1.8;
}

.beian{margin:16px 24px 20px;font-size:12px}
.beian a{color:#9a958c;text-decoration:none;letter-spacing:.06em}
.beian a:hover{color:#c4a876}