@import url("/mobile-typography.css?v=10");

/* Award.vibe brand theme v3 — authoritative across guest, member and responsive UI. */
:root {
  color-scheme:dark;
  --brand-page:var(--color-neutral-950,#0e0e11);
  --brand-surface:var(--color-neutral-900,#17161b);
  --brand-surface-soft:var(--color-neutral-850,#201e25);
  --brand-surface-raised:var(--color-neutral-800,#27252b);
  --brand-line:rgba(247,239,233,.1);
  --brand-line-strong:rgba(247,239,233,.18);
  --brand-text:var(--color-neutral-50,#f7f5f6);
  --brand-muted:var(--color-neutral-300,#bdb8c0);
}

html { background-color:var(--brand-page); }

/* White signature lockup for every dark navigation surface. */
:where(.nav,.mobile-drawer) .brand-symbol--nav {
  opacity:1 !important;
  filter:brightness(0) invert(1) !important;
}
:where(.nav,.mobile-drawer) .brand-wordmark {
  color:#fff !important;
}

:where(
  .home-page,.pricing-page,.access-page,.signup-page,.account-page,
  .collection-page,.project-standalone-page,.project-page,.library-project-page,
  .contact-page,.request-page,.how-use-page,.legal-page,.help-page,
  .purchase-flow-page,.prmpt-page,.lithos-page
) {
  accent-color:var(--ds-primary);
}

:where(button,a,input,select,textarea,summary):focus-visible {
  outline-color:var(--ds-primary-400) !important;
}

/* Primary actions */
:where(
  .account-submit,.pricing-offer-action,.launch-offer__action,.purchase-action,
  .project-prompt-list__gate > a,.project-comment-login .account-submit,
  .mobile-premium-gate__actions [data-premium-gate-unlock],
  [data-modal-project-access],[data-project-modal-access],
  .project-prompt-list__item > button.is-copied,
  .project-detail-modal__tabs button[aria-selected="true"],
  .project-detail-modal__guide-ide footer button[data-guide-confirm],
  .project-detail-modal__guide-progress li.is-current b,
  .project-detail-modal__ide-bridge.is-active kbd,
  .contact-page form > button[type="submit"],.request-form > button[type="submit"],
  .account-page .settings-form__footer button:not(:disabled),
  .account-page .settings-email-card > button:not(:disabled),
  .account-page .settings-security-row > button:not(:disabled),
  .support-card > button
) {
  border-color:var(--ds-primary) !important;
  background:var(--ds-primary) !important;
  color:#fff !important;
  box-shadow:0 16px 34px -24px rgba(98,91,231,.72) !important;
}

.purchase-button {
  background:var(--ds-primary) !important;
  box-shadow:0 16px 34px -24px rgba(98,91,231,.72) !important;
}

/* Checkout gradients use only the new primary family. */
.checkout-page,.pricing-page,.purchase-flow-page {
  --gradient:var(--brand-ui-gradient) !important;
}
.checkout-progress > i,.checkout-progress span,
.pricing-progress > i,.pricing-progress span { background:var(--brand-ui-gradient) !important; }

:where(
  .account-submit,.pricing-offer-action,.launch-offer__action,.purchase-action,
  .project-prompt-list__gate > a,.project-comment-login .account-submit,
  .mobile-premium-gate__actions [data-premium-gate-unlock],
  [data-modal-project-access],[data-project-modal-access],
  .contact-page form > button[type="submit"],.request-form > button[type="submit"],
  .account-page .settings-form__footer button:not(:disabled),
  .account-page .settings-email-card > button:not(:disabled),
  .account-page .settings-security-row > button:not(:disabled),
  .support-card > button
):hover {
  border-color:var(--ds-primary-hover) !important;
  background:var(--ds-primary-hover) !important;
}

:where(
  .account-submit,.pricing-offer-action,.launch-offer__action,.purchase-action,
  .project-prompt-list__gate > a,.project-comment-login .account-submit,
  .mobile-premium-gate__actions [data-premium-gate-unlock]
):active {
  border-color:var(--ds-primary-active) !important;
  background:var(--ds-primary-active) !important;
}

/* Secondary actions — warm white, never stark white. */
:where(
  .account-google,.plan-action--secondary,.nav-header-cta,
  .project-prompt-list__item > button:not(.is-copied),
  .project-detail-modal__prompt-actions button[data-guide-copy],
  .project-detail-modal__guide-ide footer button[data-guide-copy-again],
  .project-detail-modal [data-guide-restart],
  .pricing-current-access__actions > a,.settings-access-card > a,
  .settings-control-card__action
) {
  border-color:var(--ds-secondary-border) !important;
  background:var(--ds-secondary) !important;
  color:var(--ds-secondary-ink) !important;
}

:where(
  .account-google,.plan-action--secondary,.nav-header-cta,
  .project-prompt-list__item > button:not(.is-copied),
  .project-detail-modal__prompt-actions button[data-guide-copy],
  .project-detail-modal__guide-ide footer button[data-guide-copy-again],
  .project-detail-modal [data-guide-restart]
):hover { background:var(--ds-secondary-hover) !important;color:var(--ds-secondary-ink) !important; }

/* Promotion and scarcity use the warm accent, not an unrelated pink. */
:where(
  .pricing-hero__limited,.pricing-offer-badge,
  .launch-offer__badge,.pricing-save,.pricing-discount,.pricing-ribbon,
  [data-offer-badge],[data-discount-badge]
) {
  border-color:rgba(243,160,108,.28) !important;
  background:var(--color-accent-500) !important;
  color:var(--color-neutral-950) !important;
}

/* Keep the desktop navigation offer consistent with the mobile menu badge. */
.desktop-nav__pricing > small {
  min-height:24px !important;
  padding:0 10px !important;
  border-color:#e5484d !important;
  background:#e5484d !important;
  color:#fff !important;
  font-size:9.5px !important;
  box-shadow:0 8px 18px -12px rgba(229,72,77,.72) !important;
}

@media (min-width:901px) {
  .nav .desktop-nav__links > a,
  .nav .desktop-nav__links > a > span,
  .nav .nav-login-primary,
  .nav .nav-header-cta .btn-cta__group,
  .nav .nav-header-cta .btn-cta__word {
    font-size:12px !important;
  }
}

@media (max-width:900px) {
  html:not(#mobile-type-specificity):not(#mobile-type-system) body
    .mobile-drawer__nav > a[data-nav-pricing] > small {
    min-height:30px !important;
    margin-left:6px !important;
    padding:3px 11px 3px 8px !important;
    gap:5px !important;
    font-size:11px !important;
    letter-spacing:.045em !important;
  }

  html:not(#mobile-type-specificity):not(#mobile-type-system) body
    .mobile-drawer__nav > a[data-nav-pricing] > small *,
  html:not(#mobile-type-specificity):not(#mobile-type-system) body
    .mobile-drawer__nav > a[data-nav-pricing] > small b {
    font-size:11px !important;
  }

  html:not(#mobile-type-specificity):not(#mobile-type-system) body
    .mobile-drawer__nav > a[data-nav-pricing] > small svg {
    width:15px !important;
    height:15px !important;
  }
}

/* Project catalogue — light presentation trays with inset website mockups. */
:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card {
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card:hover {
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card__preview {
  width:100% !important;
  aspect-ratio:1.28 / 1 !important;
  margin:0 !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:18px !important;
  background:#ececeb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75) !important;
  clip-path:none !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image) {
  position:absolute !important;
  z-index:1 !important;
  top:15% !important;
  right:auto !important;
  bottom:auto !important;
  left:9% !important;
  width:82% !important;
  height:70% !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:10px !important;
  background:#f7f7f5 !important;
  object-fit:cover !important;
  object-position:center top !important;
  box-shadow:0 22px 36px -19px rgba(22,24,28,.42),0 5px 12px -8px rgba(22,24,28,.28) !important;
  transform:none !important;
  transition:box-shadow .24s ease,transform .32s cubic-bezier(.16,1,.3,1) !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card__preview > .collection-card-video--contain {
  object-fit:contain !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card__preview > .collection-card-image--contain {
  object-fit:contain !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card:hover .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image) {
  box-shadow:0 26px 42px -20px rgba(22,24,28,.48),0 7px 15px -9px rgba(22,24,28,.3) !important;
  transform:translateY(-2px) !important;
}

/* The home catalogue is a static visual shelf: hovering must never move,
   resize or deepen the artwork mockup. */
@media (min-width:901px) and (hover:hover) and (pointer:fine) {
  .home-page .gallery .showcase-card:hover .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image) {
    box-shadow:0 22px 36px -19px rgba(22,24,28,.42),0 5px 12px -8px rgba(22,24,28,.28) !important;
    transform:none !important;
    scale:1 !important;
    transition:none !important;
  }
}

@media (min-width:901px) {
  body.home-page > main#main-content .gallery .showcase-card__meta h3,
  body.home-page > main#main-content .gallery .showcase-card--lithos .showcase-card__meta h3 {
    font-size:15px !important;
  }
}

@media (max-width:900px) {
  body.home-page > main#main-content .gallery .showcase-card__meta h3,
  body.home-page > main#main-content .gallery .showcase-card--lithos .showcase-card__meta h3 {
    font-size:11px !important;
  }
}

/* Hero CTA — deep black core framed by the Award.vibe spectrum. */
body.home-page .hero .btn-cta--compact.btn-cta--linked.cta-style--gallery,
body.home-page.auth-guest .hero .btn-cta--compact.btn-cta--linked.cta-style--gallery {
  box-sizing:border-box !important;
  border:2px solid transparent !important;
  background:
    linear-gradient(#09090b,#09090b) padding-box,
    linear-gradient(112deg,#ff8a3d 0%,#f45175 30%,#8a56e8 61%,#438cf2 100%) border-box !important;
  background-size:100% 100%,180% 180% !important;
  background-position:center,0% 50% !important;
  color:#fff !important;
  box-shadow:
    0 18px 34px -25px rgba(9,9,11,.78),
    0 12px 28px -25px rgba(116,84,232,.72),
    inset 0 1px 0 rgba(255,255,255,.1) !important;
  transform:none !important;
  transition:background-position .55s cubic-bezier(.22,1,.36,1),box-shadow .3s ease !important;
}

body.home-page .hero .btn-cta--compact.btn-cta--linked.cta-style--gallery:hover,
body.home-page.auth-guest .hero .btn-cta--compact.btn-cta--linked.cta-style--gallery:hover {
  background:
    linear-gradient(#09090b,#09090b) padding-box,
    linear-gradient(112deg,#ff8a3d 0%,#f45175 30%,#8a56e8 61%,#438cf2 100%) border-box !important;
  background-size:100% 100%,180% 180% !important;
  background-position:center,100% 50% !important;
  box-shadow:
    0 20px 38px -25px rgba(9,9,11,.82),
    0 14px 32px -24px rgba(116,84,232,.82),
    inset 0 1px 0 rgba(255,255,255,.14) !important;
  transform:none !important;
}

body.home-page .hero .btn-cta--compact.btn-cta--linked.cta-style--gallery .btn-cta__group {
  color:#fff !important;
  text-shadow:none !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) :is(.collection-card-index,.lithos-card-index) {
  display:none !important;
}

:is(
  .home-page .gallery,
  .collection-page .collection-gallery
) .showcase-card__meta {
  min-height:56px !important;
  margin:0 !important;
  padding:11px 10px 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

@media (max-width:680px) {
  .home-page .gallery .gallery__grid,
  .collection-page .collection-gallery .gallery__grid,
  .collection-page .collection-skeleton__grid {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    column-gap:8px !important;
    row-gap:18px !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__preview {
    aspect-ratio:1.08 / 1 !important;
    border-radius:11px !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image) {
    top:18% !important;
    left:8% !important;
    width:84% !important;
    height:64% !important;
    border-radius:6px !important;
    box-shadow:0 12px 20px -10px rgba(22,24,28,.45),0 3px 7px -5px rgba(22,24,28,.28) !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__preview > .card-likes {
    top:6px !important;
    right:6px !important;
    width:25px !important;
    min-width:25px !important;
    height:25px !important;
    min-height:25px !important;
    padding:0 !important;
    justify-content:center !important;
    gap:0 !important;
    border:0 !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.9) !important;
    color:#676a70 !important;
    box-shadow:0 5px 12px -8px rgba(19,21,24,.5) !important;
    -webkit-backdrop-filter:blur(8px) !important;
    backdrop-filter:blur(8px) !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .card-likes > span {
    width:13px !important;
    height:13px !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .card-likes > b {
    display:none !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__meta {
    min-height:38px !important;
    padding:7px 2px 0 !important;
    display:block !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__meta h3 {
    margin:0 !important;
    overflow:hidden !important;
    color:#f4f4f1 !important;
    font:500 12px/1.15 var(--sans) !important;
    letter-spacing:-.02em !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) :is(.showcase-card__heading p,.card-author-avatar,.card-bottom) {
    display:none !important;
  }

  :is(
    .home-page .gallery,
    .collection-page .collection-gallery
  ) .showcase-card__heading::after {
    display:none !important;
  }

  .collection-page .collection-skeleton .gallery-skeleton-card,
  .collection-page .collection-gallery .gallery-skeleton-card {
    border-radius:11px !important;
  }

  .collection-page .collection-skeleton .gallery-skeleton-card__preview,
  .collection-page .collection-gallery .gallery-skeleton-card__preview {
    width:100% !important;
    aspect-ratio:1.08 / 1 !important;
    margin:0 !important;
    border-radius:11px !important;
    background:#ececeb !important;
    clip-path:none !important;
  }
}

/* Tablet/mobile browser width: keep the text sort control fully inside the viewport. */
@media (min-width:681px) and (max-width:900px) {
  body.home-page .gallery {
    padding-right:20px !important;
    padding-left:20px !important;
    box-sizing:border-box !important;
  }

  body.home-page .gallery .gallery-toolbar {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 112px !important;
    align-items:center !important;
    gap:12px !important;
    overflow:visible !important;
  }

  body.home-page .gallery .gallery-filter-scroll {
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] {
    grid-column:2 !important;
    grid-row:1 !important;
    width:112px !important;
    min-width:112px !important;
    max-width:112px !important;
    height:40px !important;
    margin:0 !important;
    justify-self:end !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary {
    width:112px !important;
    min-width:112px !important;
    max-width:112px !important;
    height:40px !important;
    min-height:40px !important;
    padding:0 13px 0 15px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    overflow:hidden !important;
    border:1px solid #dedede !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#202124 !important;
    font:500 14px/1 var(--sans) !important;
    box-shadow:none !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary > span {
    display:block !important;
    min-width:0 !important;
    overflow:hidden !important;
    color:inherit !important;
    font:inherit !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary > svg {
    width:15px !important;
    height:15px !important;
    flex:0 0 15px !important;
    color:#898989 !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] .gallery-sort__menu {
    top:calc(100% + 8px) !important;
    right:0 !important;
    left:auto !important;
  }
}

/* Branded selected and copied states. */
:where(
  .gallery-toggle button[aria-pressed="true"],
  .collection-format-toggle button[aria-pressed="true"],
  .pricing-billing-options button.is-selected,
  .project-prompt-stepper button.is-selected,
  .project-direct-prompt__toggle[aria-expanded="true"] > span,
  .project-detail-modal__step-card.is-current > header b
) {
  border-color:var(--ds-primary) !important;
}

:where(
  .pricing-billing-options button.is-selected,
  .project-prompt-stepper button.is-selected,
  .project-direct-prompt__toggle[aria-expanded="true"] > span,
  .project-detail-modal__step-card.is-current > header b
) { background:var(--ds-primary) !important;color:#fff !important; }

/* Semantic states stay semantic, but use the new controlled palette. */
:where(.is-success,[data-status="success"],.project-detail-modal__step-card.is-complete > header b,
  .project-detail-modal__guide-progress li.is-complete b,.project-detail-modal__guide-finished > i) {
  border-color:var(--color-success) !important;
  background:var(--color-success) !important;
}
:where(.is-error,[data-status="error"],.settings-inline-delete > button,.settings-delete-section button[data-delete-account]) {
  border-color:var(--color-danger) !important;
  background:var(--color-danger) !important;
  color:#fff !important;
}

:where(
  .account-menu-row--danger,.settings-link--danger,.settings-inline-delete > p strong,
  .settings-control-card--danger .settings-control-card__icon,
  .delete-account-card__icon,.delete-account-card label strong,
  .delete-account-card form > p,.settings-danger-block > span,
  .settings-delete-section > header > span
) { color:var(--color-danger) !important; }

:where(
  .settings-control-card--danger .settings-control-card__action,
  .delete-account-card form > button,
  .settings-delete-disclosure summary
) { background:var(--color-danger) !important;color:#fff !important; }

/* Likes are a warm brand accent; project artwork remains untouched. */
:where([data-project-like][aria-pressed="true"],.project-comment button.is-liked,.card-likes.is-liked) {
  color:var(--color-accent-500) !important;
}

/* Inputs and panels use neutral tokens in every authentication state. */
:where(.access-page,.signup-page,.account-page,.contact-page,.request-page,.help-page)
  :where(input,select,textarea) {
  caret-color:var(--ds-primary);
}
:where(.access-page,.signup-page,.account-page,.contact-page,.request-page,.help-page)
  :where(input,select,textarea):focus {
  border-color:var(--ds-primary-400) !important;
  box-shadow:0 0 0 3px rgba(98,91,231,.16) !important;
}

/* Keep native control UI coherent on mobile. */
@media (max-width:900px) {
  .nav__links { background:var(--brand-page) !important;color:var(--brand-text) !important; }
  .mobile-drawer__quick-action--access,
  .mobile-drawer__buy b { background:var(--ds-primary) !important;color:#fff !important; }
  .mobile-drawer__brand,.mobile-drawer__nav a,.mobile-drawer__controls > button {
    color:var(--brand-text) !important;
  }
}

@media (prefers-color-scheme:dark) {
  :root { color-scheme:dark; }
}

/* A simple editorial feature row replaces the former video testimonials. */
.home-page .home-value-grid {
  width:min(1600px,calc(100vw - 96px));
  margin:clamp(82px,8vw,132px) auto;
  color:#f5f5f2;
}

.home-page .home-value-grid__cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(22px,2.2vw,40px);
}

.home-page .home-value-card {
  min-height:330px;
  padding:clamp(36px,3.2vw,54px);
  border:0;
  border-radius:30px;
  background:#1d1d20;
  box-shadow:none;
}

.home-page .home-value-card h3 {
  margin:0 0 22px;
  color:#f5f5f2;
  font-family:var(--sans);
  font-size:clamp(22px,1.55vw,30px);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.12;
}

.home-page .home-value-card p {
  margin:0;
  color:#a7a7a2;
  font-family:var(--sans);
  font-size:clamp(17px,1.2vw,23px);
  font-weight:400;
  letter-spacing:-.016em;
  line-height:1.55;
}

@media (max-width:900px) {
  .home-page .home-value-grid {
    width:auto;
    margin:72px 20px 84px;
  }

  .home-page .home-value-grid__cards {
    grid-template-columns:1fr;
    gap:14px;
  }

  .home-page .home-value-card {
    min-height:0;
    padding:30px 26px 34px;
    border-radius:22px;
  }

  .home-page .home-value-card h3 {
    margin-bottom:14px;
    font-size:22px;
  }

  .home-page .home-value-card p {
    font-size:16px;
    line-height:1.5;
  }
}

/* Home cards have no hover presentation. Their full visual state is fixed;
   only explicit controls inside them keep their own interaction semantics. */
@media (min-width:901px) and (hover:hover) and (pointer:fine) {
  .home-page .gallery .showcase-card,
  .home-page .gallery .showcase-card[data-kind],
  .home-page .gallery .showcase-card[data-price],
  .home-page .gallery .showcase-card:hover,
  .home-page .gallery .showcase-card[data-kind]:hover,
  .home-page .gallery .showcase-card[data-price]:hover,
  .home-page .gallery .showcase-card.is-home-visible:hover {
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    filter:none !important;
    transform:none !important;
    transition:none !important;
  }

  .home-page .gallery .showcase-card__preview,
  .home-page .gallery .showcase-card:hover .showcase-card__preview {
    border:0 !important;
    outline:0 !important;
    background:#ececeb !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.75) !important;
    transform:none !important;
    transition:none !important;
  }

  .home-page .gallery .showcase-card__meta,
  .home-page .gallery .showcase-card:hover .showcase-card__meta,
  .home-page .gallery .showcase-card--lithos .showcase-card__meta {
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .home-page .gallery .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image),
  .home-page .gallery .showcase-card:hover .showcase-card__preview > :is(.collection-card-image,.collection-card-video,.preview-card-image) {
    position:absolute !important;
    top:15% !important;
    right:auto !important;
    bottom:auto !important;
    left:9% !important;
    width:82% !important;
    height:70% !important;
    box-shadow:0 22px 36px -19px rgba(22,24,28,.42),0 5px 12px -8px rgba(22,24,28,.28) !important;
    filter:none !important;
    transform:none !important;
    scale:1 !important;
    transition:none !important;
  }

  .home-page .gallery .showcase-card .showcase-card__heading p,
  .home-page .gallery .showcase-card:hover .showcase-card__heading p {
    opacity:0 !important;
    transform:translateY(3px) !important;
    transition:none !important;
  }

  .home-page .gallery .showcase-card .showcase-card__heading::after,
  .home-page .gallery .showcase-card:hover .showcase-card__heading::after {
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }

  body.home-page .gallery .showcase-card .card-likes,
  body.home-page .gallery .showcase-card:hover .card-likes,
  body.home-page.auth-member .gallery .showcase-card .card-likes,
  body.home-page.auth-has-access .gallery .showcase-card .card-likes {
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transition:none !important;
  }
}

.gallery-sort__mobile-icon {
  display:none !important;
}

/* Final mobile catalogue sizing: matches the site's complete mobile-nav range. */
@media (max-width:900px) {
  body.home-page .gallery .gallery-toolbar {
    position:relative !important;
    isolation:isolate !important;
    width:calc(100vw - 44px) !important;
    max-width:calc(100vw - 44px) !important;
    min-height:44px !important;
    display:block !important;
    gap:0 !important;
    overflow:visible !important;
  }

  body.home-page .gallery .gallery-filter-scroll {
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    height:44px !important;
    display:flex !important;
    align-items:center !important;
    padding-right:110px !important;
    box-sizing:border-box !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }

  body.home-page .gallery .gallery-filter-tags {
    gap:9px !important;
  }

  body.home-page .gallery .gallery-filter-tag {
    height:32px !important;
    min-height:32px !important;
    padding:0 16px !important;
    font-size:15px !important;
    font-weight:500 !important;
    line-height:1 !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort],
  body.home-page .gallery .gallery-sort[data-project-sort] > summary {
    width:100px !important;
    min-width:100px !important;
    max-width:100px !important;
    height:32px !important;
    min-height:32px !important;
    flex-basis:100px !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] {
    position:absolute !important;
    top:50% !important;
    right:0 !important;
    left:auto !important;
    margin:0 !important;
    z-index:3 !important;
    transform:translateY(-50%) !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary {
    padding:0 13px 0 15px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:7px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
    border:1px solid #dedede !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#29292b !important;
    font:500 15px/1 var(--sans) !important;
    box-shadow:none !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary > span,
  body.home-page .gallery .gallery-sort[data-project-sort] > summary > .gallery-sort__chevron {
    display:block !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary > .gallery-sort__mobile-icon {
    display:none !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] .gallery-sort__menu {
    top:calc(100% + 8px) !important;
    right:0 !important;
    left:auto !important;
  }

  body.home-page .gallery .gallery-sort[data-project-sort] > summary > .gallery-sort__chevron {
    width:15px !important;
    height:15px !important;
    flex:0 0 15px !important;
  }
}