.character-dossiers-page {
  overflow: hidden;
}

.character-dossiers-page section {
  padding-block: var(--space-9);
}

.cd-entrance {
  padding-block-start: var(--space-8) !important;
}

.cd-entrance__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  gap: var(--space-6);
}

.cd-entrance__copy,
.cd-entrance__media,
.cd-feature__reading,
.cd-feature__rail,
.cd-availability__copy,
.cd-availability__action {
  min-width: 0;
}

.cd-entrance__copy {
  width: 100%;
  max-width: 40rem;
}

.cd-entrance__standfirst {
  max-width: 32rem;
  color: var(--color-ivory-50);
  font-size: var(--text-lead);
  line-height: var(--leading-lead);
}

.cd-entrance__support {
  max-width: 32rem;
  color: var(--color-platinum-300);
}

.cd-entrance__rule {
  border-top: 1px solid var(--color-champagne-500);
  padding-top: var(--space-4);
}

.cd-entrance__actions {
  margin-top: var(--space-5);
}

.cd-entrance__media {
  width: 100%;
  aspect-ratio: 2.39 / 1;
  margin: 0;
  background: var(--color-midnight-800);
}

.cd-entrance__media img {
  width: 100%;
  height: 100%;
  object-position: right center;
  filter: saturate(0.87) contrast(1.04);
}

.cd-feature {
  background: var(--color-midnight-900);
}

.cd-feature__grid {
  display: grid;
  grid-template-columns: minmax(0, 47.5rem) minmax(0, 17.5rem);
  justify-content: space-between;
  align-items: start;
  gap: var(--space-7);
}

.cd-feature__reading {
  width: 100%;
  max-width: 47.5rem;
}

.cd-feature__meta {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  margin-bottom: var(--space-6);
  border-block: var(--border-subtle);
  padding-block: var(--space-3);
  color: var(--color-platinum-300);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  line-height: var(--leading-compact);
  text-transform: uppercase;
}

.cd-feature__meta span {
  min-width: 0;
}

.cd-analysis-unit {
  width: 100%;
  margin-bottom: var(--space-7);
}

.cd-analysis-unit h3 {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
}

.cd-analysis-unit h3 span {
  color: var(--color-champagne-300);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
}

.cd-analysis-unit--ruled {
  border-inline-start: 2px solid var(--color-champagne-500);
  padding-inline-start: var(--space-5);
}

.cd-analysis-unit__emphasis {
  margin-bottom: 0;
  color: var(--color-champagne-300);
  font-family: var(--font-heading);
  font-size: 1.35rem;
  font-style: italic;
  line-height: var(--leading-card);
}

.cd-feature__rail {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: var(--space-5);
}

.cd-feature__plate {
  width: 100%;
  margin: 0;
}

.cd-feature__plate .media-frame {
  width: 100%;
}

.cd-feature__plate img {
  filter: saturate(0.88) contrast(1.04);
}

.cd-feature__rail-note {
  width: 100%;
  border-top: 1px solid var(--color-champagne-500);
  padding-top: var(--space-4);
}

.cd-section-intro {
  width: 100%;
}

.cd-section-intro > :last-child {
  margin-bottom: 0;
}

.cd-archetypes .cd-section-intro {
  max-width: 38rem;
}

.cd-archetypes__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.cd-archetype-card {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-3);
  border: var(--border-subtle);
  border-top: 1px solid rgba(197, 200, 208, 0.38);
  background: var(--color-midnight-900);
  padding: var(--space-5);
  transition: border-color var(--transition-fast), background-color var(--transition-fast);
}

.cd-archetype-card > * {
  min-width: 0;
  margin: 0;
}

.cd-archetype-card h3 {
  font-size: 1.75rem;
}

.cd-archetype-card p:not(.cd-card-number) {
  color: var(--color-platinum-300);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.cd-archetype-card a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  margin-top: auto;
  font-size: var(--text-sm);
  font-weight: 700;
}

.cd-archetype-card:hover,
.cd-archetype-card:focus-within {
  border-color: var(--color-champagne-500);
}

.cd-archetype-card:nth-child(2):hover,
.cd-archetype-card:nth-child(2):focus-within {
  border-top-color: var(--color-oxblood-700);
}

.cd-card-number {
  color: var(--color-champagne-300);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
}

.cd-shelf {
  background: linear-gradient(180deg, var(--color-midnight-800), var(--color-obsidian-950));
}

.cd-shelf__intro {
  max-width: 40rem;
}

.cd-shelf__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-6);
}

.cd-dossier-card {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
}

.cd-dossier-card .media-frame {
  width: 100%;
}

.cd-dossier-card img {
  filter: saturate(0.86) contrast(1.04);
}

.cd-dossier-card .card__body {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--space-3);
}

.cd-dossier-card .card__body > * {
  min-width: 0;
  margin: 0;
}

.cd-dossier-card h3 {
  font-size: 1.7rem;
}

.cd-dossier-card .card__body > p:not(.meta) {
  color: var(--color-platinum-300);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.cd-preview-label {
  margin-top: auto !important;
  color: var(--color-platinum-300);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cd-method__intro {
  max-width: 42rem;
}

.cd-method__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
  margin-top: var(--space-6);
}

.cd-method-note {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  gap: var(--space-3);
  border-top: var(--border-subtle);
  padding-top: var(--space-4);
}

.cd-method-note > span,
.cd-method-note > div {
  min-width: 0;
}

.cd-method-note > span {
  color: var(--color-champagne-300);
  font-size: var(--text-sm);
  font-weight: 700;
}

.cd-method-note h3 {
  margin-bottom: var(--space-3);
}

.cd-method-note p {
  max-width: 28rem;
}

.cd-method-note__italic {
  margin-bottom: 0;
  color: var(--color-champagne-300);
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-style: italic;
  line-height: 1.2;
}

.cd-camera {
  padding-inline: 0;
}

.cd-camera__heading {
  width: 100%;
  max-width: 42rem;
  margin-bottom: var(--space-6);
}

.cd-camera__figure {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  width: 100%;
  min-width: 0;
  margin: 0;
  gap: var(--space-4);
}

.cd-camera__image {
  grid-column: 1 / -1;
  grid-row: 1;
  width: 100%;
  aspect-ratio: 2 / 1;
}

.cd-camera__image img {
  width: 100%;
  height: 100%;
  filter: saturate(0.88) contrast(1.04);
}

.cd-camera__annotations {
  display: contents;
}

.cd-camera__note {
  z-index: 1;
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-3);
  align-self: end;
  border: var(--border-subtle);
  background: rgba(18, 19, 24, 0.92);
  padding: var(--space-4);
}

.cd-camera__note > * {
  min-width: 0;
  margin: 0;
}

.cd-camera__note h3 {
  font-size: 1.55rem;
}

.cd-camera__note p:not(.cd-card-number) {
  color: var(--color-platinum-300);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.cd-camera__note:nth-child(1) {
  grid-column: 1 / span 4;
  grid-row: 1;
}

.cd-camera__note:nth-child(2) {
  grid-column: 5 / span 4;
  grid-row: 1;
}

.cd-camera__note:nth-child(3) {
  grid-column: 9 / span 4;
  grid-row: 1;
}

.cd-camera__figure figcaption {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 32rem;
  margin: 0;
}

.cd-watchlist__intro {
  max-width: 38rem;
}

.cd-watchlist__list {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  margin-top: var(--space-6);
}

.cd-watchlist-row {
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 13.75rem) minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  gap: var(--space-4);
  border-top: var(--border-subtle);
  padding-block: var(--space-5);
}

.cd-watchlist-row > * {
  min-width: 0;
  margin: 0;
}

.cd-watchlist-row__number {
  color: var(--color-champagne-300);
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
}

.cd-watchlist-row__meta h3 {
  margin-bottom: var(--space-2);
}

.cd-watchlist-row__meta p {
  color: var(--color-platinum-300);
  font-size: var(--text-sm);
  line-height: 1.5;
}

.cd-watchlist-row__copy {
  max-width: 44rem;
}

.cd-watchlist__action {
  margin-top: var(--space-5);
}

.cd-availability {
  background: var(--color-midnight-800);
}

.cd-availability__panel {
  display: grid;
  grid-template-columns: minmax(0, 2fr) max-content;
  width: min(100%, 47.5rem);
  min-width: 0;
  align-items: end;
  gap: var(--space-6);
  border: var(--border-subtle);
  border-radius: var(--radius-panel);
  padding: var(--space-6);
}

.cd-availability__copy {
  width: 100%;
  max-width: 42rem;
}

.cd-availability__copy .status {
  margin-bottom: var(--space-4);
}

.cd-availability__copy h3 {
  font-size: 1.5rem;
}

.cd-availability__support {
  margin-bottom: 0;
  color: var(--color-platinum-300);
  font-size: var(--text-sm);
}

.cd-availability__action {
  width: max-content;
}

.cd-availability__action .button {
  width: max-content;
  white-space: nowrap;
}

.cd-continue__intro {
  max-width: 36rem;
}

.cd-continue__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-6);
}

.cd-continue-card {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-3);
  border-top: 1px solid var(--color-champagne-500);
  border-bottom: var(--border-subtle);
  padding: var(--space-5) 0;
  transition: border-color var(--transition-fast);
}

.cd-continue-card > * {
  min-width: 0;
  margin: 0;
}

.cd-continue-card p:not(.cd-card-number) {
  color: var(--color-platinum-300);
}

.cd-continue-card a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  margin-top: auto;
  font-weight: 700;
}

.cd-continue-card:hover,
.cd-continue-card:focus-within {
  border-bottom-color: var(--color-oxblood-700);
}

.cd-closing {
  padding-block: var(--space-10) !important;
}

.cd-closing__content {
  display: flex;
  width: 100%;
  max-width: 34rem;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  margin-inline: auto;
  border-top: 1px solid var(--color-champagne-500);
  padding-top: var(--space-5);
  text-align: center;
}

.cd-closing__content > * {
  min-width: 0;
  margin: 0;
}

.cd-closing__content h2 {
  font-size: clamp(2rem, 4vw, 3.25rem);
}

.cd-closing__content p:not(.eyebrow) {
  color: var(--color-platinum-300);
  font-family: var(--font-heading);
  font-size: 1.4rem;
  font-style: italic;
  line-height: 1.35;
}

@media (max-width: 1119px) {
  .cd-shelf__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cd-camera__figure {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cd-camera__image {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .cd-camera__annotations {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }

  .cd-camera__note:nth-child(n) {
    grid-column: auto;
    grid-row: auto;
  }

  .cd-camera__figure figcaption {
    grid-row: 3;
  }
}

@media (max-width: 1089px) {
  .cd-archetypes__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1023px) {
  .cd-feature__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .cd-feature__reading {
    max-width: 47.5rem;
  }

  .cd-feature__rail {
    display: grid;
    grid-template-columns: minmax(0, 17.5rem) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-6);
  }
}

@media (max-width: 899px) {
  .character-dossiers-page section {
    padding-block: var(--space-8);
  }

  .cd-entrance__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .cd-entrance__copy {
    max-width: 40rem;
  }

  .cd-entrance__media {
    aspect-ratio: 16 / 10;
  }

  .cd-method__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cd-watchlist-row {
    grid-template-columns: 4.5rem minmax(0, 1fr);
    gap: var(--space-3) var(--space-4);
  }

  .cd-watchlist-row__copy {
    grid-column: 2;
    max-width: 44rem;
  }

  .cd-continue__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cd-continue-card:nth-child(3) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 759px) {
  .cd-feature__rail {
    grid-template-columns: minmax(0, 1fr);
  }

  .cd-feature__plate {
    max-width: 30rem;
  }
}

@media (max-width: 699px) {
  .character-dossiers-page section {
    padding-block: var(--space-7);
  }

  .cd-entrance {
    padding-block-start: var(--space-7) !important;
  }

  .cd-entrance__media {
    aspect-ratio: 16 / 10;
  }

  .cd-entrance__standfirst,
  .cd-entrance__support {
    max-width: none;
  }

  .cd-analysis-unit {
    margin-bottom: var(--space-6);
  }

  .cd-analysis-unit h3 {
    grid-template-columns: 1.75rem minmax(0, 1fr);
    gap: var(--space-2);
  }

  .cd-analysis-unit--ruled {
    padding-inline-start: var(--space-3);
  }

  .cd-archetypes__grid,
  .cd-shelf__grid,
  .cd-continue__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cd-archetype-card,
  .cd-continue-card {
    padding: var(--space-4);
  }

  .cd-continue-card:nth-child(3) {
    grid-column: auto;
  }

  .cd-shelf__grid {
    gap: var(--space-4);
  }

  .cd-method__grid {
    gap: var(--space-5);
  }

  .cd-method-note {
    grid-template-columns: 2rem minmax(0, 1fr);
  }

  .cd-camera__figure {
    grid-template-columns: minmax(0, 1fr);
  }

  .cd-camera__image {
    grid-column: 1;
    aspect-ratio: 4 / 5;
  }

  .cd-camera__image img {
    object-position: center center;
  }

  .cd-camera__annotations {
    grid-column: 1;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
  }

  .cd-camera__figure figcaption {
    grid-column: 1;
  }

  .cd-watchlist-row {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
  }

  .cd-watchlist-row__copy {
    grid-column: auto;
  }

  .cd-watchlist-row__number {
    font-size: 1.5rem;
  }

  .cd-availability__panel {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-5);
    padding: var(--space-5);
  }

  .cd-availability__action,
  .cd-availability__action .button {
    width: 100%;
  }

  .cd-closing {
    padding-block: var(--space-8) !important;
  }
}

@media (max-width: 389px) {
  .cd-closing__content .button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .cd-camera__image {
    opacity: 0.78;
    transform: translateY(10px);
    transition: opacity var(--transition-drawer), transform var(--transition-drawer);
  }

  .cd-camera__image.cd-is-revealed {
    opacity: 1;
    transform: translateY(0);
  }
}