* {
  letter-spacing: 0;
}
[hidden] {display:none !important;}
a {
  color: inherit;
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a,
input {
  touch-action: manipulation;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.content {
  max-width: 1180px;
  margin: 40px auto;
  padding: 0 24px 60px;
}
.subpage .hub-nav-wrap {
  position: relative;
  top: auto;
  margin-top: 40px;
}
.hub-logo,
.hero-title,
.hub-title {
  letter-spacing: 0;
}
.hero-title {
  font-size: 48px;
}
.content h1 {
  font-size: 32px;
  line-height: 1.3;
  margin-bottom: 24px;
}
.content h2 {
  font-size: 22px;
}
.content p {
  line-height: 1.7;
}
.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 20px 0;
  align-items: center;
}
.toolbar input {
  flex: 1;
  min-width: 160px;
}
.content input:not([type="checkbox"]):not([type="color"]),
.content select,
.content textarea {
  background: #100e19;
  border: 1px solid #514667;
  border-radius: 6px;
  padding: 12px;
  color: #fff;
}
.action {
  display: inline-block;
  padding: 10px 16px;
  border: 1px solid #71608e;
  border-radius: 6px;
  background: #272034;
  color: #fff;
  text-decoration: none;
}
.action:hover {
  background: #3d3151;
}
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 18px;
  margin: 24px 0;
}
.item {
  border: 1px solid #42394f;
  border-radius: 6px;
  background: #191520;
  padding: 16px;
  min-width: 0;
}
.item h2,
.item h3 {
  font-size: 17px;
  overflow-wrap: anywhere;
}
.skin-preview {
  width: 100%;
  height: 220px;
  object-fit: contain;
  image-rendering: pixelated;
}
.skin-head {
  width: 80px;
  height: 80px;
  image-rendering: pixelated;
}
.muted {
  color: #b5aabd;
}
.profile-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 32px;
}
.profile-layout > .skin-preview {
  height: 390px;
}
.row-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.person {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  border-bottom: 1px solid #42394f;
  padding: 16px 0;
}
.person strong {
  flex: 1;
  min-width: 140px;
  overflow-wrap: anywhere;
}
.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}
.messages {
  max-height: 440px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.message {
  padding: 12px;
  background: #24202c;
  border-radius: 6px;
  max-width: 80%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.message.mine {
  align-self: flex-end;
  background: #17424e;
}
.message small {
  display: block;
  color: #bbb;
  margin-bottom: 6px;
}
.cosmetic {
  border-bottom: 1px solid #42394f;
  padding: 20px 0;
}
.color-row {
  display: flex;
  align-items: center;
  gap: 20px;
  border-top: 1px solid #42394f;
  margin-top: 16px;
  padding-top: 16px;
}
.color-row input {
  width: 52px;
  height: 38px;
  background: none;
  border: 0;
  cursor: pointer;
}
#status {
  color: #f4c36d;
  min-height: 24px;
}
.login-card .btn {
  margin-top: 24px;
}
.login-card .check input {
  appearance: auto;
  accent-color: #318bc5;
  width: 18px;
  height: 18px;
}
.login-card .check {
  display: flex;
  gap: 10px;
  align-items: center;
}
.hub-nav {
  flex-wrap: wrap;
  gap: 16px;
}
.hub-links {
  display: flex;
  flex-wrap: wrap;
}
.model-preview {width:100%;height:240px;position:relative;min-width:0;}
.model-preview canvas {display:block;width:100%;height:240px;touch-action:none;}
.model-preview.large {height:510px;}
.model-preview.large canvas {height:440px;}
.detail-layout {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:32px;margin:24px 0 48px;}
.detail-layout > section {min-width:0;}
.content h1 {overflow-wrap:anywhere;}
.info-row {display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #42394f;padding:14px 0;overflow-wrap:anywhere;}
.info-row span {min-width:0;}
code {display:block;overflow-wrap:anywhere;white-space:pre-wrap;margin:16px 0;}
.history-list {display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 32px;}
.heatmap {display:grid;grid-template-columns:repeat(26,minmax(0,1fr));gap:4px;max-width:760px;margin:20px 0 40px;}
.heatmap span {aspect-ratio:1;background:#24212c;border-radius:2px;}
.heatmap span.active {background:#329d8a;}
.danger-zone {border-top:2px solid #c85865;margin-top:40px;padding-top:20px;}
.danger-zone input {max-width:100%;}
.search-suggestions:not(:empty) {position:absolute;top:100%;left:0;right:0;z-index:20;display:grid;gap:10px;padding:16px;background:#191520;border:1px solid #514667;box-shadow:0 12px 30px #0008;}
.hub-search,form[action="/search"] {position:relative;}
.account-menu[open] nav {animation:menu-in .16s ease-out;}
@keyframes menu-in {from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.detail-layout{grid-template-columns:minmax(0,1fr)}.info-row{flex-wrap:wrap}.model-preview,.model-preview canvas{height:240px}}
.hub-search button {
  background: transparent;
  color: inherit;
  border: 0;
  padding: 10px;
}
.hub-grid .hub-card img {
  object-fit: contain;
}
.account-menu {
  position: relative;
}
.account-menu summary {
  cursor: pointer;
}
.account-menu nav {
  position: absolute;
  right: 0;
  top: 34px;
  background: #181320;
  border: 1px solid #514667;
  padding: 14px;
  min-width: 190px;
  z-index: 5;
  display: grid;
  gap: 14px;
}
.notice {
  border-left: 3px solid #318bc5;
  padding: 12px 18px;
  background: #181520;
}
.hub-title {
  overflow-wrap: anywhere;
}
@media (max-width: 700px) {
  .profile-layout {
    grid-template-columns: 1fr;
  }
  .profile-layout > .skin-preview {
    height: 260px;
  }
  .hub-nav-wrap {
    padding: 12px;
  }
  .hub-nav {
    padding: 16px;
  }
  .hub-links {
    display: flex;
    width: 100%;
    gap: 12px;
  }
  .hero-title {
    font-size: 28px;
  }
  .content {
    padding: 0 16px 40px;
  }
  .content h1 {
    font-size: 26px;
  }
  .gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .skin-preview {
    height: 180px;
  }
  .message {
    max-width: 95%;
  }
}
