.configui {
  background-color:var(--gray-10);
}
.configui .width-r {
  margin:0 auto;
}
.configui .navbar {
  width:100%;
  z-index:101 !important;
  color:var(--ultraviolet-20);
}
.configui .navbar::before {
  background-color:var(--ultraviolet-70);
  border-radius:inherit;
  bottom:0;
  content:"";
  left:0;
  position:absolute;
  right:0;
  top:0;
  z-index:-1;
 }
.configui .navbar img {
  width:37px;
  height:37px;
}
.configui .navbar ul {
  padding:10px;
  width:calc(100% - 20px);
}
.configui .navbar nav.width-r ul {
  padding:10px 0;
  width:100%;
 }
.configui .navbar ul li {
  padding:0 10px;
  width:unset;
  line-height:37px;
}
.configui .navbar ul li.logo {
  width:37px;
  height:37px;
  padding:0;
}
.configui .navbar ul li.logo-long {
  width:auto;
  height:37px;
  padding:0;
  margin-right:20px;
}
.configui .navbar ul li.logo-long a {
  opacity:1;
}
.configui .navbar ul li.logo-long a img {
  width:auto;
  height:37px;
}
.configui .navbar ul li.title {
  font-size:160%;
}
.configui .navbar ul li a {
  display:block;
}
.configui .navbar ul li.title a {
  opacity:1;
}
.configui .navbar ul li i.icon {
  background-color:var(--violet-10);
  width:20px;
  height:20px;
  margin:7px 0 0;
}
.configui .navbar ul li.title,
.configui .navbar ul li.selected a,
.configui .navbar ul li a:hover {
  color:var(--white-60);
}
.configui .ui-item {
  background-color:var(--white-60);
  border-radius:var(--radius);
  padding:10px;
  width:calc(100% - 32px);
  margin:8px 5px 2px;
  border:solid 1px var(--gray-10);
  float:left;
}
.configui .ui-item.right {
  float:right;
}
.configui .ui-slider > .ui-item {
  float:initial;
  display:inline-block;
}
.configui .ui-item:hover {
  border:solid 1px var(--gray-20);
}
.configui .ui-item.console {
  background-color:var(--black-60);
  color:var(--white-60);
  border-radius:var(--radius-more);
  border:none;
}
.configui .ui-item.clean {
  background-color:unset;
  padding:0 10px;
  min-height:unset !important;
}
.configui .ui-item.clean.title {
  font-size:120%;
  font-weight:bold;
  line-height:200%;
 }
.configui .ui-item.clean.title button,
.configui .ui-item.clean.title .button {
  float:right;
  font-size:0.8em;
  margin-left:6px;
  line-height:inherit;
}
.configui .ui-item.clean.small {
  font-size:80%;
}
.configui .ui-item.clean:hover {
  border:solid 1px var(--gray-10);
}
.configui .ui-slider {
  white-space:nowrap;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  -ms-overflow-style:-ms-autohiding-scrollbar;
  scrollbar-width:none;
  -ms-overflow-style:none;
  width:100%;
}
.configui .ui-slider::-webkit-scrollbar {
  display:none;
}
.configui .ui-item header nav {
  width:calc(100% + 20px);
  background-color:var(--gray-20);
  margin:-10px -10px 0;
  border-radius:var(--radius) var(--radius) 0 0;
}
.configui .ui-item header nav ul {
  padding:10px;
  width:calc(100% - 20px);
}
.configui .ui-item header nav ul li {
  width:auto;
  padding:0;
  line-height:12px;
  margin:2px;
}
.configui .ui-item header nav ul li i.icon {
  width:14px;
  height:14px;
  margin-right:0;
}
.configui .ui-item header nav ul li.close {
  display:none;
}
.configui .ui-item > article {
  width:100%;
  margin:6px 0;
}
.configui .ui-item.as-window {
  position:fixed;
  width:calc(100vw - 892px);
  height:calc(100vh - 902px);
  z-index:102;
  left:430px;
  right:unset;
  top:430px;
  bottom:unset;
  display:none;
}
.configui .ui-item.as-window.open {
  display:initial;
}
.configui .ui-item.as-window,
.configui .navbar {
  box-shadow:0 2px 5px var(--black-10o),0 2px 10px var(--black-10o);
}
.configui .ui-item.as-window.to-left {
  right:unset;
  left:4px;
}
.configui .ui-item.as-window.to-right {
  right:4px;
  left:unset;
}
.configui .ui-item.as-window.to-left,
.configui .ui-item.as-window.to-right {
  top:4px;
  bottom:unset;
  height:calc(100vh - 46px);
  width:400px;
}
.configui .ui-item.as-window.to-top {
  top:3px;
  bottom:unset;
}
.configui .ui-item.as-window.to-bottom {
  top:unset;
  bottom:10px;
}
.configui .ui-item.as-window.to-top,
.configui .ui-item.as-window.to-bottom {
  left:4px;
  right:unset;
  width:calc(100vw - 40px);
  height:400px;
  z-index:103;
}
.configui .ui-item.as-window .close {
  display:initial;
  cursor:pointer;
}
.configui .ui-group::after {
  content:" ";
  visibility:hidden;
  display:block;
  height:0;
  clear:both;
 }
.configui .navbar.frost::before {background-color:unset;}
.configui .navbar.frost {box-shadow:none;}
.configui li.title {
  list-style:none;
  margin-left:-18px;
}
.configui nav ul li a i.icon {
  display:inline-block;
  float:initial;
  width:0.7rem;
  height:0.7rem;
  margin-right:2px;
 }
@media (max-width:480px) {
  .configui .ui-item.as-window {
    top:0 !important;
    left:0 !important;
    right:unset;
    bottom:unset;
    height:calc(100vh - 20px) !important;
    width:calc(100vw - 20px) !important;
    margin:0 !important;
    border-radius:0 !important;
    box-shadow:unset;
  }
}
@media (max-width:1366px) {
  .configui .navbar nav.width-r ul {
    padding:10px;
    width:calc(100% - 20px);
  }
}