@charset "UTF-8";
/* line 21, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer {
  display: block;
  position: relative;
  overflow: hidden;
  width: 300px;
  height: 300px;
  user-select: none;
  -webkit-user-select: none;
}

/* line 35, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer outfit-layer {
  display: block;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* line 46, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer outfit-layer img, outfit-viewer outfit-layer iframe {
  width: 100%;
  height: 100%;
}

/* line 50, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .loading-indicator {
  position: absolute;
  z-index: 1000;
  bottom: 0px;
  right: 4px;
  padding: 8px;
  background: radial-gradient(circle closest-side, white 45%, #ffffff00);
  opacity: 0;
}

/* line 60, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button {
  position: absolute;
  z-index: 1001;
  left: 8px;
  bottom: 8px;
  display: none;
  align-items: center;
  justify-content: center;
  color: white;
  background: rgba(0, 0, 0, 0.64);
  width: 2.5em;
  height: 2.5em;
  border-radius: 100%;
  border: 2px solid transparent;
  transition: all .25s;
}

/* line 76, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button .playing-label, outfit-viewer .play-pause-button .paused-label {
  display: none;
  width: 1em;
  height: 1em;
}

/* line 81, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button .play-pause-toggle {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/* line 91, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button .play-pause-toggle:checked ~ .playing-label {
  display: block;
}

/* line 94, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button .play-pause-toggle:not(:checked) ~ .paused-label {
  display: block;
}

/* line 97, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button:hover, outfit-viewer .play-pause-button:has(.play-pause-toggle:focus) {
  border: 2px solid #060;
  background: #efe;
  color: #040;
}

/* line 102, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer .play-pause-button:has(.play-pause-toggle:active) {
  transform: translateY(2px);
}

/* line 106, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer:has(outfit-layer:state(has-animations)) .play-pause-button {
  display: flex;
}

/* line 109, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer:has(outfit-layer:state(loading)) {
  cursor: wait;
}

/* line 13, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer:has(outfit-layer:state(loading)) .loading-indicator {
  opacity: 1;
  transition-delay: 2s;
}

@starting-style {
  /* line 13, app/assets/stylesheets/items/../application/outfit-viewer.sass */
  outfit-viewer:has(outfit-layer:state(loading)) .loading-indicator {
    opacity: 0;
  }
}

/* line 116, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer:has(outfit-layer[highlighted]) outfit-layer[highlighted] {
  z-index: 999;
  backdrop-filter: grayscale(1) brightness(2) blur(1px);
}

/* line 124, app/assets/stylesheets/items/../application/outfit-viewer.sass */
outfit-viewer:has(outfit-layer[highlighted]) outfit-layer[highlighted] ~ outfit-layer[highlighted] {
  backdrop-filter: none;
}

/* line 7, app/assets/stylesheets/items/show.sass */
#container {
  width: 900px;
}

/* line 10, app/assets/stylesheets/items/show.sass */
.item-header {
  border-bottom: 1px solid #060;
  margin-top: 1em;
  margin-bottom: 1em;
}

/* line 9, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main {
  display: grid;
  grid-template-areas: "img gap1" "img name" "img links" "img lists" "img gap2" "nav nav";
  align-items: center;
  justify-content: center;
  column-gap: 1em;
  row-gap: .5em;
}

/* line 17, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-thumbnail {
  grid-area: img;
  border: 1px solid #060;
  height: 80px;
  width: 80px;
}

/* line 24, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-name {
  grid-area: name;
  text-align: left;
  line-height: 100%;
  margin-bottom: 0;
}

/* line 31, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links {
  grid-area: links;
  font-size: 85%;
  text-align: left;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1em;
}

/* line 41, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links abbr {
  cursor: help;
}

/* line 44, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links .item-kind, .item-header .item-header-main .item-links .first-seen-at {
  padding: .25em .5em;
  border-radius: .25em;
  text-decoration: none;
  font-weight: bold;
  line-height: 1;
  background: #E2E8F0;
  color: #1A202C;
}

/* line 55, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links .item-kind .icon, .item-header .item-header-main .item-links .first-seen-at .icon {
  vertical-align: middle;
}

/* line 63, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links .item-kind[data-type=nc] {
  background: #E9D8FD;
  color: #44337A;
}

/* line 66, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .item-links .item-kind[data-type=pb] {
  background: #FEEBC8;
  color: #7B341E;
}

/* line 70, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .support-form {
  grid-area: support;
  font-size: 85%;
  text-align: left;
}

/* line 75, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .user-lists-info {
  grid-area: lists;
  font-size: 85%;
  text-align: left;
  display: flex;
  gap: 1em;
}

/* line 83, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-header-main .user-lists-info a::after {
  content: " ›";
}

/* line 86, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form {
  background: #fff;
  border: 1px solid #060;
  border-radius: .5em;
  padding: 1em;
  width: 30em;
  text-align: center;
  z-index: 2;
  margin-top: .5em;
  margin-inline: auto;
  margin-bottom: 1.5em;
  font-size: 85%;
}

/* line 99, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form h3 {
  font-size: 150%;
  font-weight: bold;
  margin-bottom: .75em;
}

/* line 104, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form .closet-hangers-ownership-groups {
  overflow: hidden;
  display: inline-block;
  margin-bottom: .5em;
}

/* line 6, app/assets/stylesheets/items/../partials/../partials/clean/_mixins.sass */
.item-header .user-lists-form .closet-hangers-ownership-groups {
  display: block;
}

/* line 108, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form .closet-hangers-ownership-groups div {
  float: left;
  margin: 0 5%;
  text-align: left;
  width: 40%;
}

/* line 114, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form .closet-hangers-ownership-groups div li {
  list-style: none;
  word-wrap: break-word;
}

/* line 118, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form .closet-hangers-ownership-groups div li label.unlisted {
  font-style: italic;
}

/* line 121, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form form {
  padding: .5em 0;
}

/* line 124, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form select {
  width: 9em;
}

/* line 127, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .user-lists-form input[type=number] {
  margin-right: .5em;
  width: 3em;
}

/* line 131, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-description {
  margin-top: .5em;
  margin-bottom: 1em;
}

/* line 135, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav {
  display: flex;
  align-items: flex-end;
  gap: 1em;
}

/* line 140, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .preview-link {
  margin-right: auto;
}

/* line 143, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .trades-section {
  display: flex;
  gap: .5em;
}

/* line 147, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .trades-section header {
  align-self: center;
  font-weight: bold;
}

/* line 151, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .trades-section header::after {
  content: ":";
}

/* line 154, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .trades-section ul {
  align-self: flex-end;
  list-style: none;
  display: flex;
  gap: .5em;
}

/* line 160, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav .trades-section ul li {
  display: block;
}

/* line 163, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav a {
  display: block;
  background: #efe;
  border: 1px solid #060;
  border-bottom: 0;
  border-radius: .5em .5em 0 0;
  padding: .5em 1em;
  text-decoration: none;
}

/* line 172, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav a:hover, .item-header .item-subpages-nav a:focus {
  text-decoration: underline;
}

/* line 175, app/assets/stylesheets/items/../partials/_item_header.sass */
.item-header .item-subpages-nav a[data-is-current=true] {
  background: #fff;
  padding-bottom: calc(.5em + 1px);
  font-weight: bold;
  margin-bottom: -1px;
}

/* line 13, app/assets/stylesheets/items/show.sass */
#item-contributors {
  border-color: #ada;
  border-style: solid;
  border-width: 1px 0;
  font-size: 85%;
  margin: 1em 0;
  padding: .5em 0;
  text-align: center;
  clear: both;
  margin-bottom: 0;
  margin-top: 2em;
}

/* line 20, app/assets/stylesheets/items/show.sass */
#item-contributors header {
  display: inline;
  font-weight: bold;
  margin-right: .25em;
}

/* line 25, app/assets/stylesheets/items/show.sass */
#item-contributors footer {
  display: inline;
}

/* line 28, app/assets/stylesheets/items/show.sass */
#item-contributors ul {
  display: inline;
  list-style: none;
}

/* line 32, app/assets/stylesheets/items/show.sass */
#item-contributors ul li {
  display: inline;
}

/* line 35, app/assets/stylesheets/items/show.sass */
#item-contributors ul li::after {
  content: ", ";
}

/* line 38, app/assets/stylesheets/items/show.sass */
#item-contributors ul li:last-child::after {
  content: ".";
}

/* line 41, app/assets/stylesheets/items/show.sass */
.nc-icon {
  height: 16px;
  width: 16px;
}

/* line 45, app/assets/stylesheets/items/show.sass */
.preview-area {
  margin: 0 auto;
  position: relative;
}

/* line 49, app/assets/stylesheets/items/show.sass */
.preview-area .customize-more {
  position: absolute;
  top: 1em;
  right: 1em;
  display: flex;
  align-items: center;
  text-decoration: none;
  background: #EDF2F7;
  padding-inline: .75em;
  border-radius: .375em;
  min-height: 2rem;
  min-width: 2rem;
  box-sizing: border-box;
}

/* line 65, app/assets/stylesheets/items/show.sass */
.preview-area .customize-more .customize-more-label {
  width: 0;
  overflow: hidden;
  transition: width .25s;
  white-space: nowrap;
  --natural-width: auto;
}

/* line 72, app/assets/stylesheets/items/show.sass */
.preview-area .customize-more .customize-more-label measured-content {
  padding-right: .5em;
}

/* line 79, app/assets/stylesheets/items/show.sass */
.preview-area .customize-more:hover .customize-more-label, .preview-area .customize-more:focus .customize-more-label {
  width: var(--natural-width);
}

/* line 82, app/assets/stylesheets/items/show.sass */
outfit-viewer {
  width: 300px;
  height: 300px;
  border: 1px solid #060;
  border-radius: 1em;
}

/* line 88, app/assets/stylesheets/items/show.sass */
.error-indicator {
  font-size: 85%;
  color: #8a1f11;
  margin-top: .25em;
  margin-bottom: .5em;
  display: none;
}

/* line 101, app/assets/stylesheets/items/show.sass */
#item-preview[busy] outfit-viewer {
  cursor: wait;
}

/* line 13, app/assets/stylesheets/items/../application/outfit-viewer.sass */
#item-preview[busy] outfit-viewer .loading-indicator {
  opacity: 1;
  transition-delay: 2s;
}

@starting-style {
  /* line 13, app/assets/stylesheets/items/../application/outfit-viewer.sass */
  #item-preview[busy] outfit-viewer .loading-indicator {
    opacity: 0;
  }
}

/* line 105, app/assets/stylesheets/items/show.sass */
#item-preview:has(outfit-layer:state(error)) outfit-viewer {
  border: 2px solid red;
}

/* line 107, app/assets/stylesheets/items/show.sass */
#item-preview:has(outfit-layer:state(error)) .error-indicator {
  display: block;
}

/* line 111, app/assets/stylesheets/items/show.sass */
species-color-picker .error-icon {
  cursor: help;
  margin-right: .25em;
}

/* line 116, app/assets/stylesheets/items/show.sass */
species-color-picker form[data-is-valid="false"] select {
  border-color: #fbc2c4;
  color: #8a1f11;
}

@media (scripting: enabled) {
  /* line 123, app/assets/stylesheets/items/show.sass */
  species-color-picker input[type=submit] {
    position: absolute;
    margin-left: .5em;
    opacity: 0;
    animation: fade-in .25s forwards;
    animation-delay: .75s;
  }
}

/* line 132, app/assets/stylesheets/items/show.sass */
species-color-picker:state(auto-loading) input[type=submit] {
  display: none;
}

/* line 135, app/assets/stylesheets/items/show.sass */
species-face-picker {
  display: block;
  position: relative;
  margin-top: -10px;
}

/* line 140, app/assets/stylesheets/items/show.sass */
species-face-picker species-face-picker-options {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  isolation: isolate;
  overflow: auto;
  max-height: 200px;
  padding: 10px;
}

/* line 149, app/assets/stylesheets/items/show.sass */
species-face-picker img {
  width: 54px;
  height: 54px;
  transition: all 0.2s;
  opacity: .9;
  filter: saturate(90%);
}

/* line 159, app/assets/stylesheets/items/show.sass */
species-face-picker label {
  display: flex;
  overflow: hidden;
  transition: all 0.2s;
  position: relative;
  line-height: 1;
}

/* line 169, app/assets/stylesheets/items/show.sass */
species-face-picker label:has(input:checked) {
  border-radius: 6px;
  z-index: 1;
  background: #9AE6B4;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04), #2F855A 0 0 2px 2px;
  transform: scale(1.1);
}

/* line 176, app/assets/stylesheets/items/show.sass */
species-face-picker label:has(input:focus) {
  background: #BEE3F8;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04), #4299e1 0 0 0 3px;
  transform: scale(1.2);
}

/* line 181, app/assets/stylesheets/items/show.sass */
species-face-picker input[type=radio] {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* line 189, app/assets/stylesheets/items/show.sass */
species-face-picker input[type=radio]:checked + img {
  opacity: 1;
  filter: saturate(110%);
}

/* line 193, app/assets/stylesheets/items/show.sass */
species-face-picker input[type=radio]:disabled + img {
  opacity: .6;
  filter: saturate(0%);
}

/* line 197, app/assets/stylesheets/items/show.sass */
species-face-picker label:has(input[type=radio]:disabled) {
  cursor: not-allowed;
}

/* line 200, app/assets/stylesheets/items/show.sass */
species-face-picker noscript {
  position: absolute;
  inset: 0;
  padding: 1em;
  background: rgba(255, 255, 255, 0.8);
  z-index: 1;
  cursor: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* line 213, app/assets/stylesheets/items/show.sass */
species-face-picker:has(species-face-picker-options[inert]) {
  cursor: wait;
}

/* line 216, app/assets/stylesheets/items/show.sass */
.item-preview-meta-info {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .5em;
  align-items: center;
}

/* line 223, app/assets/stylesheets/items/show.sass */
.item-zones-info h3 {
  display: inline;
  font: inherit;
  font-weight: bold;
}

/* line 227, app/assets/stylesheets/items/show.sass */
.item-zones-info h3:after {
  content: ": ";
}

/* line 230, app/assets/stylesheets/items/show.sass */
.item-zones-info ul {
  list-style-type: none;
  display: inline;
}

/* line 234, app/assets/stylesheets/items/show.sass */
.item-zones-info ul li {
  display: inline;
}

/* line 236, app/assets/stylesheets/items/show.sass */
.item-zones-info ul li:not(:last-of-type):after {
  content: ", ";
}

/* line 239, app/assets/stylesheets/items/show.sass */
.item-zones-info .no-zones {
  font-style: italic;
  opacity: .85;
}

/* line 243, app/assets/stylesheets/items/show.sass */
.item-zones-info .zone-species-info {
  font-style: italic;
  text-decoration: underline dotted;
}

/* line 248, app/assets/stylesheets/items/show.sass */
.item-html5-info {
  display: flex;
  align-items: center;
  border: 1px solid;
  border-radius: .375em;
  padding: 4px 8px;
  min-height: 30px;
  box-sizing: border-box;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

/* line 258, app/assets/stylesheets/items/show.sass */
.item-html5-info[data-status=converted] {
  background: #efe;
  color: #040;
}

/* line 262, app/assets/stylesheets/items/show.sass */
.item-html5-info[data-status=converted] svg:nth-of-type(2) {
  margin-right: -4px;
}

/* line 265, app/assets/stylesheets/items/show.sass */
.item-html5-info[data-status=unconverted] {
  background: #fff6bf;
  color: #975A16;
  gap: .25em;
}

/* line 270, app/assets/stylesheets/items/show.sass */
.item-html5-info svg:first-of-type {
  width: 12px;
  height: 12px;
}

/* line 274, app/assets/stylesheets/items/show.sass */
.item-html5-info svg:nth-of-type(2) {
  width: 20px;
  height: 20px;
}

/* line 278, app/assets/stylesheets/items/show.sass */
#item-preview {
  display: flex;
  flex-direction: column;
  gap: .75em;
}

@media (min-width: 700px) {
  /* line 278, app/assets/stylesheets/items/show.sass */
  #item-preview {
    display: grid;
    grid-template-areas: "viewer faces" "picker meta";
    gap: .5em;
  }
  /* line 288, app/assets/stylesheets/items/show.sass */
  #item-preview .preview-area {
    grid-area: viewer;
  }
  /* line 290, app/assets/stylesheets/items/show.sass */
  #item-preview .preview-area outfit-viewer {
    width: 380px;
    height: 380px;
  }
  /* line 294, app/assets/stylesheets/items/show.sass */
  #item-preview species-color-picker {
    grid-area: picker;
  }
  /* line 297, app/assets/stylesheets/items/show.sass */
  #item-preview species-face-picker {
    grid-area: faces;
  }
  /* line 299, app/assets/stylesheets/items/show.sass */
  #item-preview species-face-picker species-face-picker-options {
    max-height: 380px;
  }
  /* line 302, app/assets/stylesheets/items/show.sass */
  #item-preview .item-preview-meta-info {
    grid-area: meta;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}