
.ChubCardPreview[data-v-39812ae5] {
  display: flex;
  gap: 0.5em;
  flex-flow: column nowrap;
  align-items: center;
}
.chub-card-preview-title[data-v-39812ae5] {
  display: grid;
  place-items: center;
  font-size: 125%;
  height: 3lh;
}
h2[data-v-39812ae5] {
  margin: 0;
  font-size: 100%;
  text-align: center;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}
.chub-card-preview-image-container[data-v-39812ae5] {
  width: 200px;
  height: 200px;
  overflow: hidden;
  border-radius: var(--radius-default);
}
.chub-card-preview-image {
&[data-v-39812ae5] {
  cursor: pointer;
  height: 200px;
  width: 200px;
  }
&[data-v-39812ae5]:hover {
    filter: blur(0) brightness(0.8);
}
}
.chub-card-preview-tagline[data-v-39812ae5] {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 10;
  line-clamp: 10;
  place-items: center;
  max-width: 100%;
  overflow-wrap: break-word;
  text-align: center;
  height: 10lh;
  overflow: clip;
  text-overflow: ellipsis;
}
.chub-card-preview-tagline[data-v-39812ae5] p {
  margin: 0;
}
.chub-card-preview-topics[data-v-39812ae5] {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  max-height: 10lh;
  overflow: clip;
  gap: 0.5em;
}
.chub-card-preview-topic[data-v-39812ae5] {
  cursor: pointer;
  background-color: var(--bg-secondary);
  padding: 0.2em 0.5em;
  border-radius: 4px;
}
.chub-card-preview-metadata-container[data-v-39812ae5] {
  display: flex;
  flex-flow: column nowrap;
  place-items: center;
  gap: 0.3em;
}
.chub-card-preview-metadata[data-v-39812ae5] {
  font-size: 0.9em;
  opacity: 0.7;
}
.chub-card-preview-stats[data-v-39812ae5] {
  font-size: 0.9em;
  opacity: 0.7;
  display: flex;
  flex-flow: row wrap;
  gap: 0.25em 1em;
  justify-content: center;
}
.chub-card-preview-token-counts[data-v-39812ae5] {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.8;
}
.chub-card-preview-metadata[data-v-39812ae5] {
  display: flex;
  flex-flow: column nowrap;
  gap: 0.25em;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.7;
}
.chub-card-preview-token-counts-details[data-v-39812ae5] {
  display: flex;
  flex-flow: row wrap;
  gap: 1em;
  justify-content: center;
}
.chub-card-preview-open-in-workshop img[data-v-39812ae5] {
  height: 1lh;
  width: 1lh;
  margin-right: 0.5em;
}
.chub-card-preview-open-in-workshop span[data-v-39812ae5] {
  vertical-align: top;
}
[data-v-39812ae5] img {
  max-width: 100%;
}

.ChubCardRating[data-v-a17e8663] {
  display: flex;
  gap: 0.5em;
  flex-flow: column nowrap;
  align-items: stretch;
}
.ChubCardRating:has(
    > .chub-card-rating-comment-container
      > .chub-card-rating-comment-children-toggle
      > input:not(:checked)
  )
  > .chub-card-rating-comment-children[data-v-a17e8663] {
  display: none;
}
.chub-card-rating-comment-children-toggle-open[data-v-a17e8663],
.chub-card-rating-comment-children-toggle-close[data-v-a17e8663],
.chub-card-rating-comment-children-toggle-disabled[data-v-a17e8663] {
  display: inline-grid;
  place-items: center;
  font-size: 2em;
  width: 1lh;
  height: 1lh;
  border-radius: var(--radius-small);
  transition-property: background-color 150ms;
}
:is(
    .chub-card-rating-comment-children-toggle-open[data-v-a17e8663],
    .chub-card-rating-comment-children-toggle-close[data-v-a17e8663]):hover {
  background: var(--bg-secondary);
}
input:not(:checked) ~ .chub-card-rating-comment-children-toggle-close[data-v-a17e8663] {
  display: none;
}
input:checked ~ .chub-card-rating-comment-children-toggle-open[data-v-a17e8663] {
  display: none;
}
.chub-card-rating-comment-container[data-v-a17e8663] {
  display: flex;
  gap: 0.5em;
  flex-flow: row nowrap;
  align-items: center;
}
.chub-card-rating-comment[data-v-a17e8663] {
  background: var(--bg-secondary);
  padding: 1em;
  border-radius: var(--radius-default);
  flex: 1 0 0;
}
.chub-card-rating-comment-deleted[data-v-a17e8663] {
  font-style: italic;
  opacity: 70%;
}
.chub-card-rating-comment-header[data-v-a17e8663] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5em;
}
.chub-card-rating-comment-rating-none[data-v-a17e8663] {
  opacity: 0;
}
.chub-card-rating-comment-meta[data-v-a17e8663] {
  display: flex;
  gap: 1em;
  align-items: center;
  font-size: 0.9em;
  opacity: 70%;
}
.chub-card-rating-comment-user[data-v-a17e8663] {
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-weight: bold;
  color: unset;
  text-decoration: none;
  margin: -0.25em;
  padding: 0.25em;
  border-radius: var(--radius-small);
  transition: background-color 150ms;
}
.chub-card-rating-comment-user[data-v-a17e8663]:hover {
  background: var(--bg-secondary);
}
.chub-card-rating-comment-user[data-v-a17e8663]::after {
  display: none;
}
.chub-card-rating-comment-user-avatar[data-v-a17e8663] {
  width: 1.5em;
  height: 1.5em;
  border-radius: 50%;
}
.chub-card-rating-comment-children[data-v-a17e8663] {
  display: flex;
  gap: 0.5em;
  flex-flow: column nowrap;
  margin-left: 2em;
}

.ChubCard[data-v-34b01c54] {
  position: relative;
  height: 100%;
  display: flex;
  flex-flow: row nowrap;
  overflow: auto;
}
.ChubCard[data-v-34b01c54] > * {
  flex: 1 0 0;
}
[data-v-34b01c54] img:not(:is(.fullscreen-preview-image, .chub-card-message-avatar)) {
  cursor: pointer;
  border-radius: var(--radius-default);
}
[data-v-34b01c54] 
    img:not(:is(.fullscreen-preview-image, .chub-card-message-avatar))
  :hover {
  filter: brightness(0.8);
  transition-property: filter;
  transition-duration: 150ms;
}
.chub-card-tab-bar-spacer[data-v-34b01c54] {
  flex: 1 0 100%;
  padding: 0;
}
.chub-card-info[data-v-34b01c54] hr {
  width: calc(100% - 2em);
  margin: 0 1em;
  justify-content: space-around;
}
.chub-card-content[data-v-34b01c54] {
  display: flex;
  flex-flow: column nowrap;
  padding: 1em;
  gap: 1em;
  align-items: center;
  height: fit-content;
  /* max-width: 100ch; */
  padding-bottom: 1em;
}
.chub-card-content[data-v-34b01c54] > * {
  overflow-wrap: break-word;
}
.top-right-buttons[data-v-34b01c54] {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  border: none;
  border-radius: 4px;
  display: flex;
  flex-flow: row nowrap;
}
.close-button[data-v-34b01c54] {
  cursor: pointer;
  border-radius: 50%;
  padding: 0;
  padding-top: 3px;
  height: calc(1lh + 0.5em);
  width: calc(1lh + 0.5em);
}
.chub-card-open-in-chub-button[data-v-34b01c54],
.chub-card-open-in-workshop-button[data-v-34b01c54] {
  display: flex;
  align-items: center;
  padding: 0.2em 0.5em;
}
.chub-card-open-in-workshop-button img[data-v-34b01c54] {
  height: 1em;
  width: 1em;
  margin-right: 0.5em;
}
.chub-card-image[data-v-34b01c54] {
  cursor: pointer;
  position: sticky;
  top: 0;
  display: grid;
  align-self: center;
  place-items: center;
  height: 100%;
  max-width: 40%;
}
.chub-card-image > img[data-v-34b01c54] {
  /* not an ideal solution as it assumes the image is the only thing on its side of the screen.
   * not sure why `max-height: 100%` does not work. */
  max-height: 100vh;
  object-fit: contain;
}
.chub-card-image-inline[data-v-34b01c54] {
  cursor: pointer;
  display: none;
  align-self: center;
  max-height: 50vh;
}
@media screen and (max-width: 1000px) {
.chub-card-image[data-v-34b01c54] {
    display: none;
}
.chub-card-image-inline[data-v-34b01c54] {
    display: block;
}
}
.chub-card-tagline[data-v-34b01c54],
.chub-card-description[data-v-34b01c54],
.chub-card-greetings[data-v-34b01c54],
.chub-card-conversations[data-v-34b01c54],
.chub-card-personality[data-v-34b01c54],
.chub-card-scenario[data-v-34b01c54],
.chub-card-system-prompt[data-v-34b01c54],
.chub-card-post-history-instructions[data-v-34b01c54] {
  max-width: 100ch;
  overflow-wrap: break-word;
  margin: 0 auto;
}
:is(
    .chub-card-tagline[data-v-34b01c54],
    .chub-card-description[data-v-34b01c54],
    .chub-card-greetings[data-v-34b01c54],
    .chub-card-conversations[data-v-34b01c54],
    .chub-card-personality[data-v-34b01c54],
    .chub-card-scenario[data-v-34b01c54],
    .chub-card-system-prompt[data-v-34b01c54],
    .chub-card-post-history-instructions[data-v-34b01c54])
  p {
  margin: 0;
}
.tab-contents[data-v-34b01c54] >  img {
  align-self: center;
}
.chub-card-tagline-container[data-v-34b01c54] {
  width: 100%;
}
[data-v-34b01c54] code {
  white-space: pre-wrap;
}
[data-v-34b01c54] img {
  max-width: 100%;
}
.chub-card-greetings > div > .tab-title[data-v-34b01c54] {
  min-width: 1.5em;
  text-align: center;
}
.chub-card-topics[data-v-34b01c54] {
  display: flex;
  flex-flow: row wrap;
  gap: 0.5em;
}
.chub-card-topic[data-v-34b01c54] {
  cursor: pointer;
  background-color: var(--bg-secondary);
  padding: 0.2em 0.5em;
  border-radius: 4px;
}
.chub-card-conversations > hr[data-v-34b01c54] {
  width: calc(100% - 2em);
  margin: 0.5em 1em;
}
.chub-card-conversation[data-v-34b01c54] {
  display: flex;
  flex-flow: column nowrap;
  gap: 0.5em;
}
.chub-card-message-author[data-v-34b01c54] {
  display: flex;
  align-items: center;
  gap: 0.75em;
}
.chub-card-message-avatar[data-v-34b01c54] {
  width: 2em;
  height: 2em;
  border-radius: 50%;
  object-fit: contain;
}
.chub-card-role-char[data-v-34b01c54] {
  background-color: var(--bg-secondary);
  border-radius: var(--radius-default);
  padding: 1em;
  margin-right: 2em;
}
.chub-card-role-user[data-v-34b01c54] {
  background-color: var(--bg-tertiary);
  border-radius: var(--radius-default);
  padding: 1em;
  margin-left: 2em;
}
.chub-card-message-error[data-v-34b01c54] {
  color: oklch(80% 30% 20);
}
.chub-card-loading[data-v-34b01c54],
.chub-card-no-results[data-v-34b01c54] {
  place-items: center;
  font-size: 1.25em;
  text-align: center;
}
.chub-card-forks.chub-card-forks[data-v-34b01c54] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1em;
}
.chub-card-gallery[data-v-34b01c54] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1em;
}
.chub-card-versions[data-v-34b01c54] {
  display: grid;
  grid-template-columns: repeat(4, auto);
  gap: 0 1em;
}
.chub-card-version[data-v-34b01c54] {
  display: contents;
}
.chub-card-token-counts[data-v-34b01c54] {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.8;
}
.chub-card-token-counts-summary[data-v-34b01c54],
.chub-card-token-counts-details[data-v-34b01c54] {
  display: flex;
  flex-flow: row wrap;
  gap: 1em;
  justify-content: center;
}
.chub-card-stats[data-v-34b01c54] {
  font-size: 0.9em;
  opacity: 0.7;
  display: flex;
  flex-flow: row wrap;
  gap: 0.25em 1em;
  justify-content: center;
}
.chub-card-token-counts[data-v-34b01c54] {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.8;
}
.chub-card-token-counts-details[data-v-34b01c54] {
  display: flex;
  flex-flow: row wrap;
  gap: 1em;
  justify-content: center;
}
.chub-card-metadata[data-v-34b01c54] {
  display: flex;
  flex-flow: column nowrap;
  gap: 0.25em;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.7;
}
.chub-card-comments[data-v-34b01c54] {
  display: flex;
  flex-flow: column-reverse nowrap;
  gap: 1em;
  padding: 0 1em;
}
[data-v-34b01c54] .chub-card-macro {
  color: oklch(80% 30% 180);
}
[data-v-34b01c54] .chub-card-macro-char {
  color: oklch(80% 30% 330);
}
[data-v-34b01c54] .chub-card-macro-user {
  color: oklch(80% 30% 240);
}
[data-v-34b01c54] q {
  color: oklch(80% 10% 240);
}

.Chub[data-v-b4c3cec2] {
  display: flex;
  flex-flow: column nowrap;
  width: 100%;
  height: 100%;
}
body:has(.fullscreen) .Chub[data-v-b4c3cec2] {
  opacity: 0;
}
.chub-content[data-v-b4c3cec2] {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  overflow: auto;
}
.loading[data-v-b4c3cec2] {
  font-size: 1.5em;
}
.chub-no-results[data-v-b4c3cec2] {
  display: grid;
  place-items: center;
  font-size: 1.25em;
  text-align: center;
  flex: 1 0 auto;
}
.chub-controls[data-v-b4c3cec2] {
  display: flex;
  gap: 0.5em;
  flex-flow: row wrap;
}
:is(.chub-topics, .chub-excluded-topics) > label[data-v-b4c3cec2] {
  font-weight: bold;
}
:is(.chub-topics[data-v-b4c3cec2], .chub-excluded-topics[data-v-b4c3cec2]) {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.5em;
  margin-bottom: 1em;
}
.chub-author {
&[data-v-b4c3cec2] {
  display: flex;
  flex-direction: row nowrap;
  gap: 0.5em;
  }
> input[data-v-b4c3cec2] {
    width: 16ch;
}
}
.chub-topic[data-v-b4c3cec2] {
  display: flex;
  align-items: center;
  gap: 0.5em;
  background-color: var(--bg-secondary);
  padding: 0.2em 0.5em;
  border-radius: 4px;
}
.chub-topic-input[data-v-b4c3cec2] {
  width: 16ch;
}
.chub-cards[data-v-b4c3cec2] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1em;
}
.chub-checkboxes,
.chub-require-checkboxes {
&[data-v-b4c3cec2] {
  display: flex;
  flex-flow: row wrap;
  gap: 0.5em;
  }
> label[data-v-b4c3cec2] {
    display: flex;
    align-items: center;
    gap: 0.25em;
}
}
.chub-sort-by[data-v-b4c3cec2] {
  display: flex;
  flex-flow: row wrap;
  gap: 0.25em;
}
.chub-sort-by label[data-v-b4c3cec2] {
  cursor: pointer;
  padding: 0.25em;
  border-radius: 4px;
}
.chub-sort-by label[data-v-b4c3cec2]:has(> :checked) {
  font-weight: bold;
  background: var(--bg-tertiary);
}
