:where(body.public-artist-body--campaign-carousel) {
    --artist-page-bg: #ffffff;
    --artist-surface-bg: #ffffff;
    --artist-surface-elevated: #ffffff;
    --artist-ink: #242424;
    --artist-muted: #6b6b6b;
}

.artist-public-campaign {
    --campaign-accent: var(--artist-accent, #e54e5b);
    --campaign-highlight: var(--artist-highlight, #efde59);
    --campaign-dark: var(--artist-highlight-alt, #242424);
    --campaign-ink: var(--artist-ink, #242424);
    --campaign-bg: var(--artist-page-bg, #ffffff);
    --campaign-header-h: 4.2rem;
    --campaign-notch: 0rem;
    --campaign-radius: 2.4rem;
    position: relative;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    padding: 0 1rem 1rem;
    color: var(--campaign-ink);
    background: var(--campaign-page-image, none) center / cover fixed;
}

.artist-public-campaign.campaign-is-home {
    background-image: none;
}

.artist-public-campaign.campaign-has-logo {
    --campaign-notch: 4.4rem;
}

/* Intro: the artist logo wobbles on a blank screen and the screen collapses to reveal the page */
.campaign-loader {
    display: none;
}

.campaign-js .campaign-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    background: var(--campaign-bg);
    animation: campaignLoaderFailsafe 0.01s 8s forwards;
}

.campaign-js.is-ready .campaign-loader {
    display: none;
}

.campaign-loader__logo img {
    display: block;
    height: min(38vh, 15rem);
    width: auto;
    max-width: 70vw;
    object-fit: contain;
    animation: campaignLogoWobble 1.4s ease-out both;
}

.campaign-loader__logo span {
    display: block;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(2rem, 7vw, 4rem);
    font-weight: 900;
    text-transform: uppercase;
    animation: campaignLogoWobble 1.4s ease-out both;
}

.campaign-js.is-finishing .campaign-loader {
    animation: campaignLoaderFinish 0.8s forwards;
}

.campaign-js.is-finishing .campaign-loader__logo {
    animation: campaignLogoOut 0.3s forwards;
}

@keyframes campaignLogoWobble {
    0% { opacity: 0; transform: scale(0.55) rotate(-8deg); }
    30% { opacity: 1; transform: scale(1.05) rotate(5deg); }
    55% { transform: scale(1) rotate(-4deg); }
    80% { transform: scale(1) rotate(2deg); }
    100% { opacity: 1; transform: scale(1) rotate(0); }
}

@keyframes campaignLogoOut {
    to { transform: scale(0.5); }
}

@keyframes campaignLoaderFinish {
    0% { transform: scale(1); clip-path: circle(75% at 50% 50%); }
    25% { transform: scale(1.4); clip-path: circle(40% at 50% 50%); }
    100% { transform: scale(0); clip-path: circle(0% at 50% 50%); }
}

@keyframes campaignLoaderFailsafe {
    to { visibility: hidden; }
}

/* Header and folding menu */
.campaign-header {
    position: relative;
    z-index: 45;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--campaign-header-h);
}

.campaign-brand {
    position: relative;
    z-index: 3;
    display: inline-flex;
    justify-content: center;
    color: var(--campaign-ink);
    text-decoration: none;
}

.campaign-js .campaign-brand {
    opacity: 0;
    transform: translateY(-1.5rem) scale(0.6);
}

.campaign-js.is-finishing .campaign-brand,
.campaign-js.is-ready .campaign-brand {
    opacity: 1;
    transform: none;
    transition: transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s, opacity 0.3s ease 0.15s;
}

.campaign-brand__logo {
    display: block;
    height: 7rem;
    width: auto;
    max-width: 14rem;
    object-fit: contain;
    margin-bottom: -2.8rem;
}

.campaign-brand__wordmark {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.campaign-menu-toggle {
    position: absolute;
    top: 50%;
    left: 0.5rem;
    z-index: 4;
    display: none;
    width: 3rem;
    height: 3rem;
    padding: 0.5rem;
    border: 0;
    background: transparent;
    transform: translateY(-50%);
    cursor: pointer;
}

.campaign-menu-toggle span {
    display: block;
    height: 2px;
    margin: 0.4rem 0;
    background: var(--campaign-ink);
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.is-menu-open .campaign-menu-toggle span:nth-child(1) {
    transform: translateY(0.6rem) rotate(45deg);
}

.is-menu-open .campaign-menu-toggle span:nth-child(2) {
    opacity: 0;
}

.is-menu-open .campaign-menu-toggle span:nth-child(3) {
    transform: translateY(-0.6rem) rotate(-45deg);
}

.campaign-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.4rem 0 0.4rem;
}

.campaign-menu__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.4rem 1.6rem;
}

.campaign-menu__nav a {
    position: relative;
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-decoration: none;
    text-transform: uppercase;
}

.campaign-menu__nav a.is-active,
.campaign-menu__nav a:hover {
    color: var(--campaign-accent);
}

.campaign-menu__more {
    display: none;
}

.artist-public-campaign.is-enhanced .campaign-menu-toggle {
    display: block;
}

.artist-public-campaign.is-enhanced .campaign-menu {
    left: -1rem;
    right: -1rem;
    z-index: 1;
    height: 0;
    padding: 0 1.5rem;
    gap: 0;
    justify-content: space-between;
    background: var(--campaign-bg);
    overflow: hidden;
    visibility: hidden;
    transition: height 0.3s ease-out, padding 0.3s ease-out, visibility 0s linear 0.3s;
}

.artist-public-campaign.is-enhanced.is-menu-open .campaign-menu {
    height: calc(100svh - var(--campaign-header-h));
    padding: 3rem 1.5rem 1.25rem;
    overflow-y: auto;
    visibility: visible;
    transition: height 0.3s ease-out, padding 0.3s ease-out, visibility 0s;
}

.artist-public-campaign.is-enhanced .campaign-menu__nav {
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 0;
}

.artist-public-campaign.is-enhanced .campaign-menu__nav a {
    display: block;
    margin: 0 0 1.75rem;
    font-size: 1.15rem;
    font-weight: 500;
    line-height: 1.3;
    opacity: 0;
    transform: translateY(0.75rem);
    transition: opacity 0.25s ease, transform 0.25s ease, color 0.2s ease;
}

.artist-public-campaign.is-menu-open .campaign-menu__nav a {
    opacity: 1;
    transform: none;
    transition-delay: calc(var(--item, 0) * 0.04s + 0.1s);
}

.artist-public-campaign.is-enhanced .campaign-menu__nav a.is-active {
    padding-left: 1rem;
}

.artist-public-campaign.is-enhanced .campaign-menu__nav a.is-active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.1rem;
    width: 3px;
    height: 1.3rem;
    border-radius: 3px;
    background: var(--campaign-accent);
}

.artist-public-campaign.is-enhanced .campaign-menu__more {
    display: block;
    text-align: center;
}

.campaign-menu__socials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 0.9rem;
    padding: 1.25rem 0;
    border-top: 1px solid var(--campaign-ink);
}

.campaign-menu__newsletter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    width: 100%;
    padding: 1.25rem 0;
    border: 0;
    border-top: 1px solid var(--campaign-ink);
    background: transparent;
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    cursor: pointer;
}

.campaign-menu__newsletter svg {
    width: 1.4rem;
    height: 1.4rem;
}

.campaign-menu__copyright {
    margin: 0;
    padding-top: 1.25rem;
    border-top: 1px solid var(--campaign-ink);
    font-size: 0.9rem;
    color: var(--artist-muted, #6b6b6b);
}

/* Carousel */
.campaign-stage {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    margin-top: 0.4rem;
}

.campaign-track {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-radius: var(--campaign-radius);
    overflow: hidden;
    -webkit-mask: radial-gradient(circle var(--campaign-notch) at 50% 0, transparent calc(100% - 1px), #000 100%);
    mask: radial-gradient(circle var(--campaign-notch) at 50% 0, transparent calc(100% - 1px), #000 100%);
}

.campaign-stage.is-enhanced .campaign-track {
    display: grid;
    gap: 0;
}

.campaign-slide {
    --slide-bg: var(--campaign-accent);
    --slide-fg: var(--campaign-highlight);
    --slide-btn-bg: var(--campaign-highlight);
    --slide-btn-fg: var(--campaign-accent);
    /* On wide screens the content keeps a readable width and stays centred instead of spreading to the edges */
    --campaign-pad-x: max(clamp(1.5rem, 6vw, 6rem), calc((100% - 84rem) / 2));
    --campaign-pad-x-start: max(clamp(1.5rem, 5vw, 5rem), calc((100% - 88rem) / 2));
    --campaign-pad-x-end: max(clamp(1.5rem, 3vw, 3rem), calc((100% - 88rem) / 2));
    position: relative;
    isolation: isolate;
    overflow: hidden;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(1.5rem, 4vw, 4rem);
    min-height: min(72svh, 46rem);
    padding: clamp(2.5rem, 6vw, 5.5rem) var(--campaign-pad-x);
    background-color: var(--slide-bg);
    background-image: var(--slide-bg-image, none);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: var(--slide-fg);
}

/* Without an uploaded image, the artist name is scribbled across the slide */
.campaign-slide--no-image::before {
    content: attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text);
    position: absolute;
    inset: -30%;
    z-index: -1;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(3rem, 9vw, 8rem);
    font-weight: 900;
    line-height: 0.95;
    letter-spacing: -0.02em;
    text-align: center;
    overflow-wrap: anywhere;
    opacity: 0.1;
    transform: rotate(-8deg);
    pointer-events: none;
}

.campaign-stage.is-enhanced .campaign-slide {
    grid-area: 1 / 1;
    opacity: 0;
    visibility: hidden;
}

.campaign-stage.is-enhanced .campaign-slide.is-active {
    z-index: 1;
    opacity: 1;
    visibility: visible;
    transition: opacity 1.2s linear;
}

.campaign-stage.is-enhanced .campaign-slide.is-leaving {
    z-index: 2;
    opacity: 1;
    visibility: visible;
}

.campaign-slide.is-leaving-next {
    animation: campaignSlideNext 1.2s linear forwards;
}

.campaign-slide.is-leaving-prev {
    animation: campaignSlidePrev 1.2s linear forwards;
}

@keyframes campaignSlideNext {
    0% { clip-path: circle(75% at 50% 50%); transform: translateX(0); }
    50% { clip-path: circle(0 at 50% 50%); transform: translateX(50%); }
    100% { clip-path: circle(0 at 50% 50%); transform: translateX(100%); }
}

@keyframes campaignSlidePrev {
    0% { clip-path: circle(75% at 50% 50%); transform: translateX(0); }
    50% { clip-path: circle(0 at 50% 50%); transform: translateX(-50%); }
    100% { clip-path: circle(0 at 50% 50%); transform: translateX(-100%); }
}

/* Staggered entrance of the slide contents and inner pages */
.campaign-js .campaign-in {
    opacity: 0;
    transform: translateY(60px);
}

.campaign-js.is-ready .campaign-slide.is-active .campaign-in,
.campaign-js.is-ready .campaign-page .campaign-in,
.campaign-js .campaign-slide.is-leaving .campaign-in {
    opacity: 1;
    transform: none;
    transition: opacity 0.7s ease calc(var(--step, 1) * 0.2s), transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) calc(var(--step, 1) * 0.2s);
}

.campaign-slide--tone-b {
    --slide-bg: var(--campaign-dark);
    --slide-fg: var(--campaign-highlight);
    --slide-btn-bg: var(--campaign-accent);
    --slide-btn-fg: #ffffff;
}

.campaign-slide--tone-c {
    --slide-bg: var(--campaign-highlight);
    --slide-fg: var(--campaign-dark);
    --slide-btn-bg: var(--campaign-dark);
    --slide-btn-fg: var(--campaign-highlight);
}

.campaign-slide--tone-d {
    --slide-bg: color-mix(in srgb, var(--campaign-accent) 55%, var(--campaign-dark));
    --slide-fg: #ffffff;
    --slide-btn-bg: var(--campaign-highlight);
    --slide-btn-fg: var(--campaign-dark);
}

.campaign-slide__copy {
    display: grid;
    justify-items: center;
    gap: 1rem;
    text-align: center;
}

.campaign-kicker {
    margin: 0;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.9;
}

.campaign-title {
    margin: 0;
    max-width: 14ch;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(2.2rem, 6vw, 4.6rem);
    font-weight: 900;
    line-height: 0.98;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.campaign-subtitle {
    margin: 0;
    max-width: 34ch;
    font-size: clamp(1rem, 2vw, 1.4rem);
    font-weight: 800;
    text-transform: uppercase;
}

.campaign-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.8rem;
    margin-top: 0.8rem;
}

.campaign-btn {
    display: inline-block;
    padding: 0.85rem 1.7rem;
    border: 2px solid var(--slide-btn-bg, var(--campaign-accent));
    background: var(--slide-btn-bg, var(--campaign-accent));
    color: var(--slide-btn-fg, #ffffff);
    font-family: var(--artist-font-buttons, inherit);
    font-size: 1.05rem;
    font-weight: 900;
    line-height: 1.1;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform 0.15s ease, filter 0.15s ease;
}

.campaign-btn:hover,
.campaign-btn:focus-visible {
    filter: brightness(1.06);
    transform: translateY(-2px);
}

.campaign-btn--ghost {
    background: transparent;
    color: var(--slide-fg, var(--campaign-ink));
    border-color: currentColor;
}

/* Photo slides: only the picture, covering the whole slide area, plus the button to see more photos */
.campaign-slide--photo {
    display: block;
    padding: 0;
}

.campaign-slide__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.campaign-slide__photo-btn {
    position: absolute;
    left: 50%;
    bottom: clamp(1.5rem, 5vw, 3rem);
    z-index: 1;
    transform: translateX(-50%);
    white-space: nowrap;
}

/* The base hover lift would replace the centring transform, so the button would jump sideways. */
.campaign-slide__photo-btn:hover,
.campaign-slide__photo-btn:focus-visible {
    transform: translate(-50%, -2px);
}

.campaign-slide__photo-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: clamp(5rem, 11vw, 7rem);
    z-index: 1;
    margin: 0;
    padding: 0 1.5rem;
    color: #ffffff;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.6rem, 4vw, 3rem);
    font-weight: 900;
    text-align: center;
    text-shadow: 0 0.15rem 1rem rgba(0, 0, 0, 0.7);
    text-transform: uppercase;
}

/* The big icon of the newsletter slide */
.campaign-slide-icon {
    display: grid;
    place-items: center;
    width: min(60%, 14rem, 36svh);
    aspect-ratio: 1 / 1;
    padding: 12%;
    border: 3px solid currentColor;
    border-radius: 50%;
}

.campaign-slide-icon svg {
    width: 100%;
    height: 100%;
}
.campaign-slide__art {
    display: grid;
    place-items: center;
    min-width: 0;
}

.campaign-slide__art img {
    display: block;
    max-width: 100%;
    max-height: min(56svh, 34rem);
    object-fit: contain;
    box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, 0.28);
}

.campaign-art-fallback,
.campaign-date-card {
    display: grid;
    place-content: center;
    gap: 0.4rem;
    width: min(100%, 22rem);
    aspect-ratio: 1 / 1;
    padding: 1.5rem;
    border: 3px solid currentColor;
    text-align: center;
    font-weight: 900;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.campaign-date-card__day {
    font-size: clamp(4rem, 10vw, 7rem);
    line-height: 1;
}

.campaign-date-card__month {
    font-size: 1.4rem;
}

/* ---------- Designed slides (release, event, membership): everything is drawn in CSS with the artist's colours and fonts ---------- */
.campaign-slide--designed {
    --deco-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    --deco-text: color-mix(in srgb, #000 13%, transparent);
    --deco-shape: linear-gradient(112deg, transparent 54%, rgba(0, 0, 0, 0.24) 54.2%, rgba(0, 0, 0, 0.08) 100%);
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    background-image:
        radial-gradient(ellipse 75% 95% at 22% 38%, color-mix(in srgb, var(--slide-bg) 80%, #fff) 0, transparent 72%),
        linear-gradient(135deg, transparent 50%, color-mix(in srgb, var(--slide-bg) 72%, #000) 100%);
}

.campaign-slide--designed.campaign-slide--no-image::before {
    inset: -35% -20%;
    font-size: clamp(4.5rem, 13vw, 12rem);
    line-height: 0.86;
    letter-spacing: -0.035em;
    color: var(--deco-text);
    opacity: 1;
    transform: rotate(-11deg);
}

.campaign-slide--designed::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: var(--deco-shape), var(--deco-noise);
    background-size: auto, 260px 260px;
    mix-blend-mode: multiply;
    opacity: 0.55;
}

.campaign-slide--designed .campaign-slide__copy {
    justify-items: start;
    gap: clamp(0.7rem, 1.6vw, 1.2rem);
    text-align: left;
}

.campaign-slide--designed .campaign-kicker {
    font-family: var(--artist-font-nav, var(--artist-font-body, inherit));
    font-size: clamp(0.85rem, 1.5vw, 1.2rem);
    font-weight: 400;
    letter-spacing: 0.34em;
    opacity: 1;
}

/* Every designed slide shares the same kicker rule and the same descriptive text */
.campaign-slide--designed:not(.campaign-slide--event) .campaign-kicker {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    width: 100%;
}

.campaign-slide--designed:not(.campaign-slide--event) .campaign-kicker::after {
    content: "";
    flex: 0 1 9rem;
    height: 2px;
    background: linear-gradient(90deg, currentColor, transparent);
}

.campaign-slide--designed .campaign-title {
    max-width: 11ch;
    font-size: clamp(2.6rem, 7.4vw, 6.4rem);
    line-height: 0.86;
}

.campaign-slide--designed .campaign-subtitle {
    max-width: 40ch;
    font-family: var(--artist-font-body, inherit);
    font-size: clamp(0.85rem, 1.25vw, 1.05rem);
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 1.35;
    text-transform: uppercase;
}

.campaign-slide--designed .campaign-actions {
    justify-content: flex-start;
    margin-top: 1rem;
}

.campaign-btn__icon {
    width: 1.1em;
    height: 1.1em;
    margin-left: 0.7em;
    vertical-align: -0.17em;
}

/* Release: the cover sits on a sheet of paper over the artist-name pattern */
.campaign-release-art {
    position: relative;
    width: min(100%, 28rem, 52svh);
    translate: -25% 0;
    aspect-ratio: 1 / 1;
    margin-inline: auto;
    filter: drop-shadow(0 0.8rem 1.2rem rgba(0, 0, 0, 0.3));
}

.campaign-release-art__paper {
    position: absolute;
    inset: -12% -26% -8% -10%;
    background: linear-gradient(160deg, color-mix(in srgb, var(--slide-fg) 92%, #fff), color-mix(in srgb, var(--slide-fg) 74%, #000));
    clip-path: polygon(12% 8%, 100% 0, 100% 100%, 0 93%);
    rotate: 2deg;
}

/* The record (a bit smaller than its sleeve) slides out until its centre, where the artist's logo sits, reaches the edge of the sleeve */
.campaign-release-art__vinyl {
    position: absolute;
    top: 2%;
    left: 2%;
    width: 96%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background:
        conic-gradient(from 25deg, transparent 0 8%, rgba(255, 255, 255, 0.2) 13%, transparent 21%, transparent 50%, rgba(255, 255, 255, 0.16) 58%, transparent 66%),
        repeating-radial-gradient(circle closest-side, #171717 0 0.5%, #0a0a0a 0.5% 1%);
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.4), inset 0 0 0 0.3rem rgba(255, 255, 255, 0.06);
    translate: 52.0833% 0;
    animation: campaignVinylSpin 16s linear infinite;
}

/* Without a logo the record keeps a plain label */
.campaign-release-art__vinyl--blank {
    background:
        radial-gradient(circle closest-side, var(--feed-vinyl-hole, #f4eed8) 0 3.2%, transparent 3.6%),
        radial-gradient(circle closest-side, var(--campaign-accent) 0 28%, transparent 28.4%),
        conic-gradient(from 25deg, transparent 0 8%, rgba(255, 255, 255, 0.2) 13%, transparent 21%, transparent 50%, rgba(255, 255, 255, 0.16) 58%, transparent 66%),
        repeating-radial-gradient(circle closest-side, #171717 0 0.5%, #0a0a0a 0.5% 1%);
}

.campaign-release-art__vinyl img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 36%;
    height: 36%;
    max-width: none;
    max-height: none;
    translate: -50% -50%;
    border-radius: 50%;
    object-fit: contain;
    box-shadow: none;
}

.campaign-js .campaign-slide--release .campaign-release-art__vinyl {
    translate: 0 0;
}

.campaign-js.is-ready .campaign-slide--release.is-active .campaign-release-art__vinyl {
    translate: 52.0833% 0;
    transition: translate 1.8s cubic-bezier(0.2, 0.7, 0.2, 1) 1.2s;
}
@keyframes campaignVinylSpin {
    to { rotate: 360deg; }
}

@media (prefers-reduced-motion: reduce) {
    .campaign-release-art__vinyl {
        animation: none;
    }
}
.campaign-slide--designed .campaign-release-art__cover,
.campaign-slide--release .campaign-release-art .campaign-art-fallback {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.45);
}

.campaign-slide--release .campaign-release-art .campaign-art-fallback {
    place-content: center;
    background: var(--slide-bg);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.4rem, 3.4vw, 2.6rem);
    border: 0;
}

/* Event: dark stage, torn red label and a taped polaroid */
.campaign-slide--event {
    --deco-text: color-mix(in srgb, var(--slide-fg) 7%, transparent);
    --deco-shape: radial-gradient(ellipse 80% 90% at 70% 45%, transparent 45%, rgba(0, 0, 0, 0.5) 100%);
}

.campaign-slide--event .campaign-slide__copy {
    padding-block: 1rem;
}

.campaign-slide--event .campaign-kicker {
    justify-self: start;
    padding: 0.7em 2.2em;
    background: var(--campaign-accent);
    color: var(--slide-btn-fg, var(--slide-fg));
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-weight: 800;
    letter-spacing: 0.22em;
    rotate: -4deg;
    transform-origin: left center;
    clip-path: polygon(0 22%, 3% 0, 14% 9%, 27% 0, 42% 7%, 57% 0, 72% 8%, 86% 0, 100% 12%, 97% 46%, 100% 72%, 95% 100%, 80% 92%, 63% 100%, 46% 93%, 29% 100%, 13% 94%, 2% 100%, 4% 60%);
}

.campaign-slide--event .campaign-title {
    max-width: 12ch;
    font-size: clamp(2.4rem, 6.4vw, 5.4rem);
    rotate: -3deg;
    transform-origin: left bottom;
}

.campaign-slide--event .campaign-subtitle {
    rotate: -3deg;
    transform-origin: left top;
}

.campaign-slide--event .campaign-subtitle::before {
    content: "";
    display: block;
    width: min(70%, 18rem);
    height: 0.35rem;
    margin-bottom: 0.9rem;
    background: var(--campaign-accent);
    clip-path: polygon(0 40%, 100% 0, 96% 100%, 2% 80%);
}

.campaign-polaroid {
    position: relative;
    width: min(100%, 34rem);
    margin-inline: auto;
    padding: 1rem;
}

.campaign-polaroid__splash {
    position: absolute;
    inset: 3% -5% -7% -3%;
    background: var(--campaign-accent);
    clip-path: polygon(0 18%, 4% 4%, 14% 10%, 30% 0, 48% 6%, 66% 0, 84% 8%, 100% 2%, 96% 30%, 100% 52%, 95% 74%, 100% 100%, 78% 94%, 58% 100%, 38% 95%, 18% 100%, 6% 92%, 3% 66%, 6% 42%);
    rotate: -5deg;
}

.campaign-polaroid__frame {
    position: relative;
    margin: 0;
    padding: 0.7rem;
    background: color-mix(in srgb, var(--slide-fg) 88%, #fff);
    box-shadow: 0 1.4rem 2.6rem rgba(0, 0, 0, 0.55);
    rotate: 3deg;
}

.campaign-polaroid__frame::before {
    content: "";
    position: absolute;
    top: -0.9rem;
    left: -1.8rem;
    z-index: 1;
    width: 6rem;
    height: 1.9rem;
    background: color-mix(in srgb, var(--slide-fg) 60%, transparent);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    rotate: -38deg;
}

.campaign-slide--designed .campaign-polaroid__frame img {
    display: block;
    width: 100%;
    max-height: min(52svh, 30rem);
    aspect-ratio: 4 / 3.2;
    object-fit: cover;
    box-shadow: none;
}

.campaign-polaroid__frame .campaign-date-card {
    width: 100%;
    aspect-ratio: 4 / 3.2;
    border: 0;
    background: var(--slide-bg);
    color: var(--slide-fg);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
}

.campaign-polaroid__dots {
    position: absolute;
    right: -6%;
    bottom: -5%;
    width: 38%;
    height: 38%;
    background-image: radial-gradient(circle, var(--slide-fg) 1.4px, transparent 1.9px);
    background-size: 9px 9px;
    -webkit-mask: linear-gradient(135deg, transparent 25%, #000);
    mask: linear-gradient(135deg, transparent 25%, #000);
    opacity: 0.8;
}

.campaign-polaroid__bolt {
    position: absolute;
    top: 8%;
    right: -3%;
    z-index: 1;
    width: 3.2rem;
    height: 6.4rem;
    background: var(--slide-fg);
    clip-path: polygon(55% 0, 10% 55%, 45% 55%, 30% 100%, 90% 40%, 55% 40%);
    rotate: 14deg;
}

/* Membership: a plan card on top of two translucent ones */
.campaign-slide--membership {
    --deco-text: color-mix(in srgb, #000 12%, transparent);
}

.campaign-slide--membership .campaign-title {
    max-width: 20ch;
    font-size: clamp(2rem, 4.8vw, 4.2rem);
    line-height: 0.9;
    text-wrap: balance;
}

.campaign-title__lead {
    display: block;
    color: var(--slide-btn-bg);
}

.campaign-tier-stack {
    position: relative;
    display: grid;
    place-items: center;
    width: min(100%, 30rem, 58svh);
    aspect-ratio: 1 / 1.05;
    margin-inline: auto;
}

.campaign-tier-stack__back {
    position: absolute;
    width: 56%;
    aspect-ratio: 3 / 4;
    border: 2px solid color-mix(in srgb, var(--slide-fg) 28%, transparent);
    border-radius: 1.2rem;
    background: color-mix(in srgb, var(--slide-fg) 10%, transparent);
}

.campaign-tier-stack__back::before {
    content: "";
    position: absolute;
    top: 22%;
    width: 24%;
    height: 16%;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--slide-fg) 55%, transparent) 2px, transparent 2.6px);
    background-size: 0.9rem 0.9rem;
}

.campaign-tier-stack__back--left {
    top: 12%;
    left: -2%;
    rotate: -5deg;
}

.campaign-tier-stack__back--left::before {
    left: 12%;
}

.campaign-tier-stack__back--right {
    top: 18%;
    right: -6%;
    rotate: 7deg;
}

.campaign-tier-stack__back--right::before {
    right: 12%;
    top: 55%;
}

.campaign-tier-stack__spark {
    position: absolute;
    top: -2%;
    right: 8%;
    z-index: 2;
    width: 14%;
    color: var(--slide-fg);
}

.campaign-tier-plan {
    position: relative;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.7rem;
    width: 78%;
    padding: 1.4rem 1rem 1.3rem;
    border: 0.26rem solid color-mix(in srgb, var(--slide-fg) 92%, #fff);
    border-radius: 0.5rem;
    background:
        var(--deco-noise),
        linear-gradient(160deg, color-mix(in srgb, var(--slide-bg) 88%, #fff), color-mix(in srgb, var(--slide-bg) 80%, #000));
    background-size: 260px 260px, auto;
    box-shadow: 0 1.4rem 2.6rem rgba(0, 0, 0, 0.4);
    color: var(--slide-fg);
    text-align: center;
    rotate: 4deg;
}

.campaign-tier-plan::before {
    content: "";
    position: absolute;
    inset: 0.7rem;
    border: 2px solid color-mix(in srgb, var(--slide-fg) 45%, transparent);
    border-radius: 0.9rem;
    pointer-events: none;
}

.campaign-tier-plan__name {
    position: relative;
    font-family: var(--artist-font-nav, var(--artist-font-body, inherit));
    font-size: clamp(0.9rem, 1.7vw, 1.3rem);
    letter-spacing: 0.3em;
    text-transform: uppercase;
}

.campaign-tier-plan__name::after {
    content: "";
    display: block;
    width: 3rem;
    height: 3px;
    margin: 0.6rem auto 0;
    background: currentColor;
}

.campaign-tier-plan__price {
    position: relative;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.9rem, 3.8vw, 2.9rem);
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.campaign-tier-plan__price small {
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: 0.4em;
    font-weight: 400;
}

.campaign-tier-plan__perks {
    position: relative;
    display: grid;
    gap: 0.4rem;
    width: 100%;
    margin: 0.3rem 0 0;
    padding: 0;
    list-style: none;
}

.campaign-tier-plan__perk {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.3rem 0.7rem 0.3rem 0.3rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--slide-fg) 14%, transparent);
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: clamp(0.75rem, 1.25vw, 0.95rem);
    font-weight: 600;
    text-align: left;
}

.campaign-tier-plan__perk > span:last-of-type {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.1;
}

.campaign-tier-plan__icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    background: var(--slide-fg);
    color: var(--slide-bg);
}

.campaign-tier-plan__icon svg {
    width: 62%;
    height: 62%;
}

.campaign-tier-plan__chevron {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
}

/* Upcoming concerts: a stack of ticket-like cards, one per date */
.campaign-slide--events {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.15fr);
}

.campaign-slide--events .campaign-kicker {
    font-weight: 700;
}

.campaign-slide--events .campaign-title {
    max-width: none;
    font-size: clamp(2.2rem, 4.8vw, 5.4rem);
    line-height: 0.88;
    overflow-wrap: normal;
    text-wrap: balance;
}

.campaign-gigs {
    position: relative;
    display: grid;
    gap: 0.9rem;
    width: min(100%, 40rem);
    margin: 0 auto;
    padding: 1.4rem 0;
    list-style: none;
    rotate: -3deg;
}

.campaign-gigs::before {
    content: "";
    position: absolute;
    top: 38%;
    right: -6%;
    width: 13%;
    height: 44%;
    background: var(--slide-fg);
    opacity: 0.85;
    clip-path: polygon(30% 0, 0 8%, 24% 26%, 2% 40%, 36% 54%, 8% 72%, 50% 84%, 30% 100%, 80% 88%, 100% 62%, 72% 46%, 94% 24%, 62% 10%);
    rotate: 14deg;
}

.campaign-gig {
    --gig-card: var(--campaign-dark);
    --gig-text: var(--slide-fg);
    position: relative;
    filter: drop-shadow(0 0.7rem 1rem rgba(0, 0, 0, 0.35));
}

.campaign-gig--next {
    --gig-card: color-mix(in srgb, var(--slide-fg) 92%, #fff);
    --gig-text: var(--campaign-ink);
}

.campaign-gig__link {
    position: relative;
    display: grid;
    grid-template-columns: clamp(4.6rem, 8vw, 6.2rem) minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    min-height: clamp(7rem, 15svh, 9.2rem);
    padding: 0.7rem 34% 0.7rem 0.7rem;
    overflow: hidden;
    background: var(--gig-card);
    color: var(--gig-text);
    text-decoration: none;
    clip-path: polygon(0 7%, 1.5% 0, 14% 4%, 30% 0, 48% 3%, 66% 0, 84% 4%, 100% 0, 99% 30%, 100% 55%, 98.5% 80%, 100% 100%, 82% 96%, 62% 100%, 42% 96%, 22% 100%, 7% 96%, 0 100%, 1% 70%, 0 40%);
}

.campaign-gig__link:hover,
.campaign-gig__link:focus-visible {
    filter: brightness(1.07);
}

.campaign-gig__date {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: center;
    justify-items: center;
    align-self: stretch;
    padding: 0.4rem;
    background: var(--campaign-accent);
    color: var(--slide-fg);
    text-align: center;
    text-transform: uppercase;
    clip-path: polygon(0 4%, 6% 0, 100% 2%, 98% 50%, 100% 98%, 4% 100%, 0 60%);
    rotate: -2deg;
}

.campaign-gig__date b {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.9rem, 3.6vw, 2.8rem);
    font-weight: 900;
    line-height: 0.9;
}

.campaign-gig__date span {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.1rem, 2vw, 1.6rem);
    font-weight: 900;
    line-height: 1;
}

.campaign-gig__date small {
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: clamp(0.75rem, 1.2vw, 0.95rem);
    font-weight: 700;
}

.campaign-gig__info {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.campaign-gig__info strong {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.3rem, 2.6vw, 2.2rem);
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.campaign-gig__line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: clamp(0.8rem, 1.4vw, 1.1rem);
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
}

.campaign-gig__line svg {
    flex: 0 0 auto;
    width: 1.2em;
    height: 1.2em;
    color: var(--campaign-accent);
}

.campaign-gig__photo {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40%;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--campaign-accent) 55%, transparent) 1.6px, transparent 2.1px);
    background-size: 0.8rem 0.8rem;
    -webkit-mask: linear-gradient(90deg, transparent, #000 45%);
    mask: linear-gradient(90deg, transparent, #000 45%);
}

.campaign-slide--designed .campaign-gig__photo img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    box-shadow: none;
}

.campaign-gig:not(.campaign-gig--next) .campaign-gig__photo img {
    filter: grayscale(1) contrast(1.1);
}

.campaign-gig__flag {
    position: absolute;
    bottom: 0.7rem;
    right: 1.1rem;
    z-index: 2;
    padding: 0.12rem 0.65rem;
    background: var(--campaign-accent);
    color: var(--slide-fg);
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: clamp(0.6rem, 0.9vw, 0.72rem);
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    clip-path: polygon(0 20%, 4% 0, 30% 8%, 60% 0, 100% 6%, 97% 50%, 100% 92%, 66% 100%, 34% 92%, 5% 100%, 2% 60%);
    rotate: -4deg;
}

.campaign-gig__crown {
    position: absolute;
    top: -1.5rem;
    left: 0.4rem;
    z-index: 3;
    width: 3rem;
    color: var(--slide-fg);
    rotate: -8deg;
}

/* About: the band photo on a big tilted card with cream brush strokes and a flash of light */
.campaign-slide--about .campaign-title {
    max-width: 16ch;
    font-size: clamp(2.2rem, 4.8vw, 5rem);
}

.campaign-slide--about .campaign-kicker {
    font-weight: 700;
}

.campaign-portrait {
    position: relative;
    width: min(100%, 52rem, 94svh);
    aspect-ratio: 1.36 / 1;
    margin-inline: auto;
    rotate: -5deg;
}

.campaign-slide--designed .campaign-portrait__photo {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    border: 2px solid var(--slide-fg);
    border-radius: 1.8rem;
    object-fit: cover;
    object-position: 50% 22%;
    box-shadow: 0 1.6rem 3rem rgba(0, 0, 0, 0.5);
}

.campaign-slide--about .campaign-portrait .campaign-art-fallback {
    place-content: center;
    background: var(--slide-bg);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.4rem, 3.4vw, 2.6rem);
}

.campaign-portrait__stroke {
    position: absolute;
    width: 9%;
    height: 32%;
    background: var(--slide-fg);
    opacity: 0.9;
}

.campaign-portrait__stroke--left {
    top: 36%;
    left: -6.5%;
    clip-path: polygon(70% 0, 100% 6%, 78% 24%, 100% 38%, 66% 52%, 94% 70%, 52% 82%, 70% 100%, 20% 88%, 0 64%, 30% 46%, 8% 24%, 40% 10%);
}

.campaign-portrait__stroke--right {
    top: 24%;
    right: -6%;
    clip-path: polygon(30% 0, 0 8%, 24% 26%, 2% 40%, 36% 54%, 8% 72%, 50% 84%, 30% 100%, 80% 88%, 100% 62%, 72% 46%, 94% 24%, 62% 10%);
}

.campaign-portrait__spark {
    position: absolute;
    top: 5%;
    right: 5%;
    z-index: 2;
    width: 13%;
    color: var(--slide-fg);
    rotate: 8deg;
    filter: drop-shadow(0 0 0.3rem rgba(0, 0, 0, 0.45)) drop-shadow(0 0 0.5rem color-mix(in srgb, var(--slide-fg) 55%, transparent));
}

@media (min-width: 768px) {
    .campaign-slide--about,
    .campaign-slide--follow {
        grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
        padding-block: clamp(1.5rem, 3vw, 2.5rem);
        padding-inline: var(--campaign-pad-x-start) var(--campaign-pad-x-end);
    }
}

@media (max-width: 767.98px) {
    .campaign-slide--designed {
        grid-template-columns: 1fr;
    }

    .campaign-slide--designed .campaign-title {
        font-size: clamp(2.2rem, 11vw, 3.6rem);
    }

    .campaign-release-art {
        width: min(66%, 17rem, 34svh);
    }

    .campaign-polaroid {
        width: min(100%, 20rem);
    }

    .campaign-slide--designed .campaign-polaroid__frame img {
        max-height: 30svh;
    }

    .campaign-tier-stack {
        width: min(80%, 15rem, 34svh);
    }

    .campaign-portrait {
        width: min(92%, 24rem, 46svh);
    }

    .campaign-gigs {
        width: 100%;
        gap: 0.6rem;
        rotate: 0deg;
    }

    .campaign-gig__link {
        grid-template-columns: 4.4rem minmax(0, 1fr);
        gap: 0.7rem;
        min-height: 5.6rem;
        padding-right: 30%;
    }
}

/* Follow: a phone feed surrounded by the artist's own photos, network pills and paper scraps drawn in CSS */
.campaign-slide--follow .campaign-title {
    max-width: 12ch;
    font-size: clamp(2.2rem, 4.8vw, 5rem);
}

.campaign-slide--follow .campaign-kicker {
    font-weight: 400;
}

.campaign-feed {
    --feed-paper: color-mix(in srgb, var(--slide-fg) 94%, #fff);
    --feed-ink: var(--campaign-dark);
    --feed-fill: radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--slide-bg) 55%, #fff) 0, color-mix(in srgb, var(--slide-bg) 75%, #000) 100%);
    position: relative;
    container-type: inline-size;
    width: min(100%, 46rem, 112svh);
    aspect-ratio: 1.28 / 1;
    margin-inline: auto;
}

.campaign-feed > * {
    position: absolute;
    margin: 0;
}

.campaign-feed img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    box-shadow: none;
}

.campaign-feed__splash {
    z-index: 0;
    top: -3%;
    left: 50%;
    width: 30%;
    height: 17%;
    background: color-mix(in srgb, var(--slide-bg) 55%, #000);
    clip-path: polygon(4% 60%, 14% 20%, 30% 34%, 44% 4%, 58% 28%, 74% 8%, 90% 36%, 100% 70%, 78% 96%, 58% 80%, 40% 100%, 20% 84%);
    opacity: 0.7;
    rotate: -8deg;
}

.campaign-feed__spark {
    z-index: 7;
    top: 0;
    left: 72%;
    width: 9.5%;
    color: var(--slide-fg);
    rotate: 8deg;
    filter: drop-shadow(0 0 0.5cqw color-mix(in srgb, var(--slide-fg) 55%, transparent));
}

.campaign-feed__hatch {
    z-index: 4;
    width: 3.6%;
    color: var(--slide-fg);
    opacity: 0.85;
}

.campaign-feed__hatch--left {
    top: 28%;
    left: -1%;
}

.campaign-feed__hatch--right {
    top: 61%;
    left: 97%;
}

.campaign-feed__crowd {
    z-index: 0;
    top: 66%;
    left: 40%;
    width: 60%;
    height: 34%;
    background: var(--feed-fill);
    -webkit-mask: radial-gradient(ellipse closest-side at 50% 55%, #000 45%, transparent 100%);
    mask: radial-gradient(ellipse closest-side at 50% 55%, #000 45%, transparent 100%);
    overflow: hidden;
}

.campaign-feed__photo {
    padding: 0.9cqw;
    background: var(--feed-fill), var(--feed-paper);
    background-origin: content-box, border-box;
    background-clip: content-box, border-box;
    border-radius: 0.9cqw;
    box-shadow: 0 1.2cqw 2.4cqw rgba(0, 0, 0, 0.4);
}

.campaign-feed__photo img {
    border-radius: 0.5cqw;
}

.campaign-feed__photo--polaroid {
    z-index: 2;
    top: 8%;
    left: 3%;
    width: 25.5%;
    aspect-ratio: 0.93;
    padding-bottom: 1.4cqw;
    rotate: -3deg;
}

.campaign-feed__photo--bw {
    z-index: 1;
    top: 12%;
    left: 64%;
    width: 21.5%;
    aspect-ratio: 0.85;
    rotate: 6deg;
}

.campaign-feed__photo--bw img {
    filter: grayscale(1) contrast(1.15);
}

.campaign-feed__tape {
    top: -3.4cqw;
    left: 50%;
    width: 14cqw;
    height: 4.6cqw;
    background: color-mix(in srgb, var(--slide-fg) 45%, transparent);
    clip-path: polygon(0 12%, 6% 0, 12% 14%, 100% 0, 96% 50%, 100% 100%, 90% 86%, 6% 100%, 2% 52%);
    translate: -50% 0;
    rotate: -6deg;
    position: absolute;
    z-index: 2;
}

.campaign-feed__post {
    z-index: 3;
    top: 36%;
    left: 59%;
    display: grid;
    grid-template-rows: auto 1fr auto auto;
    gap: 1.2cqw;
    width: 37%;
    aspect-ratio: 1.12;
    padding: 2cqw;
    background: var(--feed-paper);
    border-radius: 2.2cqw;
    box-shadow: 0 1.4cqw 2.6cqw rgba(0, 0, 0, 0.35);
    rotate: 4deg;
}

.campaign-feed__dots {
    display: flex;
    justify-content: flex-end;
    gap: 0.6cqw;
}

.campaign-feed__dots i {
    width: 0.8cqw;
    height: 0.8cqw;
    border-radius: 50%;
    background: color-mix(in srgb, var(--feed-ink) 55%, transparent);
}

.campaign-feed__post-photo {
    min-height: 0;
    overflow: hidden;
    background: var(--feed-fill);
    border-radius: 1.4cqw;
}

.campaign-feed__lines {
    display: grid;
    gap: 0.7cqw;
}

.campaign-feed__lines i {
    height: 0.9cqw;
    border-radius: 99px;
    background: color-mix(in srgb, var(--feed-ink) 18%, transparent);
}

.campaign-feed__lines i:last-child {
    width: 62%;
}

.campaign-feed__post-icons {
    display: flex;
    gap: 1cqw;
}

.campaign-feed__post-icons i {
    width: 1.6cqw;
    height: 1.6cqw;
    border-radius: 50%;
    background: color-mix(in srgb, var(--feed-ink) 30%, transparent);
}

.campaign-feed__like {
    z-index: 6;
    top: 26%;
    left: 80%;
    display: flex;
    align-items: center;
    gap: 0.8cqw;
    padding: 1cqw 1.8cqw;
    border-radius: 1.8cqw 1.8cqw 1.8cqw 0.3cqw;
    background: var(--campaign-accent);
    color: #ffffff;
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.6rem, 2.2cqw);
    font-weight: 800;
    box-shadow: 0 0.8cqw 1.6cqw rgba(0, 0, 0, 0.3);
    rotate: 4deg;
}

.campaign-feed__like svg {
    width: 2.8cqw;
    height: 2.8cqw;
}

.campaign-feed__phone {
    z-index: 5;
    top: 3%;
    left: 26%;
    width: 35.5%;
    height: 94%;
    padding: 1.1cqw;
    border-radius: 5cqw;
    background: linear-gradient(145deg, #3a3a3a, #0d0d0d 40%, #1c1c1c);
    box-shadow: 0 2cqw 4cqw rgba(0, 0, 0, 0.5), inset 0 0 0 0.25cqw rgba(255, 255, 255, 0.18);
    rotate: 7deg;
}

.campaign-feed__screen {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 4cqw;
    background: var(--feed-fill);
}

.campaign-feed__screen img {
    position: absolute;
    inset: 0;
}

.campaign-feed__bar,
.campaign-feed__actions {
    position: absolute;
    right: 0;
    left: 0;
    display: flex;
    align-items: center;
    gap: 1.2cqw;
    color: #ffffff;
}

.campaign-feed__bar {
    top: 0;
    padding: 2.6cqw 2.6cqw 5cqw;
    background: linear-gradient(rgba(0, 0, 0, 0.55), transparent);
}

.campaign-feed__bar svg {
    width: 2.6cqw;
    height: 2.6cqw;
    margin-left: auto;
}

.campaign-feed__avatar {
    width: 3.2cqw;
    height: 3.2cqw;
    border-radius: 50%;
    background: var(--feed-paper);
}

.campaign-feed__bar-lines {
    display: grid;
    gap: 0.5cqw;
}

.campaign-feed__bar-lines i {
    width: 9cqw;
    height: 0.7cqw;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.85);
}

.campaign-feed__bar-lines i:last-child {
    width: 5.5cqw;
}

.campaign-feed__actions {
    bottom: 0;
    padding: 6cqw 2.6cqw 2.6cqw;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.75));
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.5rem, 1.7cqw);
    font-weight: 700;
}

.campaign-feed__actions svg {
    width: 2.8cqw;
    height: 2.8cqw;
}

.campaign-feed__save {
    margin-left: auto;
}

.campaign-feed__pills {
    z-index: 6;
    top: 40%;
    left: 3%;
    display: grid;
    gap: 1.3cqw;
    width: 25%;
    padding: 0;
    list-style: none;
}

.campaign-feed__pills li {
    translate: calc(var(--i, 0) * 1.1cqw) 0;
    rotate: -4deg;
}

.campaign-feed__pill {
    display: flex;
    align-items: center;
    gap: 1.2cqw;
    padding: 0.9cqw 2.2cqw 0.9cqw 1.4cqw;
    border-radius: 99px;
    background: var(--feed-paper);
    color: var(--feed-ink);
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.7rem, 2.2cqw);
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: 0 0.7cqw 1.4cqw rgba(0, 0, 0, 0.3);
}

.campaign-feed__pill:hover,
.campaign-feed__pill:focus-visible {
    filter: brightness(1.06);
}

.campaign-feed__pill-icon {
    display: grid;
    flex: 0 0 auto;
    width: 3.4cqw;
    height: 3.4cqw;
}

.campaign-feed__pill-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.campaign-feed__note {
    z-index: 6;
    top: 73%;
    left: 80%;
    display: grid;
    align-content: center;
    gap: 0.2cqw;
    width: 19%;
    aspect-ratio: 1.02;
    padding: 1.6cqw 1.4cqw;
    background: var(--feed-paper);
    color: var(--feed-ink);
    clip-path: polygon(2% 6%, 18% 0, 40% 5%, 62% 0, 84% 4%, 100% 0, 98% 30%, 100% 56%, 97% 82%, 100% 100%, 76% 96%, 52% 100%, 28% 95%, 8% 100%, 0 74%, 3% 46%, 0 22%);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: max(0.6rem, 2.2cqw);
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
    rotate: -5deg;
}

.campaign-feed__note svg {
    width: 1.8cqw;
    height: 1.8cqw;
    vertical-align: -0.2cqw;
}

.campaign-dialog--follow {
    width: min(92vw, 36rem);
    max-height: 92svh;
    overflow: auto;
}

.campaign-follow-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
    gap: 0.6rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.campaign-follow-link {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.55rem 1rem;
    border: 2px solid var(--campaign-ink);
    border-radius: 99px;
    color: var(--campaign-ink);
    font-weight: 800;
    text-decoration: none;
}

.campaign-follow-link:hover,
.campaign-follow-link:focus-visible {
    background: var(--campaign-ink);
    color: var(--campaign-bg);
}

.campaign-follow-link__icon {
    display: grid;
    flex: 0 0 auto;
    width: 1.5rem;
    height: 1.5rem;
}

.campaign-follow-link__icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

@media (max-width: 767.98px) {
    .campaign-feed {
        width: min(100%, 26rem);
    }
}
/* Discounts: torn coupons with the percentage, what is discounted, the code to copy and its status */
.campaign-highlight {
    position: relative;
    display: inline-block;
    justify-self: start;
    margin: 0;
    rotate: -2deg;
}

.campaign-highlight span {
    display: inline-block;
    padding: 0.3em 1.5em 0.4em 0.9em;
    background: var(--campaign-accent);
    color: var(--slide-bg);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.3rem, 2.6vw, 2.4rem);
    font-style: italic;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
    clip-path: polygon(0 18%, 3% 0, 12% 10%, 26% 0, 44% 8%, 62% 0, 80% 9%, 97% 0, 100% 40%, 98% 70%, 100% 100%, 82% 92%, 60% 100%, 38% 93%, 16% 100%, 2% 92%, 4% 56%);
}

.campaign-highlight svg {
    position: absolute;
    top: -0.35em;
    right: -2.3em;
    width: 2em;
    color: var(--campaign-accent);
    font-size: clamp(1.3rem, 2.6vw, 2.4rem);
    rotate: 8deg;
}

.campaign-tickets {
    --ticket-paper: color-mix(in srgb, var(--slide-bg) 35%, #fcf6e4);
    --ticket-stain: rgba(120, 82, 36, 0.24);
    --ticket-ink: var(--slide-fg);
    container-type: inline-size;
    position: relative;
    display: grid;
    width: min(100%, 40rem, 100svh);
    margin-inline: auto;
}

.campaign-tickets__bolt,
.campaign-tickets__star {
    position: absolute;
    z-index: 3;
    color: var(--campaign-accent);
}

.campaign-tickets__bolt {
    top: -1%;
    left: 6%;
    width: 5cqw;
    rotate: 14deg;
}

.campaign-tickets__star {
    right: 0;
    bottom: 0;
    width: 8cqw;
    rotate: 12deg;
}

.campaign-ticket {
    position: relative;
    display: grid;
    grid-template-columns: 0.85fr 1.3fr;
    width: 88%;
    aspect-ratio: 2.3 / 1;
    margin-top: calc(var(--i) * -1.5cqw);
    margin-left: calc(var(--i) * 6%);
    rotate: -5deg;
    filter: drop-shadow(0 1.4cqw 2cqw rgba(0, 0, 0, 0.35));
}

/* Odd coupons lean to the left, even ones to the right */
.campaign-ticket:nth-of-type(even) {
    rotate: 5deg;
}
.campaign-ticket__stub {
    position: relative;
    overflow: hidden;
    background: var(--ticket-paper);
    color: var(--ticket-ink);
    clip-path: polygon(1.5% 4%, 0 14%, 2% 25%, 0 36%, 1.5% 48%, 0 60%, 2% 72%, 0 84%, 1.5% 94%, 3% 100%, 100% 100%, 100% 0, 3% 0);
}

.campaign-ticket__photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 62%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    box-shadow: none;
    filter: grayscale(1) contrast(1.25);
    mix-blend-mode: multiply;
    -webkit-mask: linear-gradient(90deg, #000 50%, transparent);
    mask: linear-gradient(90deg, #000 50%, transparent);
}

.campaign-ticket__grain {
    position: absolute;
    inset: 0 42% 0 0;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--ticket-ink) 60%, transparent) 0.2cqw, transparent 0.26cqw);
    background-size: 1.2cqw 1.2cqw;
    -webkit-mask: linear-gradient(90deg, #000 20%, transparent);
    mask: linear-gradient(90deg, #000 20%, transparent);
}

.campaign-ticket__off,
.campaign-tickets .campaign-ticket__off-label {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0;
    text-align: center;
}

.campaign-ticket__off {
    top: 50%;
    translate: 0 -62%;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-weight: 900;
    line-height: 0.85;
}

.campaign-ticket__off b {
    font-size: 15cqw;
    font-weight: 900;
}

.campaign-ticket__off i {
    font-size: 9cqw;
    font-style: normal;
    vertical-align: top;
}

.campaign-tickets .campaign-ticket__off-label {
    top: 50%;
    translate: 0 calc(5.5cqw);
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.55rem, 2.3cqw);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.campaign-ticket__off-label span {
    display: inline-block;
}

.campaign-ticket__off-label::after {
    content: "";
    display: block;
    width: 70%;
    height: 0.8cqw;
    margin: 0.5cqw auto 0;
    background: var(--campaign-accent);
    clip-path: polygon(0 50%, 25% 0, 70% 30%, 100% 0, 96% 80%, 60% 100%, 28% 70%, 2% 100%);
    rotate: -2deg;
}
.campaign-ticket__body {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 1fr auto auto;
    align-content: stretch;
    gap: 0;
    padding: 2cqw 3cqw 2cqw 4cqw;
    background: var(--ticket-ink);
    color: var(--slide-bg);
    clip-path: polygon(0 0, 100% 0, 98% 9%, 100% 20%, 98.5% 32%, 100% 44%, 98% 56%, 100% 68%, 98.5% 80%, 100% 92%, 99% 100%, 0 100%);
}

.campaign-ticket__info {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    align-self: center;
    gap: 1.8cqw;
}

.campaign-ticket__text {
    display: grid;
    gap: 0.5cqw;
    min-width: 0;
}

.campaign-ticket__icon {
    display: grid;
    width: 5.6cqw;
    height: 5.6cqw;
    color: var(--campaign-accent);
}

.campaign-ticket__icon svg {
    width: 100%;
    height: 100%;
}

.campaign-ticket__kind {
    margin: 0;
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.62rem, 2.7cqw);
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.campaign-tickets .campaign-ticket__target {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    font-family: var(--artist-font-body, inherit);
    font-size: max(0.8rem, 4.1cqw);
    font-weight: 700;
    line-height: 1.12;
    opacity: 0.95;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.campaign-ticket__code {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    gap: 1.4cqw;
    margin-top: 0;
    padding: 0.6cqw 1.2cqw;
    border: 0.25cqw solid color-mix(in srgb, var(--slide-bg) 30%, transparent);
    border-radius: 1.6cqw;
}

.campaign-ticket__code small {
    font-family: var(--artist-font-headings, var(--artist-font-body, inherit));
    font-size: max(0.45rem, 1.5cqw);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.8;
}

.campaign-ticket__code strong {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    color: var(--campaign-accent);
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: max(0.9rem, 5.2cqw);
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.campaign-ticket__copy {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 4.2cqw;
    height: 4.2cqw;
    padding: 0;
    border: 0.25cqw solid color-mix(in srgb, var(--slide-bg) 35%, transparent);
    border-radius: 1cqw;
    background: transparent;
    color: var(--slide-bg);
    cursor: pointer;
}

.campaign-ticket__copy svg {
    width: 60%;
    height: 60%;
}

.campaign-ticket__copy:hover,
.campaign-ticket__copy:focus-visible,
.campaign-ticket__copy.is-copied {
    background: var(--campaign-accent);
    border-color: var(--campaign-accent);
}

.campaign-tickets .campaign-ticket__status {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    gap: 1cqw;
    margin: 1.4cqw 0 0;
    font-family: var(--artist-font-body, inherit);
    font-size: max(0.6rem, 2.3cqw);
    font-variant-numeric: tabular-nums;
}

.campaign-ticket__status svg {
    width: 2.6cqw;
    height: 2.6cqw;
    color: var(--campaign-accent);
}

.campaign-ticket__status time {
    font-weight: 800;
}

/* Worn paper: grain, stains, folds and darkened edges over the coupon, printed ink included */
.campaign-ticket__stub::after,
.campaign-ticket__body::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

.campaign-ticket__stub::after {
    background-image:
        radial-gradient(ellipse 28% 38% at 18% 82%, var(--ticket-stain), transparent 72%),
        radial-gradient(ellipse 22% 30% at 82% 16%, var(--ticket-stain), transparent 70%),
        radial-gradient(ellipse 16% 22% at 60% 60%, rgba(110, 76, 34, 0.16), transparent 70%),
        radial-gradient(ellipse 85% 85% at 50% 50%, transparent 55%, rgba(98, 66, 28, 0.3) 100%),
        linear-gradient(98deg, transparent 49.5%, rgba(80, 52, 22, 0.28) 50%, rgba(255, 255, 255, 0.35) 50.6%, transparent 51.4%),
        linear-gradient(8deg, transparent 68.8%, rgba(255, 255, 255, 0.4) 69.3%, rgba(80, 52, 22, 0.22) 70%, transparent 70.8%),
        var(--deco-noise);
    background-size: auto, auto, auto, auto, auto, auto, 260px 260px;
    mix-blend-mode: multiply;
    opacity: 0.8;
}

.campaign-ticket__body::after {
    background-image:
        radial-gradient(ellipse 85% 85% at 50% 50%, transparent 55%, rgba(255, 255, 255, 0.14) 100%),
        linear-gradient(112deg, transparent 30%, rgba(255, 255, 255, 0.07) 30.4%, transparent 31%),
        linear-gradient(74deg, transparent 62%, rgba(255, 255, 255, 0.1) 62.3%, transparent 63%),
        linear-gradient(96deg, transparent 80%, rgba(255, 255, 255, 0.06) 80.5%, transparent 81.4%),
        var(--deco-noise);
    background-size: auto, auto, auto, auto, 260px 260px;
    mix-blend-mode: screen;
    opacity: 0.55;
}
@media (max-width: 767.98px) {
    .campaign-tickets {
        width: min(100%, 26rem);
    }
}
/* Arrows: white tabs bitten into the edges of the carousel */
.campaign-arrow {
    position: absolute;
    top: 50%;
    z-index: 6;
    display: none;
    width: 50px;
    height: 168px;
    margin-top: -84px;
    padding: 0;
    border: 0;
    background: var(--campaign-bg);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='168'%3E%3Cpath d='M0 168V0c0 47.41 24 47.41 24 84S0 120.59 0 168z'/%3E%3C/svg%3E") no-repeat left center / 20px 168px;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='168'%3E%3Cpath d='M0 168V0c0 47.41 24 47.41 24 84S0 120.59 0 168z'/%3E%3C/svg%3E") no-repeat left center / 20px 168px;
    cursor: pointer;
    transition: all 0.3s linear;
}

.campaign-arrow::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--campaign-ink);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='22'%3E%3Cpath d='M11 21L1 11 11 1' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 1px center / 10px 20px;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='22'%3E%3Cpath d='M11 21L1 11 11 1' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 1px center / 10px 20px;
}

.campaign-arrow--prev {
    left: -1px;
}

.campaign-arrow--next {
    right: -1px;
    transform: rotate(180deg);
}

.campaign-arrow:hover,
.campaign-arrow:focus-visible {
    -webkit-mask-size: 23px 168px;
    mask-size: 23px 168px;
}

.campaign-stage.is-enhanced:not(.is-single) .campaign-arrow {
    display: block;
}

.campaign-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1rem;
    z-index: 4;
    display: flex;
    justify-content: center;
    align-items: center;
}

.campaign-dot {
    position: relative;
    width: 12px;
    height: 12px;
    margin: 0 5px;
    padding: 0;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s linear;
}

.campaign-dot:not(:last-child)::before {
    content: "";
    position: absolute;
    left: calc(100% + 1px);
    top: calc(50% - 1px);
    width: 16px;
    height: 2px;
    background: #ffffff;
}

.campaign-dot.is-active {
    background: #ffffff;
}

/* Inner pages */
.campaign-page {
    width: min(100%, 1240px);
    margin: 4rem auto 2rem;
}

.campaign-page--shop {
    width: min(100%, 1320px);
    margin-top: 3.4rem;
}

.campaign-page__title {
    margin: 0 0 1.5rem;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.artist-public-campaign .artist-surface {
    border: 1px solid rgba(36, 36, 36, 0.14);
    border-radius: 1.6rem;
    box-shadow: none;
}

.artist-public-campaign .artist-link {
    color: var(--campaign-accent);
    font-weight: 800;
}

/* Footer dock */
.campaign-dock {
    display: grid;
    justify-items: center;
    gap: 0.5rem;
    padding-top: 1.1rem;
}

.campaign-socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.9rem 1.2rem;
}

.campaign-social {
    display: inline-flex;
    color: var(--campaign-ink);
}

.campaign-social svg {
    width: 1.7rem;
    height: 1.7rem;
    fill: currentColor;
}

.campaign-social:hover {
    color: var(--campaign-accent);
}

.campaign-newsletter {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin-left: 0.6rem;
    padding: 0 0 0 1.4rem;
    border: 0;
    border-left: 1px solid var(--campaign-ink);
    background: transparent;
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    cursor: pointer;
}

.campaign-newsletter svg {
    width: 1.6rem;
    height: 1.6rem;
}

.campaign-copyright {
    margin: 0;
    font-size: 0.9rem;
    color: var(--artist-muted, #6b6b6b);
    text-align: center;
}

.campaign-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.2rem 0.9rem;
    margin: 0.25rem 0 0;
}

.campaign-legal-link {
    color: inherit;
    font-size: 0.78rem;
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.campaign-legal-link:hover,
.campaign-legal-link:focus-visible {
    color: var(--campaign-ink);
}

.campaign-dialog {
    width: min(92vw, 30rem);
    padding: 0;
    border: 0;
    border-radius: 1.4rem;
    background: var(--campaign-bg);
    color: var(--campaign-ink);
}

.campaign-dialog::backdrop {
    background: rgba(0, 0, 0, 0.55);
}

.campaign-dialog__form {
    display: grid;
    gap: 0.9rem;
    padding: 1.6rem;
}

.campaign-dialog__form h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 900;
    text-transform: uppercase;
}

.campaign-field {
    display: grid;
    gap: 0.3rem;
}

.campaign-field label {
    font-weight: 700;
}

.campaign-field input,
.campaign-field select,
.campaign-field textarea {
    width: 100%;
}

.campaign-form {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
}

.campaign-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.campaign-field small {
    color: var(--artist-muted, #6b6b6b);
}

.campaign-field__error {
    color: #b3261e;
    font-size: 0.9rem;
}

.campaign-dialog .campaign-btn {
    --slide-btn-bg: var(--campaign-accent);
    --slide-btn-fg: #ffffff;
    --slide-fg: var(--campaign-ink);
}

@media (max-width: 767.98px) {
    .artist-public-campaign.campaign-has-logo {
        --campaign-notch: 3.6rem;
        --campaign-radius: 1.6rem;
    }

    .campaign-brand__logo {
        height: 5.6rem;
        margin-bottom: -2.2rem;
    }

    .campaign-slide {
        grid-template-columns: 1fr;
        padding-bottom: 4rem;
    }

    .campaign-slide__art {
        order: -1;
    }

    .campaign-slide__art img {
        max-height: 34svh;
    }

    .campaign-art-fallback,
    .campaign-date-card {
        width: min(100%, 14rem);
    }

    .campaign-page {
        margin-top: 3rem;
    }

    .campaign-newsletter {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .campaign-js .campaign-in,
    .campaign-js .campaign-brand {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .campaign-js .campaign-loader {
        display: none;
    }

    .campaign-stage.is-enhanced .campaign-slide.is-active,
    .campaign-btn {
        transition: none;
    }
}
/* ---------- Campaign pages (bio, contact, concerts, music, photos, videos, fans) ---------- */
.campaign-shell {
    display: flex;
    flex-direction: column;
    min-height: 100svh;
}

.campaign-shell > .artist-public-campaign {
    flex: 1 1 auto;
    padding-bottom: 6.5rem;
}

.campaign-banner {
    --slide-bg: var(--campaign-accent);
    --slide-fg: var(--campaign-highlight);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    justify-items: center;
    gap: 0.6rem;
    min-height: clamp(11rem, 26vh, 16rem);
    padding: 3.2rem 1.5rem 2.2rem;
    border-radius: var(--campaign-radius);
    background-color: var(--slide-bg);
    background-image: var(--slide-bg-image, none);
    background-position: center;
    background-size: cover;
    color: var(--slide-fg);
    text-align: center;
    align-content: center;
}

.campaign-banner--tone-b { --slide-bg: var(--campaign-dark); }
.campaign-banner--tone-c { --slide-bg: var(--campaign-highlight); --slide-fg: var(--campaign-dark); }
.campaign-banner--tone-d { --slide-bg: color-mix(in srgb, var(--campaign-accent) 55%, var(--campaign-dark)); --slide-fg: #ffffff; }

.campaign-banner--no-image::before {
    content: attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text) "  " attr(data-bg-text);
    position: absolute;
    inset: -40%;
    z-index: -1;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(2.5rem, 7vw, 6rem);
    font-weight: 900;
    line-height: 0.95;
    text-align: center;
    overflow-wrap: anywhere;
    opacity: 0.1;
    transform: rotate(-8deg);
    pointer-events: none;
}

.campaign-banner__title {
    margin: 0;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(2.4rem, 7vw, 5rem);
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.campaign-banner__subtitle {
    margin: 0;
    font-weight: 700;
    text-transform: uppercase;
}

.campaign-content {
    width: min(100%, 1240px);
    margin: 2rem auto 0;
}

.campaign-eyebrow {
    margin: 0 0 0.4rem;
    color: var(--campaign-accent);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.campaign-heading {
    margin: 0 0 0.8rem;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.8rem, 4vw, 3rem);
    font-weight: 900;
    line-height: 1.02;
    text-transform: uppercase;
}

.campaign-heading--sm { font-size: clamp(1.3rem, 2.6vw, 2rem); }
.campaign-heading--xs { font-size: 1.1rem; }

.campaign-lead {
    margin: 0 0 1rem;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
}

.campaign-prose {
    margin: 0 0 1rem;
    color: var(--artist-muted, #6b6b6b);
    line-height: 1.7;
}

.campaign-prose--strong {
    color: var(--campaign-ink);
    font-weight: 600;
}

.campaign-prose p {
    margin: 0 0 1rem;
}

.campaign-section-title {
    margin: 3rem 0 1.2rem;
}

.campaign-empty {
    padding: 2.5rem 1rem;
    text-align: center;
    color: var(--artist-muted, #6b6b6b);
}

.campaign-actions--start {
    justify-content: flex-start;
}

.campaign-page .campaign-btn,
.campaign-dock .campaign-btn {
    --slide-btn-bg: var(--campaign-accent);
    --slide-btn-fg: #ffffff;
    --slide-fg: var(--campaign-ink);
}

.campaign-btn--outline {
    background: transparent;
    color: var(--campaign-ink);
    border-color: var(--campaign-ink);
}

.campaign-page .campaign-btn--buy {
    --slide-btn-bg: var(--campaign-dark);
    --slide-btn-fg: var(--campaign-highlight);
}

.campaign-btn--sm {
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
}

.campaign-bio {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: clamp(1.5rem, 4vw, 3.5rem);
    align-items: start;
}

.campaign-bio__media img {
    display: block;
    width: 100%;
    max-height: 34rem;
    border-radius: 1.6rem;
    object-fit: cover;
}

.campaign-bio__media .campaign-art-fallback {
    width: 100%;
    border-radius: 1.6rem;
}

.campaign-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 1rem;
    margin-top: 3rem;
}

.campaign-stat {
    display: grid;
    gap: 0.3rem;
    padding: 1.4rem 1rem;
    border-radius: 1.2rem;
    background: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
    text-align: center;
}

.campaign-stat strong {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: 2.4rem;
    font-weight: 900;
    line-height: 1;
}

.campaign-stat span {
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.campaign-grid {
    display: grid;
    gap: 1.2rem;
}

.campaign-grid--2 { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.campaign-grid--3 { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.campaign-grid--4 { grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }

.campaign-card-surface {
    display: grid;
    align-content: start;
    gap: 0.4rem;
    padding: 1.8rem;
    border: 1px solid rgba(36, 36, 36, 0.14);
    border-radius: 1.6rem;
    background: var(--artist-surface-bg, #ffffff);
}

.campaign-card-surface--compact {
    padding: 1.3rem;
}

.campaign-social-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: 0.9rem;
}

.campaign-social-card {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1rem 1.2rem;
    border-radius: 1.2rem;
    background: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
    color: var(--campaign-ink);
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.2s ease, background 0.2s ease;
}

.campaign-social-card:hover {
    transform: translateY(-3px);
    background: var(--campaign-highlight);
    color: var(--campaign-dark);
}

.campaign-social-card__icon svg {
    display: block;
    width: 1.8rem;
    height: 1.8rem;
    fill: currentColor;
}

.campaign-events {
    display: grid;
    gap: 1.2rem;
}

.campaign-event {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr) minmax(0, 14rem);
    gap: 1.5rem;
    align-items: start;
    padding: 1.5rem;
    border: 1px solid rgba(36, 36, 36, 0.14);
    border-radius: 1.6rem;
}

.campaign-event:not(:has(.campaign-event__image)) {
    grid-template-columns: 7.5rem minmax(0, 1fr);
}

.campaign-event__date {
    display: grid;
    place-content: center;
    gap: 0.2rem;
    aspect-ratio: 1 / 1;
    border-radius: 1.2rem;
    background: var(--campaign-dark);
    color: var(--campaign-highlight);
    text-align: center;
    text-transform: uppercase;
}

.campaign-event__day {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: 2.6rem;
    font-weight: 900;
    line-height: 1;
}

.campaign-event__month {
    font-size: 0.85rem;
    font-weight: 800;
}

.campaign-event__title {
    margin: 0 0 0.3rem;
    font-size: 1.5rem;
    font-weight: 900;
    text-transform: uppercase;
}

.campaign-event__meta {
    margin: 0 0 0.6rem;
    color: var(--artist-muted, #6b6b6b);
    font-weight: 700;
}

.campaign-event__text {
    margin: 0 0 0.8rem;
    color: var(--artist-muted, #6b6b6b);
}

.campaign-event__image img {
    display: block;
    width: 100%;
    border-radius: 1rem;
    object-fit: cover;
}

.campaign-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0 0 0.9rem;
}

.campaign-badge--ghost {
    background: transparent;
    border: 1px solid currentColor;
    color: var(--campaign-ink);
}

.campaign-past-events {
    display: grid;
    gap: 0.6rem;
}

.campaign-past-event {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 0.9rem 1.1rem;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--campaign-ink) 4%, var(--campaign-bg));
}

.campaign-past-event time {
    font-weight: 800;
}

.campaign-past-event h3 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
}

.campaign-past-event p {
    margin: 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
}

.campaign-details {
    margin-top: 0.6rem;
}

.campaign-details summary {
    cursor: pointer;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.8rem;
    color: var(--campaign-accent);
}

.campaign-details .artist-event-setlist,
.campaign-details .artist-event-setlist * {
    color: var(--campaign-ink);
}

.campaign-photo-grid {
    columns: 3 14rem;
    column-gap: 1rem;
}

.campaign-photo {
    display: block;
    margin-bottom: 1rem;
    overflow: hidden;
    border-radius: 1.2rem;
    break-inside: avoid;
}

.campaign-photo img {
    display: block;
    width: 100%;
    transition: transform 0.4s ease;
}

.campaign-photo:hover img {
    transform: scale(1.04);
}

.campaign-lightbox {
    width: min(96vw, 70rem);
    max-height: 94svh;
    padding: 0;
    border: 0;
    border-radius: 1rem;
    background: #000000;
    color: #ffffff;
    overflow: hidden;
}

.campaign-lightbox::backdrop {
    background: rgba(0, 0, 0, 0.82);
}

.campaign-lightbox img {
    display: block;
    width: 100%;
    max-height: 82svh;
    object-fit: contain;
}

.campaign-lightbox p {
    margin: 0;
    padding: 0.8rem 1rem;
    text-align: center;
}

.campaign-lightbox__close,
.campaign-lightbox__nav {
    position: absolute;
    z-index: 2;
    border: 0;
    background: rgba(0, 0, 0, 0.5);
    color: #ffffff;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
}

.campaign-lightbox__close { top: 0.6rem; right: 0.6rem; width: 2.6rem; height: 2.6rem; border-radius: 50%; }
.campaign-lightbox__nav { top: 50%; width: 2.6rem; height: 4rem; transform: translateY(-50%); }
.campaign-lightbox__nav--prev { left: 0; border-radius: 0 0.6rem 0.6rem 0; }
.campaign-lightbox__nav--next { right: 0; border-radius: 0.6rem 0 0 0.6rem; }

.campaign-video-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    gap: 1.5rem;
}

.campaign-video {
    margin: 0;
}

.campaign-video__frame {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 1.2rem;
    background: #000000;
}

.campaign-video__frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.campaign-video figcaption {
    display: grid;
    gap: 0.1rem;
    margin-top: 0.6rem;
}

.campaign-video figcaption span {
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
}

.campaign-tier {
    display: grid;
    align-content: start;
    gap: 0.5rem;
    padding: 1.8rem;
    border: 2px solid rgba(36, 36, 36, 0.14);
    border-radius: 1.6rem;
}

.campaign-tier.is-current {
    border-color: var(--campaign-accent);
}

.campaign-tier__price {
    margin: 0;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: 2.6rem;
    font-weight: 900;
    line-height: 1;
}

.campaign-tier__price small {
    font-size: 1rem;
    color: var(--artist-muted, #6b6b6b);
}

.campaign-tier__list {
    margin: 0 0 0.8rem;
    padding-left: 1.1rem;
    color: var(--artist-muted, #6b6b6b);
}

.campaign-release {
    margin-bottom: 3.5rem;
}

.campaign-release__head {
    display: grid;
    grid-template-columns: minmax(0, 17rem) minmax(0, 1fr);
    gap: clamp(1.2rem, 3vw, 2.5rem);
    align-items: center;
    margin-bottom: 1.6rem;
}

.campaign-release__cover img {
    display: block;
    width: 100%;
    border-radius: 1rem;
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.22);
}

.campaign-release__cover .campaign-art-fallback {
    width: 100%;
    border-radius: 1rem;
}

.campaign-tracks {
    display: grid;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.campaign-song {
    padding: 0.7rem 1rem;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--campaign-ink) 4%, var(--campaign-bg));
    transition: background 0.2s ease;
}

.campaign-song.is-playing {
    background: color-mix(in srgb, var(--campaign-accent) 14%, var(--campaign-bg));
}

.campaign-song__main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.campaign-song__play,
.campaign-song__number {
    display: grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    border: 0;
    border-radius: 50%;
    background: var(--campaign-accent);
    color: #ffffff;
    font-weight: 800;
    cursor: pointer;
}

.campaign-song__number {
    background: transparent;
    color: var(--artist-muted, #6b6b6b);
}

.campaign-song__title {
    display: grid;
    min-width: 0;
}

.campaign-song__title small {
    color: var(--artist-muted, #6b6b6b);
}

.campaign-song__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}

.campaign-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid rgba(36, 36, 36, 0.25);
    border-radius: 999px;
    color: var(--campaign-ink);
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
}

.campaign-chip:hover {
    background: var(--campaign-highlight);
    color: var(--campaign-dark);
}

.campaign-song__details {
    padding-left: 3.6rem;
}

.campaign-lyrics {
    margin: 0.6rem 0;
    color: var(--artist-muted, #525252);
    line-height: 1.7;
}

.campaign-credits {
    display: grid;
    gap: 0.2rem;
    margin: 0.6rem 0 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
}

@media (max-width: 767.98px) {
    .campaign-bio,
    .campaign-release__head {
        grid-template-columns: 1fr;
    }

    .campaign-event,
    .campaign-event:not(:has(.campaign-event__image)) {
        grid-template-columns: 1fr;
    }

    .campaign-event__date {
        aspect-ratio: auto;
        grid-auto-flow: column;
        justify-content: start;
        align-items: baseline;
        gap: 0.6rem;
        padding: 0.7rem 1rem;
    }

    .campaign-past-event {
        grid-template-columns: 1fr;
    }

    .campaign-song__main {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .campaign-song__actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .campaign-song__details {
        padding-left: 0;
    }
}
/* Fan access pages (login, signup, area) keep the look of the artist's campaign site */
.campaign-page--fan {
    width: min(100%, 1100px);
}

.campaign-page--fan .artist-surface {
    margin-bottom: 2rem;
    padding: 0;
    border: 0;
    background: transparent;
}

.campaign-page--fan .artist-tier-card,
.campaign-page--fan .artist-public-card {
    padding: 1.8rem;
    border: 2px solid rgba(36, 36, 36, 0.14);
    border-radius: 1.6rem;
    background: #ffffff;
    box-shadow: none;
    color: var(--campaign-ink);
}

.campaign-page--fan .artist-public-card-list {
    display: grid;
    gap: 0.7rem;
}

.campaign-page--fan .artist-public-card {
    padding: 0.9rem 1.1rem;
    border-radius: 1rem;
}

.campaign-page--fan .artist-tier-card hr {
    border-color: rgba(36, 36, 36, 0.16);
    opacity: 1;
}

.campaign-page--fan h2,
.campaign-page--fan h3,
.campaign-page--fan h4 {
    font-family: var(--artist-font-headings, inherit);
    font-weight: 900;
    text-transform: uppercase;
}

.campaign-page--fan .text-muted,
.campaign-page--fan .text-secondary {
    color: var(--artist-muted, #6b6b6b) !important;
}

.campaign-page--fan .text-uppercase.fw-bold {
    color: var(--campaign-accent) !important;
    letter-spacing: 0.08em;
}

.campaign-page--fan .artist-tier-price {
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: 2rem;
    font-weight: 900;
}

.campaign-page--fan .btn {
    padding: 0.8rem 1.5rem;
    border: 2px solid var(--campaign-accent);
    border-radius: 0;
    background: var(--campaign-accent);
    color: #ffffff;
    font-family: var(--artist-font-buttons, inherit);
    font-weight: 900;
    text-transform: uppercase;
    transition: transform 0.15s ease, filter 0.15s ease;
}

.campaign-page--fan .btn:hover,
.campaign-page--fan .btn:focus-visible {
    filter: brightness(1.06);
    transform: translateY(-2px);
}

.campaign-page--fan .btn-outline-dark,
.campaign-page--fan .btn-outline-secondary {
    border-color: var(--campaign-ink);
    background: transparent;
    color: var(--campaign-ink);
}

.campaign-page--fan .btn-sm {
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
}

.campaign-page--fan .auth-field {
    display: grid;
    gap: 0.3rem;
    margin-bottom: 1rem;
}

.campaign-page--fan .auth-field label {
    font-weight: 800;
}

.campaign-page--fan .form-control,
.campaign-page--fan .auth-field select {
    width: 100%;
    padding: 0.7rem 0.9rem;
    border: 2px solid rgba(36, 36, 36, 0.28);
    border-radius: 0.6rem;
    background: #ffffff;
    color: var(--campaign-ink);
    font-family: inherit;
}

.campaign-page--fan .form-control:focus,
.campaign-page--fan .auth-field select:focus {
    border-color: var(--campaign-accent);
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--campaign-accent) 25%, transparent);
}

.campaign-page--fan .form-hint {
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.85rem;
}

.campaign-page--fan .discount-code-form__toggle-control {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-weight: 600;
}

.campaign-page--fan .discount-code-form__toggle-control input {
    margin-top: 0.25rem;
    accent-color: var(--campaign-accent);
}

.campaign-page--fan .alert {
    border: 2px solid rgba(36, 36, 36, 0.14);
    border-radius: 1rem;
    background: #ffffff;
    color: var(--campaign-ink);
}

.campaign-page--fan .alert-danger {
    border-color: #b3261e;
    color: #b3261e;
}
/* Language and account dropdowns in the header */
.campaign-tools {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    z-index: 5;
    display: flex;
    align-items: center;
    transform: translateY(-50%);
}

.artist-public-campaign.is-enhanced .campaign-tools {
    right: 0.5rem;
}

.campaign-tool {
    position: relative;
}

.campaign-tool__button {
    display: block;
    width: 2.7rem;
    height: 2.7rem;
    padding: 0.6rem;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--campaign-ink);
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease;
}

.campaign-tool__button svg {
    display: block;
    width: 100%;
    height: 100%;
}

.campaign-tool__button:hover,
.campaign-tool__button:focus-visible,
.campaign-tool__button[aria-expanded="true"] {
    color: var(--campaign-accent);
    background: color-mix(in srgb, var(--campaign-accent) 12%, transparent);
}

.campaign-tool__menu {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 6;
    min-width: 13.5rem;
    padding: 0.5rem;
    border: 2px solid var(--campaign-ink);
    border-radius: 1rem;
    background: var(--campaign-bg);
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.18);
}

.campaign-tool__menu[hidden] {
    display: none;
}

.campaign-tool__menu form {
    margin: 0;
}

.campaign-tool__who {
    margin: 0.2rem 0.8rem 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(36, 36, 36, 0.16);
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.85rem;
    overflow-wrap: anywhere;
}

.campaign-tool__item {
    display: block;
    width: 100%;
    padding: 0.55rem 0.8rem;
    border: 0;
    border-radius: 0.6rem;
    background: transparent;
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.campaign-tool__item small {
    margin-left: 0.4rem;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.7rem;
    font-weight: 600;
}

.campaign-tool__item:hover,
.campaign-tool__item:focus-visible,
.campaign-tool__item.is-current {
    color: var(--campaign-accent);
    background: color-mix(in srgb, var(--campaign-accent) 10%, transparent);
}

.campaign-tool__item--logout {
    margin-top: 0.3rem;
    border-top: 1px solid rgba(36, 36, 36, 0.16);
    border-radius: 0 0 0.6rem 0.6rem;
}

/* Fan account sections */
.fan-account-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.8rem;
}

.fan-account-tabs a {
    padding: 0.5rem 1.1rem;
    border: 2px solid var(--campaign-ink);
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-decoration: none;
    text-transform: uppercase;
}

.fan-account-tabs a:hover,
.fan-account-tabs a.is-active {
    border-color: var(--campaign-accent);
    background: var(--campaign-accent);
    color: #ffffff;
}

.fan-account-list {
    display: grid;
    gap: 0.8rem;
}

.fan-account-table {
    overflow-x: auto;
}

.campaign-page--fan .table {
    --bs-table-bg: transparent;
    color: var(--campaign-ink);
}

.campaign-page--fan .table th {
    font-family: var(--artist-font-nav, inherit);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
/* Two-factor flows inside the fan shell */
.campaign-page--fan .btn-primary {
    border-color: var(--campaign-accent);
    background: var(--campaign-accent);
    color: #ffffff;
}

.campaign-page--fan .btn-secondary,
.campaign-page--fan .btn-link {
    border-color: var(--campaign-ink);
    background: transparent;
    color: var(--campaign-ink);
    text-decoration: none;
}

.campaign-page--fan .auth-form input[type="text"],
.campaign-page--fan .auth-form input[type="number"],
.campaign-page--fan .auth-form input[type="password"],
.campaign-page--fan .auth-form input[type="email"],
.campaign-page--fan .auth-form select {
    width: 100%;
    padding: 0.7rem 0.9rem;
    border: 2px solid rgba(36, 36, 36, 0.28);
    border-radius: 0.6rem;
    background: #ffffff;
    color: var(--campaign-ink);
    font-family: inherit;
}

.campaign-page--fan .auth-form p {
    display: grid;
    gap: 0.3rem;
}

.campaign-page--fan .auth-form label {
    font-weight: 800;
}

.fan-two-factor-generator {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1.5rem;
    align-items: center;
    margin-bottom: 1.5rem;
}

.fan-two-factor-qr {
    padding: 0.8rem;
    border: 2px solid rgba(36, 36, 36, 0.14);
    border-radius: 1rem;
    background: #ffffff;
}

.fan-two-factor-qr img {
    display: block;
    max-width: 100%;
}

.fan-two-factor-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.2rem;
}

@media (max-width: 640px) {
    .fan-two-factor-generator {
        grid-template-columns: 1fr;
    }
}
.campaign-page--fan .auth-form label {
    display: block;
    margin-bottom: 0.3rem;
}

.campaign-page--fan .auth-form input:not([type="hidden"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]) {
    width: 100%;
}

/* ---------- Store: listing, product, cart and checkout ---------- */
.campaign-badge {
    display: inline-block;
    padding: 0.25rem 0.7rem;
    background: var(--campaign-highlight);
    color: var(--campaign-dark);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.campaign-badge--dark {
    background: var(--campaign-ink);
    color: var(--campaign-bg);
}

.shop {
    --shop-tile: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
    --shop-line: color-mix(in srgb, var(--campaign-ink) 14%, transparent);
}

.shop-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.6rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--shop-line);
}

.shop-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.shop-filters[hidden] {
    display: none;
}

.shop-filter {
    padding: 0.5rem 1.1rem;
    border: 2px solid var(--campaign-ink);
    border-radius: 999px;
    background: transparent;
    color: var(--campaign-ink);
    font-family: var(--artist-font-nav, inherit);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.shop-filter:hover,
.shop-filter.is-active {
    border-color: var(--campaign-accent);
    background: var(--campaign-accent);
    color: #ffffff;
}

.shop-count {
    margin: 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.shop-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem 1.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.shop-grid--small {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.shop-card[hidden] {
    display: none;
}

.shop-card__link {
    display: block;
    color: var(--campaign-ink);
    text-decoration: none;
}

.shop-card__media {
    position: relative;
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    margin-bottom: 0.9rem;
    overflow: hidden;
    border-radius: 1.2rem;
    background: var(--shop-tile);
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.shop-card__img {
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.4s ease, opacity 0.3s ease;
}

.shop-card__img--hover {
    opacity: 0;
}

.shop-card__link:hover .shop-card__img {
    transform: scale(1.04);
}

.shop-card__link:hover .shop-card__img--hover {
    opacity: 1;
}

.shop-card__placeholder {
    padding: 1rem;
}

.shop-card__flags {
    position: absolute;
    top: 0.7rem;
    left: 0.7rem;
    display: flex;
    gap: 0.4rem;
}

.shop-card__name {
    margin: 0 0 0.25rem;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
}

.shop-card__price {
    margin: 0;
    color: var(--artist-muted, #525252);
}

.shop-card__price small {
    font-size: 0.8em;
}

.shop-card.is-soldout .shop-card__media {
    opacity: 0.55;
}

.shop-empty {
    padding: 3rem 1rem;
    text-align: center;
    color: var(--artist-muted, #6b6b6b);
}

.shop-empty[hidden] {
    display: none;
}

/* Product page */
.shop-crumbs {
    margin-bottom: 1.5rem;
}

.shop-crumbs a {
    color: var(--campaign-ink);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-decoration: none;
    text-transform: uppercase;
}

.shop-crumbs a:hover {
    color: var(--campaign-accent);
}

.shop-product {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: start;
}

.shop-product__stage {
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 1.6rem;
    background: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
}

.shop-product__stage img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.shop-product__placeholder {
    padding: 2rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.shop-product__thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin: 0.8rem 0 0;
    padding: 0;
    list-style: none;
}

.shop-product__thumbs button {
    width: 4.6rem;
    height: 4.6rem;
    padding: 0;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
    cursor: pointer;
}

.shop-product__thumbs button.is-active {
    border-color: var(--campaign-accent);
}

.shop-product__thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.shop-product__info {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.shop-product__name {
    margin: 0;
    font-family: var(--artist-font-display, var(--artist-font-headings, inherit));
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
}

.shop-product__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.7rem;
    margin: 0;
    font-size: 1.8rem;
    font-weight: 800;
}

.shop-product__price del {
    color: var(--artist-muted, #6b6b6b);
    font-size: 1.15rem;
    font-weight: 500;
}

.shop-product__price small {
    font-size: 0.9rem;
    font-weight: 600;
}

.shop-product__description {
    color: var(--artist-muted, #525252);
    line-height: 1.6;
}

.shop-product__description p {
    margin: 0 0 0.6rem;
}

.shop-product__form {
    display: grid;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 2px solid color-mix(in srgb, var(--campaign-ink) 14%, transparent);
}

.shop-options {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.shop-options legend {
    float: none;
    width: auto;
    margin-bottom: 0.5rem;
    padding: 0;
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.shop-options__values {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.shop-option {
    position: relative;
    margin: 0;
}

.shop-option input {
    position: absolute;
    opacity: 0;
    inset: 0;
    cursor: pointer;
}

.shop-option span {
    display: block;
    min-width: 3rem;
    padding: 0.55rem 1rem;
    border: 2px solid color-mix(in srgb, var(--campaign-ink) 30%, transparent);
    border-radius: 0.7rem;
    font-weight: 700;
    text-align: center;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.shop-option input:checked + span {
    border-color: var(--campaign-ink);
    background: var(--campaign-ink);
    color: var(--campaign-bg);
}

.shop-option input:focus-visible + span {
    outline: 3px solid color-mix(in srgb, var(--campaign-accent) 55%, transparent);
    outline-offset: 2px;
}

.shop-option.is-unavailable span {
    opacity: 0.4;
    text-decoration: line-through;
}

.shop-product__stock,
.shop-product__hint {
    margin: 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
}

.shop-product__stock[hidden],
.shop-product__hint[hidden] {
    display: none;
}

.shop-product__stock.is-low {
    color: var(--campaign-accent);
    font-weight: 700;
}

.shop-product__buyrow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.shop-product__buy {
    flex: 1 1 14rem;
    text-align: center;
}

.shop-product__buy[disabled] {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
}

.shop-product__soldout {
    display: inline-block;
    justify-self: start;
    padding: 0.6rem 1.2rem;
    background: var(--campaign-ink);
    color: var(--campaign-bg);
    font-weight: 800;
    text-transform: uppercase;
}

.shop-qty {
    display: inline-flex;
    align-items: stretch;
    border: 2px solid var(--campaign-ink);
    border-radius: 0.7rem;
    overflow: hidden;
}

.shop-qty button {
    width: 2.8rem;
    border: 0;
    background: transparent;
    color: var(--campaign-ink);
    font-size: 1.3rem;
    font-weight: 700;
    cursor: pointer;
}

.shop-qty button:hover {
    background: color-mix(in srgb, var(--campaign-ink) 8%, transparent);
}

.shop-qty input {
    width: 3.2rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--campaign-ink);
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    -moz-appearance: textfield;
    appearance: textfield;
}

.shop-qty input::-webkit-outer-spin-button,
.shop-qty input::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.shop-related {
    margin-top: 4rem;
}

/* Steps */
.shop-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.6rem;
    margin: 0 0 2rem;
    padding: 0;
    list-style: none;
    counter-reset: step;
}

.shop-steps li {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--artist-muted, #6b6b6b);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    counter-increment: step;
}

.shop-steps li::before {
    content: counter(step);
    display: grid;
    place-items: center;
    width: 1.8rem;
    height: 1.8rem;
    border: 2px solid currentColor;
    border-radius: 50%;
    font-size: 0.85rem;
}

.shop-steps a {
    color: inherit;
    text-decoration: none;
}

.shop-steps li.is-current {
    color: var(--campaign-ink);
}

.shop-steps li.is-current::before {
    border-color: var(--campaign-accent);
    background: var(--campaign-accent);
    color: #ffffff;
}

/* Cart */
.shop-cart,
.shop-checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 22rem;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: start;
}

.shop-lines {
    margin: 0;
    padding: 0;
    list-style: none;
}

.shop-line {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr) auto;
    gap: 1.1rem;
    align-items: start;
    padding: 1.2rem 0;
    border-bottom: 2px solid color-mix(in srgb, var(--campaign-ink) 12%, transparent);
}

.shop-line:first-child {
    padding-top: 0;
}

.shop-line__thumb {
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--campaign-ink) 5%, var(--campaign-bg));
    color: var(--campaign-ink);
    font-size: 0.75rem;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.shop-line__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.shop-line__body {
    display: grid;
    gap: 0.35rem;
    justify-items: start;
}

.shop-line__name {
    color: var(--campaign-ink);
    font-size: 1.1rem;
    font-weight: 800;
    text-decoration: none;
}

.shop-line__variant,
.shop-line__unit {
    margin: 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.92rem;
}

.shop-line__form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.9rem;
    margin-top: 0.4rem;
}

.shop-line__remove {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
    text-decoration: underline;
    cursor: pointer;
}

.shop-line__remove:hover {
    color: var(--campaign-accent);
}

.shop-line__total {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
}

.shop-summary {
    display: grid;
    gap: 1rem;
    padding: 1.6rem;
    border: 2px solid var(--campaign-ink);
    border-radius: 1.4rem;
    background: color-mix(in srgb, var(--campaign-ink) 3%, var(--campaign-bg));
}

.shop-summary--sticky {
    position: sticky;
    top: 1.5rem;
}

.shop-summary h2 {
    margin: 0;
    font-size: 1.3rem;
}

.shop-summary dl {
    display: grid;
    gap: 0.6rem;
    margin: 0;
}

.shop-summary dl > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.shop-summary dt {
    font-weight: 600;
}

.shop-summary dd {
    margin: 0;
    font-weight: 800;
    text-align: right;
}

.shop-summary__muted {
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.85rem;
    font-weight: 500;
}

.shop-summary__total {
    padding-top: 0.8rem;
    border-top: 2px solid color-mix(in srgb, var(--campaign-ink) 18%, transparent);
    font-size: 1.25rem;
}

.shop-summary__cta {
    width: 100%;
    text-align: center;
}

.shop-summary__back {
    justify-self: center;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
    text-decoration: underline;
}

.shop-summary__secure {
    margin: -0.3rem 0 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.82rem;
    text-align: center;
}

.shop-empty-cart {
    display: grid;
    justify-items: center;
    gap: 0.8rem;
    padding: 3rem 1rem;
    text-align: center;
}

.shop-empty-cart h2 {
    margin: 0;
}

/* Checkout */
.shop-checkout__form {
    display: grid;
    gap: 1.6rem;
}

.shop-fieldset {
    display: grid;
    gap: 0.9rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.shop-fieldset legend {
    float: none;
    width: auto;
    margin-bottom: 0.2rem;
    padding: 0;
    font-family: var(--artist-font-headings, inherit);
    font-size: 1.3rem;
    font-weight: 900;
    text-transform: uppercase;
}

.shop-fieldset__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.shop-field {
    display: grid;
    gap: 0.3rem;
}

.shop-field label {
    font-size: 0.85rem;
    font-weight: 800;
}

.shop-field input,
.shop-field select,
.shop-field textarea {
    width: 100%;
    padding: 0.8rem 0.95rem;
    border: 2px solid color-mix(in srgb, var(--campaign-ink) 28%, transparent);
    border-radius: 0.7rem;
    background: #ffffff;
    color: var(--campaign-ink);
    font-family: inherit;
    font-size: 1rem;
}

.shop-field input:focus,
.shop-field select:focus,
.shop-field textarea:focus {
    border-color: var(--campaign-accent);
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--campaign-accent) 25%, transparent);
}

.shop-field.has-error input,
.shop-field.has-error select,
.shop-field.has-error textarea {
    border-color: #b3261e;
}

.shop-field__error {
    color: #b3261e;
}

.shop-alert {
    padding: 0.9rem 1rem;
    border: 2px solid #b3261e;
    border-radius: 0.8rem;
    color: #b3261e;
    font-weight: 700;
}

.shop-mini {
    display: grid;
    gap: 0.8rem;
    margin: 0;
    padding: 0 0 1rem;
    border-bottom: 2px solid color-mix(in srgb, var(--campaign-ink) 14%, transparent);
    list-style: none;
}

.shop-mini li {
    display: grid;
    grid-template-columns: 3.4rem minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
}

.shop-mini__thumb {
    position: relative;
    display: block;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 0.7rem;
    background: color-mix(in srgb, var(--campaign-ink) 6%, var(--campaign-bg));
}

.shop-mini__thumb img {
    width: 100%;
    height: 100%;
    border-radius: 0.7rem;
    object-fit: contain;
}

.shop-mini__thumb b {
    position: absolute;
    top: -0.45rem;
    right: -0.45rem;
    display: grid;
    place-items: center;
    min-width: 1.3rem;
    height: 1.3rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: var(--campaign-ink);
    color: var(--campaign-bg);
    font-size: 0.72rem;
}

.shop-mini__name {
    font-weight: 700;
    line-height: 1.25;
}

.shop-mini__name small {
    display: block;
    color: var(--artist-muted, #6b6b6b);
    font-weight: 500;
}

.shop-mini__total {
    font-weight: 800;
}

/* Cart icon in the header */
.campaign-cart-link {
    position: relative;
    display: grid;
    place-items: center;
    text-decoration: none;
}

.campaign-cart-link__count {
    position: absolute;
    top: 0.1rem;
    right: 0;
    display: grid;
    place-items: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.2rem;
    border-radius: 999px;
    background: var(--campaign-accent);
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1;
}

@media (max-width: 991.98px) {
    .shop-grid,
    .shop-grid--small {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.6rem 1rem;
    }

    .shop-product,
    .shop-cart,
    .shop-checkout {
        grid-template-columns: 1fr;
    }

    .shop-summary--sticky {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .shop-line {
        grid-template-columns: 5rem minmax(0, 1fr);
    }

    .shop-line__total {
        grid-column: 2;
    }

    .shop-fieldset__row {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 575.98px) {
    .campaign-tool__button {
        width: 1.9rem;
        height: 1.9rem;
        padding: 0.35rem;
    }

    .artist-public-campaign.is-enhanced .campaign-tools {
        right: 0.5rem;
    }

    .shop-product__thumbs button {
        width: 3.6rem;
        height: 3.6rem;
    }
}

.shop-summary__discount dd {
    color: var(--campaign-accent, #e54e5b);
}

.shop-coupon {
    display: grid;
    gap: 0.4rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--campaign-ink) 14%, transparent);
}

.shop-coupon label {
    font-size: 0.85rem;
    font-weight: 600;
}

.shop-coupon__row {
    display: flex;
    gap: 0.5rem;
}

.shop-coupon__row input {
    flex: 1;
    min-width: 0;
    padding: 0.5rem 0.7rem;
    border: 2px solid color-mix(in srgb, var(--campaign-ink) 25%, transparent);
    background: transparent;
    color: inherit;
    text-transform: uppercase;
}

.shop-coupon__applied {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
    font-size: 0.9rem;
}

.shop-video-form {
    display: grid;
    gap: 0.9rem;
}

.shop-video-form__note {
    margin: 0;
    color: var(--artist-muted, #6b6b6b);
    font-size: 0.9rem;
}

.campaign-coupon {
    margin: 0 0 0.8rem;
    font-size: 0.85rem;
}

.campaign-coupon summary {
    cursor: pointer;
    text-decoration: underline;
}

.campaign-coupon input {
    width: 100%;
    margin-top: 0.4rem;
    padding: 0.5rem 0.7rem;
    border: 2px solid color-mix(in srgb, var(--campaign-ink) 25%, transparent);
    background: transparent;
    color: inherit;
    text-transform: uppercase;
}