body.jsc-archive-page,
body.jsc-archive-page .wrap > .page-title,
body.jsc-archive-page :where(div, main, section, article):has(#jsc-catalog),
.jsc-archive-shell { background-color: #edf2f7; }

.jsc-archive-shell { width: 100%; }
body.jsc-archive-page .wrap > .page-title { padding-block: 24px 12px; }
body.jsc-archive-page .wrap > .page-title > .container {
  width: calc(100% - clamp(24px, 3.6vw, 68px)); max-width: 1440px; padding-inline: 0;
}
.jsc-archive-shell .main-page-content.default-margin { padding-top: 12px; }
.jsc-archive-shell :where(div, main, section, article):has(#jsc-catalog) {
  box-sizing: border-box; flex: 1 1 100%; width: 100%; max-width: none; min-width: 0;
  margin-inline: 0; padding-inline: 0;
}
.jsc-archive-shell #jsc-catalog {
  width: calc(100% - clamp(24px, 3.6vw, 68px)); max-width: 1440px;
  margin-inline: auto; padding-inline: 0;
}

:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) {
  box-sizing: border-box;
  font-family: inherit;
  --jsc-bg: #edf2f7;
  --jsc-border: #dfe5ed;
  --border: var(--jsc-border);
  --jsc-ink: #263444;
  --jsc-muted: #596776;
  --jsc-purple: #5943b9;
  --jsc-accent: linear-gradient(110deg, #3566ee, #6840df 70%, #7735dd);
  --jsc-spectrum: conic-gradient(from 90deg, #eb5875, #f7a75b, #e6d962, #b4da60, #66d5ab, #55cce3, #6889df, #aa62d5, #dc64a6, #eb5875);
}
.jsc-catalog {
  width: 100%; max-width: 1430px; margin-inline: auto;
  padding: 18px clamp(12px, 3.4vw, 45px) 32px;
  background: var(--jsc-bg); color: var(--jsc-ink); font-size: 14px; line-height: 1.8;
  --jsc-controls-top: max(calc(var(--jsc-sticky-top, 12px) + var(--jsc-adminbar-height, 0px)), var(--jsc-header-clearance, 0px));
}
body.admin-bar .jsc-catalog { --jsc-adminbar-height: 32px; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) *, :is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) *::before, :is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) *::after { box-sizing: border-box; }
:is(.jsc-catalog, .jsc-loop-card) a { color: inherit; text-decoration: none; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) :is(h1, h2, h3, button, input, select, summary) { font-family: inherit; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) :is(button, input, select) { font-size: inherit; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) button { cursor: pointer; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) svg {
  width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle;
}
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) :is(a, button, input, select, summary):focus-visible {
  outline: 2px solid #513db8; outline-offset: 2px;
}
.jsc-catalog .jsc-sr-only, :is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) .screen-reader-text, .jsc-loop-status {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0;
}
.jsc-loop-card { color: var(--jsc-ink); }
.jsc-loop-card > .jsc-card { height: 100%; }
.jsc-loop-card .jsc-cover img { margin: 0; }
.jsc-trial-banner {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px;
  margin-bottom: 16px; padding: 8px 12px; background: #f2effc; color: #503c8f;
  border: 1px solid #ddd3f2; border-radius: 9px; font-size: 12px;
}
.jsc-trial-banner a { text-decoration: underline; }
.jsc-term-description:not(:empty) { margin-top: 52px; }
.jsc-description-faq { margin-block: 10px; border: 1px solid var(--jsc-border); border-radius: 10px; padding: 10px 14px; }
.jsc-description-faq > summary { cursor: pointer; font-weight: 700; }
.jsc-description-faq > div { padding-top: 10px; }
.jsc-pagination + .catalog-resources { margin-top: 52px; }
.jsc-category-description {
  background: #fff; border: 1px solid var(--jsc-border); border-radius: 15px;
  padding: clamp(14px, 2.4vw, 24px); line-height: 1.95; overflow-wrap: anywhere;
}
.jsc-category-description > :first-child { margin-block-start: 0; }
.jsc-category-description > :last-child { margin-block-end: 0; }
.jsc-catalog .jsc-category-description a { color: var(--jsc-purple); text-decoration: underline; }
.jsc-category-description img { max-width: 100%; height: auto; }
.jsc-catalog .jsc-description-prose { width: 100%; max-width: none; color: #344158; font-size: clamp(14px, 1vw, 16px); line-height: 2; }
.jsc-catalog .jsc-description-prose :is(h2, h3, h4, h5, h6) { margin: 1.35em 0 .45em; color: #202d45; font-weight: 700; line-height: 1.6; }
.jsc-catalog .jsc-description-prose h2 { font-size: clamp(17px, 1.6vw, 21px); }
.jsc-catalog .jsc-description-prose :is(h3, h4, h5, h6) { font-size: 15px; }
.jsc-catalog .jsc-description-prose p { margin: 0 0 .85em; }
.jsc-catalog .jsc-description-prose > :first-child { margin-block-start: 0; }
.jsc-catalog .jsc-description-prose > :last-child { margin-block-end: 0; }
.jsc-intro { margin-bottom: 16px; }
.jsc-intro:empty { display: none; }
.jsc-catalog .jsc-condolence-banner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 8px 14px; min-height: 62px; margin-top: 12px; padding: 10px clamp(12px, 2vw, 25px);
  color: #fff; background: radial-gradient(ellipse at 14% 0%, #342657, transparent 62%), #1b1d28;
  border: 1px solid #343040; border-radius: 12px; box-shadow: 0 4px 14px #12182620;
}
.jsc-condolence-banner strong { font-size: clamp(14px, 1.3vw, 18px); }
.jsc-condolence-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 34px; padding: 3px 12px; border-radius: 9px; background: #fff; color: #2b2042;
  font-size: 12px; font-weight: 700; white-space: nowrap;
}
.jsc-condolence-banner:hover .jsc-condolence-cta { background: #efe7ff; }
.jsc-results-heading, .jsc-buy-row, .jsc-panel-head, .jsc-preview-buy {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.jsc-intro h1 { color: var(--jsc-ink); margin: 0; font-size: clamp(23px, 2.3vw, 33px); line-height: 1.5; }
.jsc-topic-strip { display: grid; grid-template-columns: minmax(0, 1fr) 120px; gap: 9px; align-items: stretch; margin-top: 16px; padding-block: 3px 5px; container-type: inline-size; container-name: jsc-topics; }
.jsc-topics { display: flex; flex-wrap: nowrap; gap: 9px; min-width: 0; }
.jsc-catalog .jsc-topic {
  display: flex; align-items: center; gap: 11px; flex: 1 1 0; min-width: 0;
  min-height: 72px; padding: 7px 12px; background: white;
  border: 1px solid var(--jsc-border); border-radius: 11px;
}
.jsc-catalog .jsc-topic:hover, .jsc-catalog .jsc-topic[aria-current] { border-color: #9a84d1; }
.jsc-catalog .jsc-all-topics { justify-content: center; flex: 0 0 120px; color: var(--jsc-purple); background: #f7f5ff; position: static; box-shadow: none; }
.jsc-topics-label-mobile { display: none; }
.jsc-topic-strip .jsc-topics > .jsc-topic:not(.jsc-all-topics) { display: none; }
.jsc-topic-strip .jsc-topics > .jsc-topic:first-child { display: flex; }
/* Viewport fallback for browsers without container queries. */
@media (min-width: 628px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+2) { display: flex; } }
@media (min-width: 853px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+3) { display: flex; } }
@media (min-width: 1073px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+4) { display: flex; } }
@media (min-width: 1293px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+5) { display: flex; } }
@media (min-width: 300px) and (max-width: 760px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+2) { display: flex; } }
@media (min-width: 404px) and (max-width: 760px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+3) { display: flex; } }
@media (max-width: 300px) { .jsc-topic-strip .jsc-topics > .jsc-topic:not(.jsc-all-topics) { display: none; } }
@supports (container-type: inline-size) {
  .jsc-topic-strip .jsc-topics > .jsc-topic:not(.jsc-all-topics) { display: none; }
  @container jsc-topics (min-width: 270px) { .jsc-topic-strip .jsc-topics > .jsc-topic:first-child { display: flex; } }
  @container jsc-topics (min-width: 560px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+2) { display: flex; } }
  @container jsc-topics (min-width: 785px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+3) { display: flex; } }
  @container jsc-topics (min-width: 1005px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+4) { display: flex; } }
  @container jsc-topics (min-width: 1225px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+5) { display: flex; } }
  @media (max-width: 760px) {
    @container jsc-topics (min-width: 250px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+2) { display: flex; } }
    @container jsc-topics (min-width: 380px) { .jsc-topic-strip .jsc-topics > .jsc-topic:nth-child(-n+3) { display: flex; } }
  }
}
.jsc-topic-cover { position: relative; isolation: isolate; flex: none; width: 76px; height: 55px; color: var(--jsc-purple); }
.jsc-topic-sheet {
  position: absolute; display: grid; place-items: center; overflow: hidden;
  width: calc(100% - 13px); height: calc(100% - 14px); border: 2px solid #fff;
  border-radius: 6px; box-shadow: 0 2px 6px #20345c27; background: #e9edfc;
}
.jsc-topic-sheet:nth-child(1) { inset-block-start: 2px; inset-inline-start: 11px; transform: rotate(10deg); background: #d3e5f5; }
.jsc-topic-sheet:nth-child(2) { inset-block-start: 6px; inset-inline-start: 6px; transform: rotate(-9deg); background: #e0d8f5; }
.jsc-topic-sheet:nth-child(3) { inset-block-start: 11px; inset-inline-start: 1px; transform: rotate(-2deg); }
.jsc-topic-sheet img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.jsc-topic strong { display: block; min-width: 0; overflow-wrap: anywhere; font-size: 12px; line-height: 1.65; }


.jsc-sticky-controls, .jsc-controls {
  position: sticky; top: var(--jsc-controls-top); z-index: 35; margin: 0 0 16px;
}
.jsc-controls {
  padding: 10px 12px; border: 1px solid var(--jsc-border); border-radius: 13px;
  background: #fff; box-shadow: 0 4px 15px #30456b09;
}
.jsc-sticky-controls > .jsc-controls { position: relative; top: auto; z-index: auto; margin: 0; }
.jsc-sticky-controls[data-jsc-stuck]::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  inset: calc(-1 * var(--jsc-controls-cover, 0px)) 0 0;
  background: var(--jsc-bg); border-radius: 0 0 13px 13px;
}
.jsc-sticky-controls[data-jsc-stuck] > .jsc-controls { box-shadow: 0 7px 19px #30456b25; }
.jsc-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-width: 0; }
.jsc-search {
  display: flex; align-items: center; gap: 4px; flex: 0 1 310px; min-width: 145px;
  padding: 4px; border: 1px solid var(--jsc-border); border-radius: 8px; background: #fff;
}
.jsc-catalog .jsc-search input {
  width: 100%; min-width: 0; margin: 0; padding: 4px 7px; height: auto;
  border: 0; border-radius: 5px; background: transparent; color: inherit; font-size: 12px;
}
.jsc-catalog .jsc-primary {
  display: inline-flex; justify-content: center; align-items: center; gap: 6px;
  min-height: 41px; padding: 6px 10px; margin: 0; border: 0; border-radius: 8px;
  color: #fff; background: var(--jsc-accent); font-size: 12px; font-weight: 700; line-height: 1.5;
}
.jsc-catalog .jsc-primary:hover { filter: brightness(.94); }
.jsc-catalog .jsc-search .jsc-primary { flex: none; width: 32px; min-height: 32px; padding: 0; border-radius: 6px; }
.jsc-filterbar { display: flex; align-items: center; gap: 7px; min-width: 0; overflow-x: auto; padding: 3px; scrollbar-width: thin; }
.jsc-catalog .jsc-filterbar { display: flex; }
.jsc-filter-dropdown { flex: none; min-width: 0; }
.jsc-filter-dropdown-icon { width: 41px; }
.jsc-filter-dropdown > summary { list-style: none; cursor: pointer; }
.jsc-filter-dropdown > summary::-webkit-details-marker { display: none; }
.jsc-filter-dropdown > summary::marker { content: ''; }
.jsc-filter-dropdown > .jsc-filter-button { width: 100%; }
.jsc-filter-dropdown[open] > .jsc-filter-button { border-color: #a996d6; background: #f5f6ff; }
.jsc-filter-label-mobile { display: none; }
.jsc-catalog .jsc-filter-button {
  position: relative; display: flex; align-items: center; flex: none; gap: 7px;
  min-height: 41px; margin: 0; padding: 6px 10px; border: 1px solid var(--jsc-border);
  border-radius: 8px; background: #fff; color: var(--jsc-ink); white-space: nowrap; font-size: 12px;
}
.jsc-catalog .jsc-filter-button:hover,
.jsc-catalog .jsc-filter-button[aria-expanded=true] { border-color: #a996d6; background: #f5f6ff; }
.jsc-catalog .jsc-filter-icon-only { width: 41px; justify-content: center; padding: 4px; }
.jsc-filter-glyph {
  display: grid; place-items: center; flex: none; width: 20px; height: 20px;
  color: #6554b0; background: #eeecfb; border-radius: 6px;
}
.jsc-filter-glyph svg { width: 13px; height: 13px; }
.jsc-color-wheel {
  display: block; width: 26px; height: 26px; border-radius: 50%;
  background: radial-gradient(circle, #fff 0%, #ffffffb0 29%, #fff0 76%), var(--jsc-spectrum);
}
.jsc-chevron { width: 5px; height: 5px; border: solid #6f6594; border-width: 0 1px 1px 0; transform: rotate(45deg); margin: -3px 2px 0; }
.jsc-filter-count { min-width: 15px; padding: 0 3px; color: #fff; background: #6445c5; border-radius: 8px; font-size: 9px; line-height: 15px; }
.jsc-filter-icon-only .jsc-filter-count { position: absolute; top: 1px; left: 1px; }
.jsc-panel {
  padding: 8px 12px; border: 1px solid var(--jsc-border); border-radius: 10px; margin-top: 6px; background: #fff;
  position: absolute; top: 100%; left: var(--jsc-panel-left, 0); width: min(325px, 100%);
  max-height: min(440px, 60vh); overflow: auto; overscroll-behavior: contain;
  box-shadow: 0 12px 38px #24385626; border-radius: 12px;
}
.jsc-filter-dropdown:not([open]) > .jsc-panel { display: none; }
#jsc-catalog .jsc-filter-dropdown[open] > .jsc-panel { display: block; }
.jsc-panel-head { display: flex; min-height: 42px; border-bottom: 1px solid var(--jsc-border); padding-bottom: 7px; }
.jsc-panel-head [data-jsc-close-panel] { visibility: hidden; }
.jsc-catalog[data-jsc-enhanced] .jsc-panel-head [data-jsc-close-panel] { visibility: visible; }
.jsc-panel-head h3, .jsc-dialog header h2 { font-size: 14px; margin: 0; color: var(--jsc-ink); }
.jsc-catalog .jsc-panel-head button, .jsc-dialog header button {
  display: grid; place-items: center; width: 34px; height: 34px; margin: 0; padding: 0;
  color: var(--jsc-muted); border: 1px solid var(--jsc-border); border-radius: 7px; background: #fff;
}
.jsc-panel-body { padding-block: 6px 3px; }
.jsc-options { display: grid; gap: 2px; }
.jsc-option {
  display: flex; align-items: center; gap: 8px; min-height: 37px; padding: 5px 7px;
  border-radius: 7px; color: var(--jsc-ink); font-size: 13px; cursor: pointer;
}
.jsc-option:hover, .jsc-option:has(input:checked) { background: #f1f4fb; }
.jsc-catalog .jsc-option input { flex: none; width: 16px; height: 16px; margin: 0; accent-color: #6245c8; }
.jsc-catalog .jsc-topic-tree { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.jsc-topic-branch > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 37px; padding: 5px 7px; border-radius: 7px; cursor: pointer; list-style: none;
  color: var(--jsc-ink); font-weight: 700; font-size: 13px;
}
.jsc-topic-branch > summary::-webkit-details-marker { display: none; }
.jsc-topic-branch > summary:hover, .jsc-topic-branch[open] > summary { background: #f1f4fb; }
.jsc-topic-branch[open] > summary .jsc-chevron { transform: rotate(225deg); margin-top: 3px; }
.jsc-topic-children { margin-inline-start: 9px; padding-inline-start: 9px; border-inline-start: 1px solid var(--jsc-border); }
.jsc-topic-node { position: relative; }
.jsc-topic-node > .jsc-topic-parent-option {
  position: absolute; z-index: 1; inset-block-start: 0; inset-inline: 0 40px;
  height: 37px; font-weight: 700;
}
.jsc-topic-parent-option > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jsc-topic-node > .jsc-topic-branch > summary { justify-content: flex-end; padding-inline-end: 13px; }
.jsc-subcategories { margin-top: 10px; }
.jsc-subcategories > strong { display: block; margin-bottom: 5px; font-size: 13px; }
.jsc-subcategories .jsc-selected { margin-bottom: 0; }
.jsc-catalog .jsc-subcategories a[aria-current] { background: #f1ebff; border-color: #a98fdc; color: var(--jsc-purple); }
.jsc-swatches { display: grid; grid-template-columns: repeat(5, minmax(36px, 1fr)); gap: 6px; padding-block: 4px; }
.jsc-swatch { position: relative; display: grid; place-items: center; min-height: 44px; border: 1px solid var(--jsc-border); border-radius: 8px; cursor: pointer; }
.jsc-catalog .jsc-swatch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.jsc-swatch:has(input:checked), .jsc-swatch:focus-within { border-color: #6848c3; box-shadow: inset 0 0 0 1px #6848c3; }
.jsc-swatch-dot { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid #25334b29; border-radius: 50%; background: var(--jsc-swatch); }
.jsc-swatch-dot svg { display: none; color: #fff; width: 15px; height: 15px; background: #16243fa8; border-radius: 50%; }
.jsc-swatch input:checked + .jsc-swatch-dot svg { display: block; }
.jsc-field { display: grid; gap: 4px; margin-top: 8px; font-size: 12px; color: var(--jsc-muted); }
.jsc-catalog .jsc-field select { width: 100%; min-height: 39px; margin: 0; padding: 4px 8px; border: 1px solid var(--jsc-border); border-radius: 7px; background: #fff; color: var(--jsc-ink); }
.jsc-catalog .jsc-panel-link { display: inline-flex; gap: 5px; margin-block: 10px 4px; font-size: 12px; color: var(--jsc-purple); }
.jsc-price-budget { margin-top: 12px; padding: 12px 10px 10px; border: 1px solid #e4def4; border-radius: 11px; background: linear-gradient(135deg, #fbfaff, #f1f4ff); }
.jsc-price-budget-heading, .jsc-price-endpoints { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.jsc-price-budget-heading { margin-bottom: 4px; font-size: 12px; }
.jsc-price-budget-heading output { padding: 3px 8px; border-radius: 7px; color: #4e359c; background: #eae3fb; font-weight: 700; font-size: 12px; }
.jsc-price-endpoints { margin-top: 0; color: var(--jsc-muted); font-size: 10px; }
.jsc-catalog .jsc-price-range { display: block; width: 100%; height: 44px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 8px; appearance: none; -webkit-appearance: none; background: transparent; cursor: pointer; direction: rtl; touch-action: pan-y; }
.jsc-price-range::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(to left, #7450db var(--jsc-price-fill, 100%), #ded8ed var(--jsc-price-fill, 100%)); }
.jsc-price-range::-moz-range-track { height: 8px; border-radius: 8px; background: linear-gradient(to left, #7450db var(--jsc-price-fill, 100%), #ded8ed var(--jsc-price-fill, 100%)); }
.jsc-price-range::-webkit-slider-thumb { width: 24px; height: 24px; margin-top: -8px; border: 3px solid #7450db; border-radius: 50%; appearance: none; -webkit-appearance: none; background: #fff; box-shadow: 0 2px 7px #49368535; }
.jsc-price-range::-moz-range-thumb { width: 18px; height: 18px; border: 3px solid #7450db; border-radius: 50%; background: #fff; box-shadow: 0 2px 7px #49368535; }
.jsc-price-range:disabled { opacity: .55; cursor: default; }
.jsc-noscript-submit { margin-top: 8px; }
.jsc-muted { color: var(--jsc-muted); font-size: 12px; }
.jsc-notice { padding: 9px 12px; background: #fff; border: 1px solid var(--jsc-border); border-radius: 8px; }
.jsc-catalog .jsc-download-limit-note { margin: 0 0 12px; font-size: 11px; color: var(--jsc-muted); }

.jsc-results, .jsc-update-status { scroll-margin-top: calc(var(--jsc-controls-top) + var(--jsc-controls-height, 73px) + 12px); }
.jsc-catalog .jsc-update-status { margin: 0 0 10px; padding: 6px 10px; border-radius: 8px; background: #ece8fa; color: #49348b; font-size: 12px; }
.jsc-update-status:empty { display: none; }
.jsc-update-status[data-state=loading]::before { content: ''; display: inline-block; width: 10px; height: 10px; margin-inline-end: 7px; border: 2px solid #c8bcec; border-top-color: #5943b9; border-radius: 50%; animation: jsc-loading .8s linear infinite; }
@keyframes jsc-loading { to { transform: rotate(360deg); } }
.jsc-results[aria-busy=true] .jsc-grid { opacity: .65; }
.jsc-results-heading { margin-bottom: 12px; }
.jsc-results-heading > div { display: flex; align-items: baseline; gap: 8px; }
.jsc-results-heading h2 { margin: 0; color: var(--jsc-ink); font-size: clamp(17px, 1.6vw, 21px); }
.jsc-results-heading span { color: var(--jsc-muted); font-size: 11px; }
.jsc-catalog .jsc-results-heading a { color: var(--jsc-purple); font-size: 12px; white-space: nowrap; }
.jsc-results-heading a svg { width: 12px; height: 12px; }
.jsc-selected { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.jsc-catalog .jsc-selected a {
  display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 3px 8px;
  background: #fff; border: 1px solid var(--jsc-border); border-radius: 7px; color: var(--jsc-purple); font-size: 11px;
}
.jsc-selected svg { width: 12px; height: 12px; }
.jsc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.jsc-card {
  display: flex; flex-direction: column; min-width: 0; overflow: hidden;
  background: #fff;
  border: 1px solid #ffffff; border-radius: 19px;
  box-shadow: 0 12px 23px -10px #2c4f7970, 0 2px 7px #273b6220, inset 0 1px 0 #fff;
  transition: box-shadow .18s ease, border-color .18s ease;
}
.jsc-card:focus-within, .jsc-card:hover { border-color: #c6d5f2; box-shadow: 0 14px 28px -10px #2c4f798c, 0 2px 8px #273b6229; }
.jsc-cover { position: relative; aspect-ratio: 1.575; margin: 8px 8px 0; border-radius: 13px; overflow: hidden; background: #e0e9f4; }
.jsc-cover > a, .jsc-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
:is(.jsc-catalog, .jsc-loop-card) .jsc-preview-hint, :is(.jsc-catalog, .jsc-loop-card) .jsc-badge {
  display: inline-flex; align-items: center; gap: 3px; position: absolute;
  padding: 3px 6px; border-radius: 20px; font-size: 9px; font-weight: 700;
  background: #fffffff5; color: var(--jsc-ink); box-shadow: 0 2px 6px #0d214d26;
}
.jsc-preview-hint { bottom: 6px; left: 6px; }
:is(.jsc-catalog, .jsc-loop-card) :is(.jsc-preview-hint, .jsc-featured-badge) {
  justify-content: center; width: 29px; height: 29px; padding: 0;
}
.jsc-preview-hint svg, .jsc-featured-badge svg { width: 15px; height: 15px; }
:is(.jsc-catalog, .jsc-loop-card) .jsc-badge { top: 7px; right: 7px; color: #273d9d; background: #fffffff7; }
.jsc-badge svg { width: 13px; height: 13px; color: #ac7100; }
:is(.jsc-catalog, .jsc-loop-card) .jsc-free-badge { color: #145633; background: #eef9f1; }
:is(.jsc-catalog, .jsc-loop-card) .jsc-save {
  display: grid; place-items: center; position: absolute; top: 7px; left: 7px;
  width: 35px; height: 35px; margin: 0; padding: 0; border: 1px solid #fff;
  border-radius: 11px; background: #fffffff7; color: #233249; box-shadow: 0 3px 8px #182a4a30;
}
.jsc-save[aria-pressed=true] svg { fill: #7046db; stroke: #7046db; }
.jsc-card-body { display: flex; flex: 1; flex-direction: column; padding: 10px 13px 0; }
.jsc-catalog .jsc-customize-note, .jsc-dialog .jsc-customize-note { margin: 0 0 9px; padding: 6px 8px; color: #514380; background: #f3effb; border-radius: 7px; font-size: 11px; line-height: 1.8; }
.jsc-general-recommendations { margin-top: 28px; padding: 16px; border: 1px solid #dcd3f2; border-radius: 14px; background: #f6f3fc; }
.jsc-general-recommendations > h2 { margin: 0 0 6px; font-size: 18px; }
.jsc-general-recommendations > p { margin: 0 0 14px; font-size: 12px; }
.jsc-card h3 { margin: 0 0 8px; color: #16253e; font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
.jsc-card h3 a:hover { color: var(--jsc-purple); }
.jsc-specs { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 10px; color: var(--jsc-ink); font-size: 11px; }
.jsc-specs span { display: inline-flex; align-items: center; gap: 4px; }
.jsc-specs span + span { border-inline-start: 1px solid #cbd7e8; padding-inline-start: 8px; }
.jsc-specs svg { width: 14px; height: 14px; color: #465675; }
.jsc-buy-row { margin-top: auto; padding-block: 10px; border-top: 1px solid #dbe5f0; flex-wrap: wrap; }
.jsc-price { font-size: 15px; line-height: 1.6; font-weight: 800; color: #17253c; overflow-wrap: anywhere; }
.jsc-price del { display: block; font-weight: 400; font-size: .82em; color: var(--jsc-muted); }
.jsc-price ins { text-decoration: none; }
.jsc-price .woocommerce-Price-currencySymbol { font-size: .8em; font-weight: 400; }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) .jsc-buy {
  display: inline-flex; justify-content: center; align-items: center; gap: 4px; min-height: 38px;
  padding: 4px 8px; border: 1px solid transparent; border-radius: 10px;
  background: var(--jsc-accent); color: #fff; font-size: 11px; font-weight: 700;
  box-shadow: none;
}
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) .jsc-buy:hover { filter: brightness(.94); }
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) .jsc-buy-free {
  background: linear-gradient(110deg, #eaf1ff, #f1ebff 70%, #f4eaff); color: #463290; border-color: #ded8f4;
}
:is(.jsc-catalog, .jsc-loop-card, .jsc-dialog) .jsc-buy-free:hover { filter: brightness(.97); }
.jsc-buy svg { width: 12px; height: 12px; }
.jsc-download-form { margin: 0; min-width: 0; }
.home .jsc-loop-card .jsc-buy-row {
  display: grid; grid-template-columns: minmax(0, 1fr) min(47%, 92px);
  align-items: center; gap: 6px; padding-block: 8px;
}
.home .jsc-loop-card .jsc-buy-row .jsc-price {
  min-width: 0; font-size: clamp(11px, 2vw, 13px); line-height: 1.4;
  white-space: normal; overflow-wrap: anywhere;
}
.home .jsc-loop-card .jsc-buy-row > .jsc-download-form { width: 100%; margin: 0; padding: 0; }
.home .jsc-loop-card .jsc-buy-row .jsc-buy {
  width: 100%; min-width: 0; height: 38px; min-height: 38px; margin: 0; padding: 4px 5px;
  gap: 3px; border-radius: 8px; font-size: 10px; line-height: 1.3; text-align: center;
  white-space: normal; overflow-wrap: anywhere;
}
.home .jsc-loop-card .jsc-buy-row .jsc-buy svg { width: 11px; height: 11px; }
.jsc-download-options { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.jsc-package-card {
  padding: 11px; gap: 8px; border-color: #ddd4f2;
  background: linear-gradient(155deg, #fcfbff, #fff 65%);
}
.jsc-package-card header { display: flex; gap: 8px; align-items: center; margin: 0; }
.jsc-package-icon {
  display: grid; place-items: center; flex: none; width: 33px; height: 33px; border-radius: 9px;
  background: linear-gradient(140deg, #f1f3ff, #ede5fc); color: var(--jsc-purple);
}
.jsc-package-heading { min-width: 0; }
.jsc-package-heading small, .jsc-package-pricing > span { font-size: 11px; color: var(--jsc-muted); }
.jsc-package-heading small { display: block; line-height: 1.5; white-space: nowrap; }
.jsc-package-card h3 {
  margin: 2px 0 0; line-height: 1.4; font-weight: 700;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.jsc-package-stack {
  display: block; position: relative; isolation: isolate; overflow: hidden; width: 100%;
  aspect-ratio: 1.93; border-radius: 11px; margin: 0;
  background: radial-gradient(ellipse at 52% 82%, #e9e0fb, #f0ecfc 52%, #f6f8fe 90%);
}
.jsc-package-stack[data-jsc-covers="0"] { aspect-ratio: auto; min-height: 76px; }
.jsc-package-stack[data-jsc-covers="0"] > a { position: absolute; inset: 0; }
.jsc-package-stack :is(.jsc-save, .jsc-preview-hint) { z-index: 5; }
.jsc-package-sheet {
  position: absolute; z-index: var(--layer, 1); width: var(--width); height: var(--height);
  top: var(--top); left: var(--left); overflow: hidden;
  border: 2px solid #fff; border-radius: 7px; background: #fff;
  box-shadow: 0 4px 10px #2e356b32; transform: translateX(-50%) rotate(var(--rotation, 0deg));
}
.jsc-package-sheet img {
  display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; object-position: center;
}
.jsc-package-sheet:nth-child(1) {
  --left: 50%; --top: 43%; --width: 51%; --height: 53%; --layer: 4; --rotation: -1deg;
}
.jsc-package-sheet:nth-child(2) { --left: 28%; --top: 33%; --width: 44%; --height: 48%; --layer: 3; --rotation: -9deg; }
.jsc-package-sheet:nth-child(3) { --left: 72%; --top: 34%; --width: 44%; --height: 48%; --layer: 3; --rotation: 8deg; }
.jsc-package-sheet:nth-child(4) { --left: 31%; --top: 8%; --width: 42%; --height: 46%; --rotation: -6deg; }
.jsc-package-sheet:nth-child(5) { --left: 69%; --top: 10%; --width: 42%; --height: 46%; --rotation: 6deg; }
.jsc-package-stack[data-jsc-covers="1"] .jsc-package-sheet {
  --top: 6%; --width: 78%; --height: 88%; --rotation: 0deg;
}
.jsc-package-stack[data-jsc-covers="2"] .jsc-package-sheet:nth-child(1) {
  --left: 58%; --top: 28%; --width: 65%; --height: 63%; --rotation: 2deg;
}
.jsc-package-stack[data-jsc-covers="2"] .jsc-package-sheet:nth-child(2) {
  --left: 39%; --top: 11%; --width: 61%; --height: 64%; --rotation: -8deg;
}
.jsc-package-stack[data-jsc-covers="3"] .jsc-package-sheet:nth-child(1) {
  --top: 34%; --width: 58%; --height: 62%;
}
.jsc-package-stack[data-jsc-covers="3"] .jsc-package-sheet:nth-child(2),
.jsc-package-stack[data-jsc-covers="3"] .jsc-package-sheet:nth-child(3) {
  --top: 12%; --width: 45%; --height: 58%;
}
.jsc-package-stack[data-jsc-covers="4"] .jsc-package-sheet:nth-child(4) {
  --left: 50%; --rotation: 0deg; --width: 54%; --height: 52%;
}
.jsc-package-total {
  display: flex; gap: 3px 6px; align-items: center; flex-wrap: wrap; justify-content: space-between;
  margin-top: auto;
}
.jsc-package-pricing { display: grid; min-width: 0; line-height: 1.5; }
.jsc-catalog .jsc-package-all { min-height: 37px; }
.jsc-pagination {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px 14px;
  margin-top: 22px; padding-block: 8px; color: #2b3150; font-size: 12px;
}
.jsc-page-range { display: inline-flex; align-items: center; gap: 5px; }
.jsc-page-range svg { color: var(--jsc-purple); }
.jsc-page-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.jsc-catalog .jsc-pagination .page-numbers {
  display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding-inline: 5px;
  border: 1px solid #dbe1f1; border-radius: 50%; background: #ffffffe8; color: #303a61;
  box-shadow: 0 2px 5px #33427b12; font-size: 12px;
}
.jsc-catalog .jsc-pagination a.page-numbers:hover { background: #f3efff; border-color: #c5b3ef; }
.jsc-catalog .jsc-pagination .dots { box-shadow: none; border-color: transparent; background: transparent; min-width: 24px; }
.jsc-page-arrow { width: 7px; height: 7px; border: solid currentColor; border-width: 0 2px 2px 0; }
.jsc-pagination .prev .jsc-page-arrow { transform: translateX(-1px) rotate(-45deg); }
.jsc-pagination .next .jsc-page-arrow { transform: translateX(1px) rotate(135deg); }
.jsc-catalog .jsc-pagination .current { background: linear-gradient(150deg, #985cf0, #6438ce); color: #fff; border-color: transparent; }
.jsc-page-size { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: 5px; margin: 0; }
.jsc-page-size select {
  min-height: 34px; border: 1px solid #dbe1f1; border-radius: 18px; margin: 0;
  padding: 3px 8px; background: #ffffffe8; color: #303a61; font-size: 12px;
}
.jsc-empty { text-align: center; padding: 30px 12px; background: #fff; border: 1px solid var(--jsc-border); border-radius: 12px; }
.jsc-empty h3 { margin: 8px 0; color: var(--jsc-ink); }

.jsc-dialog {
  inset: 0; width: min(850px, calc(100% - 26px)); max-height: min(88vh, 750px);
  margin: auto; padding: 0; overflow: auto; border: 1px solid var(--jsc-border); border-radius: 14px;
  color: var(--jsc-ink); background: #fff;
}
.jsc-dialog:not([open]) { display: none; }
.jsc-dialog::backdrop { background: #14243890; }
.jsc-dialog header { position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 10px; background: #fff; border-bottom: 1px solid var(--jsc-border); padding: 10px 14px; font-size: 13px; }
#jsc-preview-dialog[open] {
  display: grid; grid-template-rows: auto minmax(0, 1fr);
  width: min(1160px, calc(100% - 32px)); height: min(690px, calc(100vh - 32px));
  height: min(690px, calc(100dvh - 32px)); max-width: none; max-height: none;
  overflow: hidden; color: #24324a; border-color: #ffffffde; border-radius: 21px;
  background: linear-gradient(145deg, #fafcfff5 0%, #edf4fff2 49%, #f4effcf2 100%);
  box-shadow: 0 24px 70px #101d4b52, 0 5px 18px #19275226, inset 0 1px #fff;
}
#jsc-preview-dialog::backdrop { background: #18244287; }
@media (min-width: 721px) {
  #jsc-preview-dialog::backdrop { backdrop-filter: blur(5px); }
}
html:has(#jsc-preview-dialog[open]) { overflow: hidden; }
#jsc-preview-dialog [hidden] { display: none !important; }
#jsc-preview-dialog > header { position: static; padding: 12px 18px; background: #ffffffa8; border-color: #dce4f1; }
.jsc-preview-heading { display: flex; min-width: 0; align-items: center; gap: 8px; }
.jsc-preview-glyph {
  display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px;
  color: #5135b3; background: linear-gradient(145deg, #e9f0fe, #eee4ff); border: 1px solid #fff;
}
#jsc-preview-title {
  min-width: 0; margin: 0; font-size: clamp(14px, 1.65vw, 20px); font-weight: 700; line-height: 1.5; color: #162440;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#jsc-preview-dialog > header button {
  display: grid; place-items: center; flex: none; width: 36px; height: 36px; padding: 0;
  color: #35435f; border: 1px solid #d8e0ef; border-radius: 11px; background: #fff;
}
#jsc-preview-dialog > header button:hover { background: #f3eeff; }
[data-jsc-preview-content] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-height: 0; }
.jsc-preview-switch { display: none; }
.jsc-preview-grid {
  grid-row: 2; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr);
  gap: 14px; min-height: 0; min-width: 0; padding: 14px 18px;
}
.jsc-preview-grid--specs-only { grid-template-columns: minmax(0, 1fr); }
.jsc-preview-gallery, .jsc-preview-specs {
  display: grid; min-height: 0; min-width: 0; overflow: hidden;
  padding: 10px; border: 1px solid #fff; border-radius: 16px;
  background: #ffffff9e; box-shadow: 0 4px 14px #2e41730e, inset 0 0 0 1px #dce5f350;
}
.jsc-preview-gallery { grid-template-rows: minmax(0, 1fr) auto; gap: 8px; }
.jsc-preview-stage {
  position: relative; min-height: 0; overflow: hidden; border-radius: 11px; container-type: size;
  background: radial-gradient(ellipse at 50% 35%, #f9faff 15%, #e7eefa);
}
.jsc-preview-stage > *, .jsc-preview-stage img { display: block; width: 100%; height: 100%; }
.jsc-preview-stage img, .jsc-preview-stage video { object-fit: contain; margin: 0; }
.jsc-preview-gallery-empty { display: grid; place-items: center; height: 100%; color: #7260ae; }
.jsc-preview-gallery-empty svg { width: 35px; height: 35px; }
.jsc-preview-stage > .jsc-preview-player { position: absolute; inset: 0; margin: auto; object-position: center; }
.jsc-preview-stage > iframe.jsc-preview-player {
  width: 100%; height: auto; max-width: 100%; max-height: 100%; aspect-ratio: 16 / 9;
}
@supports (width: 1cqh) {
  .jsc-preview-stage > iframe.jsc-preview-player { width: min(100%, calc(100cqh * 16 / 9)); }
}
.jsc-preview-gallery:has([data-jsc-preview-zoom]:not([hidden])) .jsc-preview-stage img { cursor: zoom-in; }
.jsc-preview-stage > .jsc-preview-zoom-layer {
  position: absolute; inset: 0; overflow: hidden; touch-action: none; cursor: zoom-out; background: #eef2fa;
}
.jsc-preview-stage > .jsc-preview-zoom-layer:active { cursor: grabbing; }
.jsc-preview-zoom-layer img { pointer-events: none; user-select: none; }
.jsc-preview-specs { grid-template-rows: auto minmax(0, 1fr) auto; gap: 8px; }
.jsc-preview-specs .jsc-preview-glyph { width: 29px; height: 29px; border-radius: 9px; }
.jsc-preview-specs h3 { margin: 0; color: #24324a; font-size: 14px; font-weight: 700; }
.jsc-preview-spec-body { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #bcb4dc transparent; }
.jsc-preview-spec-body:focus-visible { outline: 2px solid #6350c4; outline-offset: -2px; border-radius: 8px; }
.jsc-preview-spec-body p { margin: 0; font-size: 13px; line-height: 1.75; }
.jsc-preview-product-link {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 32px;
  padding: 4px 9px; color: #49339a; background: #f0edfa; border: 1px solid #e6e0f3;
  border-radius: 9px; font-size: 12px; font-weight: 600;
}
.jsc-preview-product-link:hover { background: #eae3ff; color: #36227b; }
.jsc-preview-product-link svg { width: 14px; height: 14px; }
.jsc-preview-buy {
  grid-row: 3; border-top: 1px solid #dce4f1; padding: 9px 18px; gap: 8px; background: #ffffffb5;
}
#jsc-preview-dialog .jsc-preview-buy .jsc-buy { min-height: 40px; padding-inline: 13px; border-radius: 11px; font-size: 12px; }
#jsc-preview-dialog .jsc-preview-buy .jsc-price { font-size: 16px; }
.jsc-preview-buy .jsc-download-options { flex-wrap: nowrap; align-items: center; min-width: 0; }
.jsc-preview-buy select { min-width: 0; max-width: min(27vw, 170px); min-height: 34px; }
.jsc-catalog .jsc-topics-dialog[open] {
  display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(824px, calc(100% - 24px));
  max-width: none; max-height: min(740px, 84vh); max-height: min(740px, 84dvh);
  border: 1px solid #f8f9ff; border-radius: 17px; overflow: hidden; background: #edf1f9;
  box-shadow: 0 18px 52px #1625473d;
}
.jsc-topics-dialog > header { position: static; padding: 10px 14px; background: #fcfdff; }
.jsc-topics-dialog > header h2 { font-weight: 700; font-size: 16px; }
.jsc-topic-directory-body { min-height: 0; padding: 12px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.jsc-catalog .jsc-topic-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.jsc-topic-directory-item { min-width: 0; }
.jsc-topic-directory-item:has(> details[open]) { grid-column: 1 / -1; }
.jsc-catalog .jsc-topic-directory .jsc-topic-tile {
  display: flex; align-items: center; justify-content: flex-start; gap: 7px; width: 100%;
  min-height: 52px; padding: 7px 9px; border: 1px solid #dce3f2; border-radius: 10px;
  color: #27334c; background: #fff; box-shadow: 0 2px 3px #273b6210;
  font-size: 12px; font-weight: 600; line-height: 1.55;
}
.jsc-topic-tile-name { min-width: 0; overflow-wrap: anywhere; }
.jsc-topic-tile-icon {
  display: grid; place-items: center; flex: none; width: 26px; height: 26px;
  border-radius: 8px; background: #efebfa; color: #593cae;
}
.jsc-topic-tile-icon svg { width: 14px; height: 14px; }
.jsc-topic-tile .jsc-chevron { flex: none; margin-inline-start: auto; }
.jsc-catalog .jsc-topic-directory .jsc-topic-tile:hover,
.jsc-catalog .jsc-topic-directory .jsc-topic-tile[aria-current],
.jsc-catalog .jsc-topic-directory .jsc-topic-branch[open] > summary {
  border-color: #c7b6e9; background: #f5f1ff; color: #47318d;
}
.jsc-topic-directory .jsc-topic-branch[open] {
  padding: 0 0 8px; border: 1px solid #dfd7ef; border-radius: 11px; background: #f8f7fd;
}
.jsc-topic-directory .jsc-topic-branch[open] > summary { border-color: transparent; box-shadow: none; }
.jsc-topic-directory .jsc-topic-children { margin: 0; padding: 8px 8px 0; border: 0; }
.jsc-catalog .jsc-topic-directory-all {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 4px 9px;
  margin: 0 0 8px; border: 1px solid #e4dcf5; border-radius: 8px; background: #fff; color: #543aa1;
  font-size: 12px; font-weight: 700;
}
.jsc-catalog .jsc-topic-directory-all:hover, .jsc-catalog .jsc-topic-directory-all[aria-current] { background: #eee6ff; }
.jsc-topic-directory-all svg { width: 13px; height: 13px; }
@media (min-width: 720px) {
  .jsc-catalog .jsc-topic-directory { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
}
@media (max-width: 375px) {
  .jsc-topic-directory-body { padding: 8px; }
  .jsc-catalog .jsc-topic-directory .jsc-topic-tile { padding: 6px; gap: 5px; }
  .jsc-topic-tile-icon { width: 22px; height: 22px; border-radius: 6px; }
}

@media (max-width: 1100px) {
  .jsc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .jsc-toolbar { gap: 8px; }
}
@media (max-width: 782px) {
  body.admin-bar .jsc-catalog { --jsc-adminbar-height: 46px; }
}
@media (max-width: 760px) {
  .jsc-catalog { padding-top: 12px; }
  .jsc-term-description:not(:empty), .jsc-pagination + .catalog-resources { margin-top: 36px; }
  .jsc-topic-strip { grid-template-columns: minmax(0, 1fr) 44px; gap: 6px; margin-top: 9px; }
  .jsc-topics { gap: 6px; overflow-x: auto; padding-block: 2px 5px; scrollbar-width: thin; scrollbar-color: #c8bce5 transparent; scroll-snap-type: x proximity; overscroll-behavior-x: contain; }
  .jsc-topic-strip .jsc-topics > .jsc-topic:not(.jsc-all-topics) { display: flex; flex: 0 0 112px; scroll-snap-align: start; }
  .jsc-catalog .jsc-topic { flex-basis: 0; min-height: 56px; gap: 4px; padding: 5px; }
  .jsc-catalog .jsc-all-topics { flex: 0 0 44px; flex-direction: column; gap: 2px; padding: 4px 2px; }
  .jsc-all-topics .jsc-topics-label-desktop { display: none; }
  .jsc-all-topics .jsc-topics-label-mobile { display: block; font-size: 9px; line-height: 1.5; white-space: nowrap; }
  .jsc-topic-cover { width: 36px; height: 31px; }
  .jsc-topic-sheet { width: calc(100% - 7px); height: calc(100% - 7px); border-width: 1px; border-radius: 3px; }
  .jsc-topic-sheet:nth-child(1) { inset-block-start: 1px; inset-inline-start: 6px; }
  .jsc-topic-sheet:nth-child(2) { inset-block-start: 4px; inset-inline-start: 3px; }
  .jsc-topic-sheet:nth-child(3) { inset-block-start: 7px; inset-inline-start: 0; }
  .jsc-topic strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; max-height: 3em; overflow: hidden; font-size: 10px; line-height: 1.5; }
  .jsc-controls { padding: 7px; }
  .jsc-toolbar { flex-direction: column; align-items: stretch; gap: 6px; }
  .jsc-search { flex: 0 0 auto; min-width: 0; }
  .jsc-catalog .jsc-search input { font-size: 16px; padding-inline: 6px; }
  .jsc-catalog .jsc-search input::placeholder { font-size: 13px; }
  .jsc-catalog .jsc-search .jsc-primary { width: 34px; min-height: 34px; }
  .jsc-filterbar { flex-wrap: wrap; gap: 4px; padding: 0; overflow: visible; }
  .jsc-filter-dropdown { flex: 1 0 auto; }
  .jsc-filter-dropdown-icon { flex: 0 0 36px; width: 36px; }
  .jsc-catalog .jsc-filter-button {
    flex: 1 0 auto; justify-content: center; min-width: 34px; min-height: 40px;
    gap: 0; padding: 4px 3px; font-size: 12px;
  }
  .jsc-catalog .jsc-filter-icon-only { flex: 0 0 36px; width: 36px; padding: 4px; }
  .jsc-filter-button:not(.jsc-filter-icon-only) .jsc-filter-glyph,
  .jsc-filter-button :is(.jsc-chevron, .jsc-filter-count, .jsc-filter-label-desktop) { display: none; }
  .jsc-filter-label-mobile { display: inline; }
  .jsc-catalog .jsc-filter-button:has(.jsc-filter-count) { color: #5133a5; border-color: #a996d6; background: #f1ecff; }
  .jsc-color-wheel { width: 23px; height: 23px; }
  .jsc-panel { left: 0; width: 100%; }
  .jsc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 13px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-grid { grid-template-columns: minmax(0, 1fr); }
  .jsc-card { height: 100%; border-radius: 14px; }
  .jsc-cover { margin: 5px 5px 0; border-radius: 10px; }
  :is(.jsc-catalog, .jsc-loop-card) .jsc-save { width: 24px; height: 24px; top: 4px; left: 4px; border-radius: 8px; }
  :is(.jsc-catalog, .jsc-loop-card) :is(.jsc-preview-hint, .jsc-featured-badge) { width: 24px; height: 24px; }
  :is(.jsc-catalog, .jsc-loop-card) :is(.jsc-save, .jsc-preview-hint, .jsc-featured-badge) svg { width: 12px; height: 12px; }
  :is(.jsc-catalog, .jsc-loop-card) .jsc-badge { top: 5px; right: 5px; }
  .jsc-pagination { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 4px; padding: 8px; }
  .jsc-page-range { grid-column: 1; grid-row: 1; font-size: 10px; }
  .jsc-page-size { grid-column: 2; grid-row: 1; max-width: 100%; }
  .jsc-page-size select { max-width: 100%; font-size: 10px; padding-inline: 5px; }
  .jsc-page-links { grid-row: 2; grid-column: 1 / -1; }
  .jsc-card-body { padding: 8px 8px 0; }
  .jsc-card h3 { font-size: 11px; }
  .jsc-card-body > h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; height: 3.4em; flex: none; overflow: hidden; }
  .jsc-specs { flex-wrap: nowrap; min-height: 18px; gap: 4px; font-size: 10px; overflow: hidden; white-space: nowrap; }
  .jsc-specs > span { min-width: 0; overflow: hidden; }
  .jsc-specs > span:first-child:not(:last-child) { flex: none; }
  .jsc-specs > span + span { padding-inline-start: 4px; }
  .jsc-specs svg { width: 12px; height: 12px; }
  .jsc-buy-row { flex-direction: row; align-items: center; flex-wrap: nowrap; gap: 4px; padding-block: 8px; }
  .jsc-buy-row .jsc-price { min-width: 0; font-size: clamp(9px, 2.4vw, 11px); white-space: nowrap; overflow-wrap: normal; }
  :is(.jsc-catalog, .jsc-loop-card) .jsc-buy-row .jsc-buy { flex: none; width: auto; min-height: 34px; padding: 4px 5px; border-radius: 8px; font-size: clamp(9px, 2.1vw, 10px); line-height: 1.5; white-space: nowrap; }
  .jsc-buy-row .jsc-buy svg { display: none; }
  .jsc-buy-row .jsc-download-form { flex: none; }
  .jsc-package-card { padding: 7px; gap: 6px; }
  .jsc-package-card header { gap: 5px; }
  .jsc-package-icon { width: 25px; height: 25px; }
  .jsc-package-icon svg { width: 14px; height: 14px; }
  .jsc-package-stack { aspect-ratio: 1.66; border-radius: 8px; }
  .jsc-package-sheet { border-width: 1px; border-radius: 4px; }
  .jsc-package-sheet:nth-child(4), .jsc-package-sheet:nth-child(5) { display: none; }
  .jsc-package-total { column-gap: 4px; }
  .jsc-package-pricing > span { font-size: 10px; }
  .jsc-package-pricing .jsc-price { font-size: 12px; }
  .jsc-package-stack:is([data-jsc-covers="4"], [data-jsc-covers="5"]) .jsc-package-sheet:nth-child(1) {
    --top: 37%; --width: 59%; --height: 55%;
  }
  .jsc-package-stack:is([data-jsc-covers="4"], [data-jsc-covers="5"]) .jsc-package-sheet:nth-child(2),
  .jsc-package-stack:is([data-jsc-covers="4"], [data-jsc-covers="5"]) .jsc-package-sheet:nth-child(3) {
    --top: 13%; --width: 43%; --height: 56%;
  }
  .jsc-catalog .jsc-package-all { min-height: 35px; padding-inline: 4px; font-size: 11px; }
  .jsc-catalog .jsc-package-all svg { width: 13px; height: 13px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-card-body { padding: 12px 14px 0; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-card h3 { font-size: 15px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-specs { font-size: 12px; min-height: 22px; gap: 8px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-specs svg { width: 15px; height: 15px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-buy-row { padding-block: 12px; gap: 10px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-buy-row .jsc-price { font-size: 16px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-buy-row .jsc-buy { min-height: 42px; padding: 7px 12px; font-size: 12px; gap: 5px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-buy-row .jsc-buy svg { display: inline; width: 14px; height: 14px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] :is(.jsc-save, .jsc-preview-hint, .jsc-featured-badge) { width: 30px; height: 30px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] :is(.jsc-save, .jsc-preview-hint, .jsc-featured-badge) svg { width: 16px; height: 16px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-customize-note { font-size: 12px; }
  .jsc-catalog[data-jsc-mobile-columns="1"] .jsc-package-all { min-height: 42px; font-size: 13px; }
  .jsc-general-recommendations { padding: 10px; }
}
@media (max-width: 600px) {
  body.admin-bar .jsc-catalog { --jsc-adminbar-height: 0px; }
}
@media (max-width: 360px) {
  .jsc-filterbar { gap: 3px; }
  .jsc-catalog .jsc-filter-button { min-width: 32px; padding-inline: 2px; font-size: 11px; }
  .jsc-catalog .jsc-filter-icon-only { flex-basis: 34px; width: 34px; }
}

/* Related templates, editing information, FAQ and slide resources. */

.jsc-catalog .catalog-resources { display: grid; gap: 18px; margin-top: 28px; scroll-margin-top: 76px; --resource-copy: #5b566b; }
.jsc-catalog .resource-panel { min-width: 0; padding: 24px; background: #fff; border: 1px solid var(--border); border-radius: 15px; }
.jsc-catalog .resource-editability {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 10px 18px; padding-block: 15px;
  background: #fff; border-color: var(--border);
}
.jsc-catalog .resource-editability .resource-heading { margin: 0; }
.jsc-catalog .resource-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.jsc-catalog .resource-heading h2 { margin: 0; font-size: clamp(16px, 1.6vw, 20px); line-height: 1.65; }
.jsc-catalog .resource-heading p { margin: 4px 0 0; color: var(--resource-copy); font-size: 13px; }
.jsc-catalog .resource-heading-icon, .jsc-catalog .resource-tool-icon {
  display: grid; place-items: center; flex: none; width: 40px; height: 40px;
  color: #513eb4; background: #eae6fc; border-radius: 10px;
}
.jsc-catalog .resource-heading-icon svg { width: 21px; height: 21px; }
.jsc-catalog .resource-edit-options, .jsc-catalog .resource-tools-list, .jsc-catalog .resource-category-groups ul { list-style: none; margin: 0; padding: 0; }
.jsc-catalog .resource-edit-options { display: flex; flex-wrap: wrap; gap: 7px; }
.jsc-catalog .resource-edit-options li {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px;
  color: #453b72; background: #fff; border: 1px solid var(--border); border-radius: 8px; font-size: 13px;
}
.jsc-catalog .resource-edit-options svg { flex: none; width: 14px; height: 14px; color: #5143a2; }
.jsc-catalog .resource-category-groups h3, .jsc-catalog .resource-support h3 { margin: 0; font-size: 14px; }
.jsc-catalog .resource-support p { margin: 4px 0 0; color: var(--resource-copy); font-size: 13px; line-height: 1.85; }
.jsc-catalog .resource-category-groups a:hover, .jsc-catalog .resource-tools-list a:hover {
  border-color: #bdb0ec; background: #f3f0ff; color: #4b37a8;
}
.jsc-catalog .resource-tools-list strong { display: block; font-size: 13px; }
.jsc-catalog .resource-tools-list small { display: block; color: var(--resource-copy); font-size: 12px; }
.jsc-catalog .resource-category-groups a > svg {
  flex: none; width: 14px; height: 14px; margin-inline-start: auto; color: #6256ab;
}
.jsc-catalog .resource-category-groups { display: grid; grid-template-columns: 1.6fr 1fr; gap: 12px; }
.jsc-catalog .resource-category-groups section { padding: 13px; border-radius: 11px; background: #fff; border: 1px solid var(--border); }
.jsc-catalog .resource-category-groups h3 { margin-bottom: 8px; }
.jsc-catalog .resource-category-groups ul { display: flex; flex-wrap: wrap; gap: 7px; }
.jsc-catalog .resource-category-groups a {
  display: flex; align-items: center; gap: 7px; min-height: 40px; padding: 5px 10px;
  color: #453b72; background: #fff; border: 1px solid var(--border); border-radius: 8px; font-size: 13px;
}
.jsc-catalog .resource-category-groups a > svg { width: 12px; height: 12px; }
.jsc-catalog .resource-faq { display: grid; grid-template-columns: minmax(0, 1fr) minmax(224px, 29%); gap: 22px; align-items: stretch; }
.jsc-catalog .resource-faq .resource-heading { margin-bottom: 14px; }
.jsc-catalog .resource-questions { display: grid; gap: 7px; }
.jsc-catalog .resource-questions details { padding-inline: 12px; border: 1px solid #e3e9f1; border-radius: 9px; background: #f8fafd; }
.jsc-catalog .resource-questions details[open] { border-color: #d8cff2; background: #faf8ff; }
.jsc-catalog .resource-questions summary {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px;
  padding: 8px 0; list-style: none; cursor: pointer; font-size: 13px; font-weight: 700;
}
.jsc-catalog .resource-questions summary::-webkit-details-marker { display: none; }
.jsc-catalog .resource-questions summary::after {
  content: "+"; display: grid; place-items: center; width: 24px; height: 24px; flex: none;
  border-radius: 7px; background: #ede8fb; color: #5540a9; font-size: 16px; line-height: 1;
}
.jsc-catalog .resource-questions details[open] summary { color: #4b37a8; }
.jsc-catalog .resource-questions details[open] summary::after { content: "−"; }
.jsc-catalog .resource-questions p { margin: 0 0 11px; color: var(--resource-copy); font-size: 13px; line-height: 1.95; }
.jsc-catalog .resource-support {
  padding: 17px; border: 1px solid #e0d9f3; border-radius: 12px;
  background: radial-gradient(ellipse at top right, #ede4fc, transparent 70%), linear-gradient(140deg, #faf7ff, #edf5fe);
}
.jsc-catalog .resource-support h3 { margin-top: 9px; }
.jsc-catalog .resource-support a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 8px 10px; font-size: 13px; font-weight: 700; border-radius: 8px; }
.jsc-catalog .resource-support a svg { width: 14px; height: 14px; }
.jsc-catalog .resource-support-primary { margin-top: 12px; color: #fff; background: linear-gradient(120deg, #5140a9, #7058c9); }
.jsc-catalog .resource-support-primary:hover { background: #4a35a4; }
.jsc-catalog .resource-support-link { margin-top: 5px; color: #503c9c; background: #fff; border: 1px solid var(--border); }
.jsc-catalog .resource-support-link:hover { background: #f1ecff; }
.jsc-catalog .resource-tools-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.jsc-catalog .resource-tools-list a {
  display: flex; align-items: center; gap: 9px; min-height: 65px; height: 100%;
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 11px;
  background: linear-gradient(145deg, #fff, #f7f9fe);
}
.jsc-catalog .resource-tools-list a::after {
  content: ""; width: 6px; height: 6px; flex: none; margin-inline-start: auto;
  border: solid #7467b5; border-width: 0 0 1.5px 1.5px; transform: rotate(45deg);
}
.jsc-catalog .resource-tool-icon { width: 38px; height: 38px; border-radius: 9px; }
.jsc-catalog .resource-tools-list li:nth-child(3n+2) .resource-tool-icon { color: #315a9c; background: #e7effe; }
.jsc-catalog .resource-tools-list li:nth-child(3n) .resource-tool-icon { color: #34696f; background: #e5f2f5; }
.jsc-catalog .catalog-resources :is(a, button, summary):focus-visible { outline: 2px solid #503cb5; outline-offset: 2px; }
@media (max-width: 760px) {
.jsc-catalog .catalog-resources { gap: 12px; margin-top: 22px; }
.jsc-catalog .resource-panel { padding: 14px; border-radius: 12px; }
.jsc-catalog .resource-heading { gap: 9px; margin-bottom: 12px; }
.jsc-catalog .resource-heading-icon { width: 36px; height: 36px; }
.jsc-catalog .resource-category-groups, .jsc-catalog .resource-faq { grid-template-columns: minmax(0, 1fr); }
.jsc-catalog .resource-edit-options { gap: 6px; }
.jsc-catalog .resource-edit-options li { padding: 5px 8px; font-size: 12px; }
.jsc-catalog .resource-category-groups { gap: 8px; }
.jsc-catalog .resource-category-groups a { min-height: 44px; }
.jsc-catalog .resource-faq { gap: 14px; }
.jsc-catalog .resource-tools-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jsc-catalog .resource-tools-list a { gap: 7px; padding: 8px; }
.jsc-catalog .resource-tools-list a::after { display: none; }
.jsc-catalog .resource-tool-icon { width: 28px; height: 28px; }
.jsc-catalog .resource-tool-icon svg { width: 16px; height: 16px; }
}
@media (max-width: 350px) {
.jsc-catalog .resource-tools-list small { line-height: 1.55; }
.jsc-catalog .resource-tools-list a { flex-wrap: wrap; align-content: start; }
.jsc-catalog .resource-tools-list a > span:nth-child(2) { flex-basis: 100%; }
}


.jsc-catalog .jsc-favorites-link { color: var(--jsc-purple); }
.jsc-catalog .jsc-all-templates-link {
  white-space: nowrap; background: #f5f0ff; border-color: #dbcdf4;
  color: var(--jsc-purple); font-weight: 700;
}
.jsc-catalog .jsc-all-templates-link:hover { background: #eee5ff; border-color: #a996d6; }
.jsc-catalog .jsc-favorites-link[aria-current="page"], .jsc-catalog .jsc-favorites-link:hover { background: #f1ecff; border-color: #a996d6; }
.jsc-favorites-link[aria-current="page"] svg { fill: currentColor; }
.jsc-results-heading > .jsc-results-actions { align-items: center; flex-shrink: 0; }
.jsc-results-actions:empty { display: none; }
.jsc-catalog .jsc-results-heading .jsc-package-return {
  display: inline-flex; gap: 5px; align-items: center; min-height: 36px;
  padding: 5px 10px; border: 1px solid var(--jsc-border); border-radius: 8px;
  background: #fff; color: var(--jsc-purple); font-weight: 700;
}
.jsc-results-heading .jsc-package-return svg { transform: scaleX(-1); }
.jsc-results-heading:has(.jsc-package-return) { flex-wrap: wrap; }
.jsc-catalog .jsc-results-heading .jsc-reset {
  display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; min-height: 36px;
  border-radius: 8px; background: #5439b6; color: #fff; font-weight: 700;
}
.jsc-catalog .jsc-results-heading .jsc-reset:hover { background: #443099; }
.jsc-preview-slide-nav {
  display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 11px;
}
#jsc-preview-dialog :is(.jsc-preview-slide-nav, .jsc-preview-switch) button {
  min-width: 36px; min-height: 36px; margin: 0; padding: 3px 8px; border: 1px solid #dfe3f1;
  border-radius: 9px; background: #fffffff2; color: #4e36a3; font-size: 12px; cursor: pointer;
}
#jsc-preview-dialog .jsc-preview-slide-nav button:not(:disabled):hover { background: #eee8ff; border-color: #c9baf0; }
[data-jsc-preview-count] { min-width: 38px; text-align: center; color: #4e5671; }
#jsc-preview-dialog button:disabled { opacity: .45; cursor: default; }
#jsc-preview-dialog [data-jsc-preview-zoom][aria-pressed="true"] { background: #eae2ff; border-color: #ae9add; }
.jsc-preview-prev svg { transform: scaleX(-1); }
.jsc-preview-player { border: 0; background: #101523; }
.jsc-preview-facts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px;
  margin: 0; padding: 1px; font-size: 12px; overflow-wrap: anywhere;
}
.jsc-preview-fact {
  min-width: 0; padding: 7px 9px; border: 1px solid #e1e8f4; border-radius: 10px;
  background: linear-gradient(150deg, #fff, #f6f8fd); box-shadow: inset 0 1px #fff;
}
.jsc-preview-fact dt { margin: 0 0 2px; font-size: 11px; font-weight: 600; line-height: 1.55; color: #4e5670; }
.jsc-preview-fact dd { margin: 0; color: #1e2e49; font-weight: 700; line-height: 1.65; }
.jsc-preview-table {
  width: 100%; margin: 0; border-collapse: separate; border-spacing: 3px;
  table-layout: fixed; font-size: 12px; line-height: 1.65;
}
.jsc-preview-table :is(th, td) {
  padding: 6px 8px; border: 1px solid #e0e7f5; border-radius: 7px;
  background: #ffffffd9; text-align: start; vertical-align: top; overflow-wrap: anywhere;
}
.jsc-preview-table th { background: #f3effc; color: #493879; }
@media (min-width: 721px) and (max-width: 870px) {
  .jsc-preview-facts { grid-template-columns: minmax(0, 1fr); }
  .jsc-preview-fact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 7px; }
}
@media (max-width: 720px), (max-height: 420px) {
  #jsc-preview-dialog[open] {
    width: calc(100% - 16px); height: min(690px, calc(100vh - 16px)); height: min(690px, calc(100dvh - 16px));
    border-radius: 15px;
  }
  #jsc-preview-dialog > header { padding: 8px 10px; }
  .jsc-preview-switch {
    display: flex; gap: 4px; margin: 8px 10px 0; padding: 3px;
    border: 1px solid #fff; border-radius: 11px; background: #e8ecfa;
  }
  #jsc-preview-dialog .jsc-preview-switch button { flex: 1; min-height: 34px; border-color: transparent; background: transparent; }
  #jsc-preview-dialog .jsc-preview-switch button[aria-pressed="true"] {
    background: #fff; border-color: #e1d9f4; box-shadow: 0 2px 4px #39476612; font-weight: 700;
  }
  .jsc-preview-grid { grid-template-columns: minmax(0, 1fr); padding: 8px 10px; }
  .jsc-preview-gallery, .jsc-preview-specs { padding: 8px; border-radius: 12px; }
  .jsc-preview-grid[data-jsc-preview-active="gallery"] .jsc-preview-specs,
  .jsc-preview-grid[data-jsc-preview-active="specs"] .jsc-preview-gallery { display: none; }
  .jsc-preview-buy { padding: 7px 10px; }
}
@media (max-width: 345px) {
  .jsc-preview-fact { padding-inline: 6px; }
}
/* Translucent surfaces use a solid fallback and keep the sticky header gap opaque. */
.jsc-controls { background: #ffffffec; border-color: #ffffffdb; box-shadow: 0 7px 18px #33476818; }
.jsc-sticky-controls[data-jsc-stuck] > .jsc-controls { background: #f8faff; }
.jsc-catalog .jsc-topic { background: #ffffffba; border-color: #ffffffd9; }
.jsc-catalog .jsc-all-topics { background: #f6f1ffdf; }
@media (min-width: 761px) {
  .jsc-sticky-controls:not([data-jsc-stuck]) > .jsc-controls { backdrop-filter: blur(9px); }
}
@media (prefers-reduced-motion: reduce) {
  .jsc-update-status[data-state=loading]::before { animation: none; }
  .jsc-card { transition: none; }
}