.puzzle-page {
  overflow: clip;
  background: var(--color-space-canvas);
}

.puzzle-page .puzzle-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  color: var(--color-muted-silver);
  font-family: var(--font-mono);
  font-size: var(--text-meta);
  letter-spacing: 0.08em;
  line-height: var(--leading-meta);
  text-transform: uppercase;
}

.puzzle-page .puzzle-kicker::after {
  width: 4rem;
  height: 1px;
  background: var(--color-frame-line);
  content: "";
}

.puzzle-page .puzzle-kicker span { color: var(--color-alien-violet); }
.puzzle-page .puzzle-text-link { font-weight: 650; }

.puzzle-hero {
  position: relative;
  isolation: isolate;
  min-height: 35rem;
  padding-block: var(--space-9);
}

.puzzle-hero__image,
.puzzle-hero__image::after {
  position: absolute;
  inset: 0;
}

.puzzle-hero__image { z-index: -2; }
.puzzle-hero__image::after { z-index: 1; background: linear-gradient(90deg, rgba(15,13,27,.96) 0%, rgba(15,13,27,.82) 50%, rgba(15,13,27,.42) 100%); content: ""; }
.puzzle-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: center right; }
.puzzle-hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); min-width: 0; }
.puzzle-hero__copy { grid-column: 1; width: 100%; max-width: 40.625rem; min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.puzzle-hero__copy > * { min-width: 0; margin: 0; }
.puzzle-hero__copy h1 { font-size: clamp(2.5rem, 5.3vw, 4rem); }
.puzzle-hero__copy .lead { max-width: 38.75rem; }
.puzzle-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); min-width: 0; }
.puzzle-hero__actions > * { min-width: 0; }
.puzzle-hero__note { max-width: 35rem; color: var(--color-muted-silver); font-size: var(--text-caption); }

.puzzle-section-intro { width: 100%; max-width: 42.5rem; min-width: 0; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-section-intro > * { margin: 0; min-width: 0; }
.puzzle-signal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); min-width: 0; margin-top: var(--space-7); }
.puzzle-signal-grid > * { min-width: 0; width: 100%; }
.puzzle-signal-record { min-height: 12rem; display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--space-4); align-items: start; border-top: 1px solid var(--color-frame-line); padding-top: var(--space-4); transition: border-color var(--transition-fast), transform var(--transition-fast); }
.puzzle-signal-record--offset { margin-top: var(--space-5); }
.puzzle-signal-record:hover { border-color: var(--color-alien-violet); transform: translate(1px, 1px); }
.puzzle-signal-record__number { width: 3.25rem; height: 3.25rem; min-height: 3.25rem; color: var(--color-alien-violet); font-family: var(--font-mono); font-size: var(--text-small); }
.puzzle-signal-record__content { min-width: 0; }
.puzzle-signal-record__content > :last-child { margin-bottom: 0; }
.puzzle-observation-callout { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-3); max-width: 48rem; margin-top: var(--space-6); border-left: 2px solid var(--color-warning-amber); padding: var(--space-4) var(--space-5); background: rgba(31,27,44,.55); }
.puzzle-observation-callout strong { color: var(--color-warning-amber); }
.puzzle-observation-callout span { min-width: 0; color: var(--color-steel-silver); }

.puzzle-machine__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(23.75rem, 5fr); gap: var(--space-7); align-items: start; min-width: 0; }
.puzzle-machine__grid > * { min-width: 0; width: 100%; }
.puzzle-machine__copy { max-width: 43.75rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-machine__copy > * { min-width: 0; margin: 0; }
.puzzle-question-list { width: 100%; max-width: 32.5rem; display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-2); }
.puzzle-question-list > div { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); align-items: center; min-width: 0; }
.puzzle-question-list .inventory-slot { width: 2.75rem; height: 2.75rem; min-height: 2.75rem; color: var(--color-muted-silver); font-family: var(--font-mono); font-size: var(--text-caption); }
.puzzle-question-list p { margin: 0; }
.puzzle-machine__media { max-width: 100%; margin: 0; }
.puzzle-machine__media img { width: 100%; max-width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; border: 1px solid var(--color-frame-line); box-shadow: var(--shadow-offset); }
.puzzle-machine__media figcaption { max-width: 28rem; border-top: 1px solid var(--color-alien-violet); padding-top: var(--space-3); }

.puzzle-index__intro { width: 100%; max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-index__intro > * { margin: 0; }
.puzzle-record-list { display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-6); }
.puzzle-record-list > * { width: 100%; min-width: 0; }
.puzzle-role-record { display: grid; grid-template-columns: 4.75rem minmax(0, 1fr) 11.875rem; gap: var(--space-5); align-items: start; border: 1px solid var(--color-frame-line); background: rgba(31,27,44,.68); padding: var(--space-5); box-shadow: var(--shadow-inset); transition: border-color var(--transition-fast); }
.puzzle-role-record:hover { border-color: var(--color-alien-violet); }
.puzzle-role-record > * { min-width: 0; }
.puzzle-role-record__index { color: var(--color-alien-violet); font-family: var(--font-mono); font-size: 1.25rem; line-height: 1; }
.puzzle-role-record__body { max-width: 42.5rem; }
.puzzle-role-record__body > :last-child { margin-bottom: 0; }
.puzzle-role-record__meta { margin: 0; color: var(--color-muted-silver); font-family: var(--font-mono); font-size: var(--text-meta); letter-spacing: .08em; line-height: 1.45; text-transform: uppercase; }
.puzzle-role-record__meta--warning { color: var(--color-warning-amber); }

.puzzle-method__heading { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-6); align-items: start; min-width: 0; }
.puzzle-method__heading > * { min-width: 0; }
.puzzle-method__heading > div { max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-method__heading > div > * { margin: 0; }
.puzzle-method__badge { justify-self: end; width: max-content; max-width: 100%; margin: 0; border: 1px solid var(--color-alien-violet); background: var(--color-violet-deep); padding: var(--space-2) var(--space-3); color: var(--color-steel-silver); font-family: var(--font-mono); font-size: var(--text-meta); letter-spacing: .08em; }
.puzzle-steps { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-6); }
.puzzle-steps > article { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: var(--space-5); min-width: 0; border-top: 1px solid var(--color-frame-line); padding-top: var(--space-4); }
.puzzle-steps > article > * { min-width: 0; }
.puzzle-steps > article > span { color: var(--color-alien-violet); font-family: var(--font-mono); font-size: 1.125rem; }
.puzzle-steps > article > div { width: 100%; max-width: 38.75rem; }
.puzzle-steps h3 { margin-bottom: var(--space-3); }
.puzzle-steps p { margin-bottom: var(--space-2); }
.puzzle-steps small { color: var(--color-muted-silver); font-family: var(--font-mono); letter-spacing: .08em; }
.puzzle-steps .puzzle-warning { color: var(--color-warning-amber); }

.puzzle-routes__grid { display: grid; grid-template-columns: minmax(25rem, 5fr) minmax(0, 7fr); gap: var(--space-7); align-items: start; min-width: 0; }
.puzzle-routes__grid > * { min-width: 0; width: 100%; }
.puzzle-routes__media { margin: 0; }
.puzzle-routes__media img { width: 100%; max-width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: center; border: 1px solid var(--color-frame-line); box-shadow: var(--shadow-offset); }
.puzzle-routes__media figcaption { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.puzzle-routes__media figcaption span { min-width: 0; color: var(--color-muted-silver); font-family: var(--font-mono); font-size: var(--text-meta); letter-spacing: .06em; }
.puzzle-routes__copy { max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-routes__copy > * { min-width: 0; margin: 0; }
.puzzle-route-questions { width: 100%; max-width: 35rem; display: flex; flex-direction: column; gap: var(--space-2); border-left: 1px solid var(--color-frame-line); padding-left: var(--space-4); }
.puzzle-route-questions p { margin: 0; color: var(--color-muted-silver); font-family: var(--font-mono); font-size: var(--text-caption); line-height: 1.55; }
.puzzle-routes__links { color: var(--color-muted-silver); }

.puzzle-checklist__intro { width: 100%; max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); border-left: 2px solid var(--color-warning-amber); padding-left: var(--space-4); }
.puzzle-checklist__intro > * { margin: 0; }
.puzzle-details-list { display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-6); }
.puzzle-details-list details { width: 100%; margin: 0; }
.puzzle-details-list summary { display: grid; grid-template-columns: 2.625rem minmax(0, 1fr); gap: var(--space-3); align-items: center; min-width: 0; list-style: none; }
.puzzle-details-list summary::-webkit-details-marker { display: none; }
.puzzle-details-list summary span { display: flex; align-items: center; justify-content: center; width: 2.625rem; min-height: 2.625rem; background: var(--color-violet-deep); color: var(--color-alien-violet); font-family: var(--font-mono); font-size: var(--text-caption); }
.puzzle-details-list details[open] { border-color: var(--color-alien-violet); }
.puzzle-details-list details[open] summary span { background: var(--color-alien-violet); color: var(--color-space-canvas); }
.puzzle-details-list details > p { width: calc(100% - 5.625rem); max-width: 41.25rem; margin: 0 var(--space-4) var(--space-4) 5.625rem; }

.puzzle-clues__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-7); align-items: start; min-width: 0; }
.puzzle-clues__grid > * { min-width: 0; }
.puzzle-clues__copy { width: 100%; max-width: 40.625rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-clues__copy > * { margin: 0; }
.puzzle-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); width: 100%; margin-top: var(--space-2); }
.puzzle-compare > * { min-width: 0; border-top: 1px solid var(--color-frame-line); padding-top: var(--space-3); }
.puzzle-compare > * > :last-child { margin-bottom: 0; }
.puzzle-clues__link { border-top: 1px solid var(--color-alien-violet); padding-top: var(--space-4); color: var(--color-muted-silver); }
.puzzle-clues__modules { display: flex; flex-direction: column; gap: var(--space-4); width: 100%; }
.puzzle-clues__modules .panel { width: 100%; }
.puzzle-clues__modules .panel > :last-child { margin-bottom: 0; }

.puzzle-reading__intro { width: 100%; max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); }
.puzzle-reading__intro > * { margin: 0; }
.puzzle-reading__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-5); margin-top: var(--space-6); min-width: 0; }
.puzzle-reading__grid > * { min-width: 0; }
.puzzle-reading-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--color-frame-line); background: var(--color-inventory-panel); padding: var(--space-5); box-shadow: var(--shadow-offset), var(--shadow-inset); text-decoration: none; transition: border-color var(--transition-fast), transform var(--transition-fast); }
.puzzle-reading-card:hover { border-color: var(--color-alien-violet); transform: translate(1px, 1px); }
.puzzle-reading-card > * { min-width: 0; }
.puzzle-reading-card h3 { margin-top: var(--space-4); }
.puzzle-reading-card p { max-width: 35rem; }
.puzzle-reading-card span { margin-top: auto; color: var(--color-alien-violet); font-family: var(--font-heading); font-weight: 650; }
.puzzle-reading-card--small { margin-top: var(--space-5); }
.puzzle-reading-card--band { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 5fr) minmax(0, 3fr); gap: var(--space-5); align-items: center; background: rgba(31,27,44,.52); }
.puzzle-reading-card--band h3 { margin: var(--space-2) 0 0; }
.puzzle-reading-card--band p { margin: 0; }
.puzzle-reading-card--band span { justify-self: end; margin: 0; }

.puzzle-closing { padding-top: var(--space-8); padding-bottom: var(--space-9); }
.puzzle-closing__grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(17.5rem, 4fr); gap: var(--space-7); align-items: start; min-width: 0; }
.puzzle-closing__grid > * { min-width: 0; }
.puzzle-closing__copy { max-width: 42.5rem; display: flex; flex-direction: column; gap: var(--space-4); border-top: 1px solid var(--color-alien-violet); padding-top: var(--space-4); }
.puzzle-closing__copy > * { margin: 0; }
.puzzle-closing__cta { display: flex; flex-direction: column; gap: var(--space-4); width: 100%; }
.puzzle-closing__cta > * { margin: 0; min-width: 0; }
.puzzle-closing__cta .button { width: 100%; }
.puzzle-closing__disclaimer { margin: var(--space-5) 0 0; border-top: 1px solid var(--color-frame-line); padding-top: var(--space-3); color: var(--color-muted-silver); font-size: var(--text-caption); }

@media (max-width: 61.25rem) {
  .puzzle-hero__image::after { background: linear-gradient(90deg, rgba(15,13,27,.96) 0%, rgba(15,13,27,.78) 68%, rgba(15,13,27,.72) 100%); }
  .puzzle-hero__copy { grid-column: 1 / span 2; max-width: 70%; }
}

@media (max-width: 58.125rem) {
  .puzzle-machine__grid, .puzzle-routes__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .puzzle-machine__media { max-width: 42.5rem; }
  .puzzle-routes__media { max-width: 45rem; }
  .puzzle-routes__media { grid-row: 1; }
  .puzzle-routes__copy { grid-row: 2; }
  .puzzle-clues__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .puzzle-clues__modules { max-width: 42.5rem; }
  .puzzle-reading__grid { grid-template-columns: minmax(0, 1fr); }
  .puzzle-reading-card--small { margin-top: 0; }
  .puzzle-reading-card--band { grid-column: 1; }
}

@media (max-width: 56.25rem) {
  .puzzle-signal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .puzzle-signal-record--offset { margin-top: 0; }
  .puzzle-role-record { grid-template-columns: 4.75rem minmax(0, 1fr); }
  .puzzle-role-record__meta { grid-column: 2; }
  .puzzle-method__heading { grid-template-columns: minmax(0, 1fr); }
  .puzzle-method__badge { justify-self: start; }
  .puzzle-closing__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .puzzle-closing__cta { max-width: 26.25rem; }
}

@media (max-width: 50rem) {
  .puzzle-details-list details > p { width: calc(100% - 3rem); margin-left: var(--space-4); }
  .puzzle-reading-card--band { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .puzzle-reading-card--band span { justify-self: start; }
}

@media (max-width: 47.5rem) {
  .puzzle-signal-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .puzzle-signal-record { min-height: 0; }
}

@media (max-width: 43.75rem) {
  .puzzle-steps > article { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .puzzle-steps > article > span { display: inline-flex; align-items: center; width: max-content; min-height: 2rem; background: var(--color-violet-deep); padding-inline: var(--space-2); font-size: var(--text-caption); }
  .puzzle-steps > article > div { max-width: none; }
}

@media (max-width: 40rem) {
  .puzzle-hero { min-height: 0; padding-block: var(--space-7); }
  .puzzle-hero__image { opacity: .18; }
  .puzzle-hero__image::after { background: rgba(15,13,27,.78); }
  .puzzle-hero__copy { max-width: 100%; }
  .puzzle-hero__copy h1 { font-size: clamp(2.125rem, 10vw, 2.5rem); }
  .puzzle-hero__actions { align-items: stretch; flex-direction: column; }
  .puzzle-hero__actions .button { width: 100%; }
  .puzzle-hero__actions .puzzle-text-link { width: max-content; max-width: 100%; }
  .puzzle-signal-record { grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); }
  .puzzle-signal-record__number { width: 2.75rem; height: 2.75rem; min-height: 2.75rem; }
  .puzzle-machine__media, .puzzle-routes__media { max-width: 100%; }
  .puzzle-role-record { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); padding: var(--space-4); }
  .puzzle-role-record__index { width: max-content; border: 1px solid var(--color-frame-line); padding: var(--space-2); }
  .puzzle-role-record__meta { grid-column: 1; }
  .puzzle-compare { grid-template-columns: minmax(0, 1fr); }
  .puzzle-routes__media figcaption { grid-template-columns: minmax(0, 1fr); }
  .puzzle-reading-card { padding: var(--space-4); }
}

@media (prefers-reduced-motion: reduce) {
  .puzzle-signal-record, .puzzle-reading-card { transition: none; }
}