@font-face {
    font-family: "Curator Display";
    src: url("../fonts/Anton-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Charcoal paper and pale ink, scoped to this product's shared marketplace UI. */
.cur-page {
    --dngn-bg: #151719;
    --dngn-text: #e4e3dc;
    --dngn-muted: #b9bcba;
    --dngn-orange: #a3c9c3;
    --dngn-cyan: #b5ddd7;
    --dngn-rule: #777e7d;
    --cur-display: "Curator Display", Impact, sans-serif;
    --cur-motion: 180ms ease-out;
    padding: 0 0 50px;
    overflow: clip;
    font: 400 18px/1.7 Georgia, "Times New Roman", serif;
}
.cur-page::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: url("../images/curators/dust.svg") repeat;
    background-size: 256px 256px;
    opacity: .18;
    pointer-events: none;
}
.cur-page .dngn-container { width: min(1280px, calc(100% - 112px)); }
.cur-page :where(h2,h3,h4) { font-family: var(--cur-display); font-weight: 400; letter-spacing: -.035em; text-transform: uppercase; }
.cur-page h2 { font-size: clamp(2rem, 1.3rem + 2.2vw, 3.4rem); line-height: 1.16; text-wrap: balance; }
.cur-page :where(button,input,summary,.dngn-button,.dngn-secondary) { border-radius: 0; }
.cur-page :where(.dngn-button,.dngn-secondary,.dngn-wishlist) { transition: background-color var(--cur-motion), color var(--cur-motion), transform var(--cur-motion); }
.cur-page .dngn-button { background: var(--dngn-orange); border-color: var(--dngn-orange); color: var(--dngn-bg) !important; letter-spacing: 0; }
.cur-page .dngn-button:hover:not(:disabled) { background: #c2e3de; border-color: #c2e3de; }
.cur-page .dngn-secondary { background: var(--dngn-bg); }
.cur-page .dngn-amount input { background: #333638; }
.cur-page .dngn-secondary:hover:not(:disabled),
.cur-page .dngn-secondary[aria-pressed="true"] { background: var(--dngn-orange); color: var(--dngn-bg); }
.cur-page .dngn-wishlist { border-radius: 0; background: transparent; }
.cur-page .dngn-wishlist:hover { background: #a3c9c31a; }
.cur-page .dngn-text-link { color: var(--dngn-cyan); border-bottom-color: #a3c9c366; font-size: 12px; }
.cur-page .dngn-section { position: relative; padding-block: 70px; border-top: 0; }
.cur-hero-shell { position: relative; isolation: isolate; padding-top: 22px; }
.cur-hero-backdrop { position: absolute; z-index: -1; inset: 0 0 0 auto; width: 62%; height: 100%; object-fit: cover; object-position: 35% center; opacity: .1; -webkit-mask-image: linear-gradient(to right, transparent, #000 35%); mask-image: linear-gradient(to right, transparent, #000 35%); pointer-events: none; }
.cur-page .dngn-back { position: relative; z-index: 2; font-size: 11px; }
.cur-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 80px; min-height: 700px; padding: 36px 0 60px; }
.cur-book-display { width: 100%; max-width: 530px; min-width: 0; justify-self: center; }
.cur-cover { display: block; cursor: zoom-in; }
.cur-cover img { display: block; width: min(430px, 100%); height: auto; max-height: 560px; object-fit: contain; margin-inline: auto; }
.cur-page .dngn-cover-thumbnails { margin-top: 22px; gap: 10px; }
.cur-page .dngn-cover-thumbnails a { border: 0; border-radius: 0; background: transparent; }
.cur-page .dngn-cover-thumbnails a:hover { background: #ffffff0a; }
.cur-page .dngn-cover-thumbnails img { transition: transform var(--cur-motion); }
.cur-info { position: relative; min-width: 0; width: 100%; max-width: 560px; }
.cur-info h1 { margin: 0; }
.cur-wordmark { display: block; width: 100%; height: auto; }
.cur-byline { margin-top: 28px !important; font-size: 16px; }
.cur-byline a { color: var(--dngn-cyan); text-decoration: underline; text-underline-offset: 5px; }
.cur-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 18px; }
.cur-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; font-size: 13px; }
.cur-milestone { display: flex; align-items: center; gap: 8px; font: 600 10px/1.4 var(--dngn-mono); }
.cur-milestone > img { width: 34px; height: 34px; object-fit: contain; }
.cur-milestone :where(strong,small) { display: block; }
.cur-milestone small { margin-top: 3px; color: var(--dngn-muted); }
.cur-page .dngn-price { margin-top: 26px; gap: 8px 16px; }
.cur-page .dngn-price strong { font: 700 26px/1.3 Georgia, serif; }
.cur-page .dngn-price .cur-sale { flex-basis: 100%; color: var(--dngn-cyan); font: 600 11px/1.5 var(--dngn-mono); }
.cur-page .dngn-actions { max-width: 450px; }
.cur-owned-actions { display: flex; flex: 1; flex-wrap: wrap; gap: 10px; }
.cur-owned-actions > a { flex: 1 1 160px; gap: 10px; }
.cur-owned-actions svg { flex-shrink: 0; width: 22px; height: 22px; }
.cur-page .dngn-community > div { flex-wrap: wrap; }
.cur-page .dngn-community .dngn-secondary { width: 100%; font-size: 11px; }
.cur-section-nav { position: relative; }
.cur-section-nav::before, .cur-section-nav::after,
.cur-artwork::before, .cur-creator::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: currentColor;
    opacity: .4;
    transform: rotate(-.22deg);
    pointer-events: none;
}
.cur-section-nav::after { top: 3px; opacity: .17; transform: rotate(.15deg); }
.cur-section-nav > div { display: flex; justify-content: center; gap: 80px; }
.cur-section-nav a { display: flex; align-items: center; justify-content: center; min-height: 65px; padding: 8px; font: 600 11px/1.5 var(--dngn-mono); }
.cur-section-nav a:hover { color: var(--dngn-cyan); }
.cur-page .cur-supplement { width: min(720px, 100%); margin-inline: auto; padding-top: 90px; }
.cur-supplement h2 { margin-bottom: 32px; font-size: clamp(2.6rem, 1.4rem + 3.8vw, 4.8rem); line-height: 1.08; }
.cur-supplement h2 > span { color: var(--dngn-cyan); }
.cur-page .dngn-prose { font-size: 18px; line-height: 1.8; }
.cur-page .dngn-prose :where(h3,h4) { color: var(--dngn-cyan); font-size: 25px; }
.cur-page .dngn-prose > p:last-child { font: inherit; color: inherit; }
.cur-page .dngn-prose > :where(ol,ul) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; columns: auto; }
.cur-page .dngn-prose li strong { display: inline; }
.cur-page .dngn-prose > :where(ol,ul) > li { border-top: 0; }
.cur-page .dngn-prose > :where(ol,ul) > li > strong:first-of-type::after { content: ":"; }
.cur-page .dngn-prose p:empty { display: none; }
.cur-included { margin-top: 42px; }
.cur-included h3 { margin-bottom: 16px; font-size: 25px; }
.cur-included ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; margin: 0; padding: 0; list-style: none; }
.cur-included li { display: flex; align-items: start; gap: 16px; min-width: 0; padding: 18px 0; }
.cur-entry-number { color: var(--dngn-cyan); font: 400 32px/1.2 var(--cur-display); transform: rotate(-5deg); }
.cur-included-copy { min-width: 0; font-size: 16px; color: var(--dngn-muted); }
.cur-page .cur-included h4 { display: inline; font: bold 1em/1.5 Georgia, serif; text-transform: none; }
.cur-included-description, .cur-included-description > p:first-child { display: inline; }
.cur-included li p { margin-top: 8px; font-size: inherit; color: inherit; }
@media (max-width: 600px) {
    .cur-included ol { grid-template-columns: minmax(0, 1fr); }
    .cur-page .dngn-prose > :where(ol,ul) { grid-template-columns: minmax(0, 1fr); }
}
.cur-fear-fest { display: flex; align-items: center; gap: 24px; margin-top: 30px; padding-block: 15px; font-size: 14px; color: var(--dngn-muted) !important; }
.cur-fear-fest > img { width: 105px; height: auto; }
.cur-fear-fest strong { display: inline-flex; align-items: center; gap: 10px; margin-top: 5px; font: 600 10px/1.6 var(--dngn-mono); color: var(--dngn-cyan); }
.cur-fear-fest .dngn-icon { width: 16px; height: 16px; }
.cur-rule-heading { margin-bottom: 34px; }
.cur-rule-heading > span { display: none; }
.cur-page .cur-artwork { border: 0; }
.cur-page .cur-artwork::before { display: none; }
.cur-art-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 25px; }
.cur-art-plate { display: block; min-width: 0; border: 0; cursor: zoom-in; }
.cur-art-plate img { display: block; width: 100%; height: auto; border: 0; box-shadow: none; transition: transform var(--cur-motion); }
.cur-creator-profiles { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 28px 48px; }
.cur-creator-profile { display: flex; align-items: center; gap: 24px; }
.cur-creator-profile > img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.cur-creator-profile p { display: flex; align-items: center; gap: 10px; }
.cur-creator-profile strong { font-size: 22px; }
.cur-creator-profile p + p { margin-top: 6px; color: var(--dngn-muted); font-size: 14px; }
.cur-page .dngn-disclosure { display: flex; align-items: center; gap: 10px; }
.cur-closing { display: flex; align-items: center; gap: 45px; padding: 40px 0 15px; border-top: 1px solid #e4e3dc55; }
.cur-closing > a:first-child { margin-right: auto; }
.cur-closing img { display: block; width: 290px; height: auto; }
.cur-closing > strong { white-space: nowrap; font-size: 22px; }
.cur-closing > .dngn-button { min-width: 200px; }
.cur-page .dngn-dialog { background: var(--dngn-bg); border-color: var(--dngn-rule); }
.cur-page .dngn-dialog::backdrop { background: #202225ed; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .cur-page :where(.cur-art-plate,.dngn-cover-thumbnails a):hover img { transform: translateY(-4px); }
    .cur-page .dngn-button:hover:not(:disabled) { transform: translateY(-2px); }
}
@media (max-width: 1100px) {
    .cur-page .dngn-container { width: calc(100% - 72px); }
    .cur-hero { gap: 36px; min-height: 620px; }
    .cur-art-grid { gap: 25px; }
    .cur-closing { gap: 24px; }
    .cur-closing img { width: 230px; }
}
@media (max-width: 760px) {
    .cur-page .dngn-container { width: calc(100% - 40px); }
    .cur-hero-shell { padding-top: 12px; }
    .cur-hero { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 36px; padding: 24px 0 40px; }
    .cur-cover img { width: min(280px, 100%); max-height: 365px; }
    .cur-page .dngn-cover-thumbnails { margin-top: 15px; }
    .cur-hero-backdrop { width: 100%; opacity: .06; }
    .cur-info { max-width: 520px; margin-inline: auto; }
    .cur-wordmark { max-width: 440px; margin-inline: auto; }
    .cur-byline { margin-top: 20px !important; }
    .cur-section-nav > div { gap: 0; justify-content: space-between; }
    .cur-section-nav a { min-height: 58px; font-size: 10px; padding-inline: 2px; }
    .cur-page .dngn-section { padding-block: 45px; }
    .cur-art-grid { gap: 15px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cur-rule-heading { margin-bottom: 25px; }
    .cur-closing { flex-wrap: wrap; gap: 22px; }
    .cur-closing > a:first-child { flex: 1 0 100%; }
    .cur-closing img { width: min(300px, 100%); }
    .cur-closing > .dngn-button { flex: 1; min-width: 140px; }
    .cur-page .dngn-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); }
    .cur-page .dngn-dialog-controls { gap: 10px; }
    .cur-page .dngn-presets--suggested { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
    .cur-page :where(.cur-cover,.cur-art-plate img,.dngn-cover-thumbnails img,.dngn-button,.dngn-secondary,.dngn-wishlist) { transition: none; }
}

/* Transitions.dev: avatar-group hover, used on the three cover-stack faces. */
:root {
  --avatar-lift: -4px;
  --avatar-dur: 320ms;
  --avatar-scale: 1.05;
  --avatar-falloff: 0.45;
  --avatar-ease-in: cubic-bezier(0.22, 1, 0.36, 1);
  --avatar-ease-out: cubic-bezier(0.34, 3.85, 0.64, 1);
}

/* Hover-spring transition only — bring your own avatar/chip
   styling (size, shape, border, stacking, background). */
.t-avatar {
  transform-origin: center;
  /* translateY before scale so scale doesn't amplify the lift offset. */
  transform:
    translateY(var(--shift, 0px))
    scale(var(--scale-active, 1));
  transition: transform var(--avatar-dur) var(--avatar-ease-in);
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .t-avatar { transition: none !important; transform: none !important; }
}

/* The anchors fan out; the inner skill faces lift independently. */
.cur-cover-stack {
    --avatar-dur: 480ms;
    --avatar-scale: 1.015;
    --avatar-ease-out: cubic-bezier(.34, 1.2, .64, 1);
    position: relative;
    isolation: isolate;
    width: min(430px, 100%);
    margin-inline: auto;
}
.cur-cover-stack--fanned { width: min(430px, calc(100% - 84px)); }
.cur-cover-stack .t-avatar { display: block; width: 100%; height: 100%; }
.cur-cover-stack .cur-cover { position: relative; z-index: 3; }
.cur-cover-stack .cur-cover img { width: 100%; box-shadow: 0 14px 30px #0006; }
.cur-fan-sheet {
    position: absolute;
    z-index: 1;
    top: 5%;
    left: 7%;
    width: 86%;
    height: 90%;
    transform-origin: 50% 85%;
    cursor: zoom-in;
    transition: transform var(--avatar-dur) var(--avatar-ease-in);
}
.cur-fan-sheet .t-avatar { overflow: hidden; background: #25282b; border: 1px solid #d2ded72b; box-shadow: 0 8px 22px #0005; }
.cur-fan-sheet img { display: block; width: 100%; height: 100%; object-fit: contain; }
.cur-fan-sheet--left { transform: translateX(-14%) rotate(-9deg); }
.cur-fan-sheet--right { transform: translateX(14%) rotate(9deg); }
.cur-cover-stack.is-fanned .cur-fan-sheet--left { transform: translateX(-18%) rotate(-11deg); }
.cur-cover-stack.is-fanned .cur-fan-sheet--right { transform: translateX(18%) rotate(11deg); }
.cur-cover-stack .cur-fan-sheet:focus-visible { z-index: 4; }
@media (max-width: 760px) {
    .cur-cover-stack { width: min(280px, 100%); }
    .cur-cover-stack--fanned { width: min(280px, calc(100% - 72px)); }
}
@media (prefers-reduced-motion: reduce) {
    .cur-fan-sheet { transition: none; }
    .cur-cover-stack.is-fanned .cur-fan-sheet--left { transform: translateX(-14%) rotate(-9deg); }
    .cur-cover-stack.is-fanned .cur-fan-sheet--right { transform: translateX(14%) rotate(9deg); }
}
