.chapter {
  --space: clamp(62px, 6.7vw, 125px);
  padding-block: var(--space);
  border-top: 1px solid var(--rule);
}
.chapter:focus { outline: none; }
.section-index, .mission-label, .scanner-head, .scanner-foot > span, .club-frame figcaption,
.poster-top, .ticket-label, .ticket-head small, .pass-stub b {
  font: 600 11px/1.45 var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
}
.section-index { display: flex; gap: 12px; align-items: center; color: #c9bdd7; margin-bottom: 26px; }
.section-index b { padding: 3px 7px; color: #d4b1ff; border: 1px solid #775a92; font-weight: inherit; }
.chapter h2 {
  font: 800 clamp(34px, 4.4vw, 81px)/1.06 var(--display);
  letter-spacing: -.065em;
  text-transform: uppercase;
  margin: 0;
}
.chapter h2 em { display: inline-block; font-style: normal; color: #c29aff; transform: skewX(-8deg); transform-origin: left bottom; }
.chapter-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: clamp(28px, 3vw, 56px); }
.chapter-head p, .chapter-text, .briefing p {
  color: var(--muted);
  font-size: clamp(15px, 1.14vw, 20px);
  line-height: 1.6;
  text-wrap: pretty;
  margin: 0;
}
.chapter-head p { max-width: 355px; }
.posters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 28px); }
.poster {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: clamp(16px, 1.65vw, 30px); text-align: left; aspect-ratio: .89;
  border-radius: 4px; border: 1px solid #55475a; background: #231b2a;
}
.poster img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.2,.65,.2,1); }
.poster::after { position: absolute; inset: 0; content: ""; z-index: -1; background: linear-gradient(0deg,#08070df0,transparent 43%),linear-gradient(180deg,#08070d8c,transparent 25%); }
.poster:hover img, .poster:focus-visible img { transform: scale(1.05); }
.poster-top,.poster-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; }
.poster-top i { font-style: normal; font-size: 10px; border: 1px solid #ffffff65; padding: 5px 8px; background: #0a081164; }
.poster-top small { font-size: 10px; text-shadow: 0 1px 3px #000; }
.poster-foot { align-items: end; }
.poster-name { font: 650 clamp(18px, 2.02vw, 38px)/1.12 var(--display); letter-spacing: -.055em; }
.poster-arrow { display: grid; place-items: center; width: 37px; height: 37px; flex: none; border-radius: 50%; border: 1px solid #dbd0df85; transition: background .2s,color .2s; }
.poster-arrow .icon { width: 16px; }
.poster:hover .poster-arrow, .poster:focus-visible .poster-arrow { background: #ecd9ff; color: #211329; }
.split,.pass-layout { display: grid; align-items: center; gap: clamp(32px, 5.4vw, 100px); }
.club { background: #100c15; }
.club-layout { grid-template-columns: 1.16fr 1fr; }
.club-frame { margin: 0; position: relative; min-width: 0; overflow: hidden; border: 1px solid var(--rule); border-radius: 3px; }
.club-frame img { display: block; width: 100%; height: 100%; aspect-ratio: 1.24; object-fit: cover; object-position: 49% center; }
.club-frame figcaption { position: absolute; display: flex; justify-content: space-between; align-items: end; inset: auto 0 0; padding: 37px 18px 15px; background: linear-gradient(0deg,#0c0716de,transparent); font-size: 9px; }
.club-frame figcaption i, .scanner-head i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #d7ffa8; margin-right: 6px; box-shadow: 0 0 10px #bbff9280; }
.chapter-intro { font-size: clamp(18px,1.55vw,26px); line-height: 1.45; letter-spacing: -.025em; margin: 25px 0 12px; text-wrap: pretty; }
.text-link { display: inline-flex; align-items: center; gap: 13px; min-height: 44px; margin-top: 18px; color: #d7b7ff; text-decoration: none; font-size: 14px; font-weight: 600; }
.text-link .icon { width: 17px; transition: transform .2s; }
.text-link:hover .icon { transform: translateX(4px); }
.crew-layout { grid-template-columns: .9fr 1.1fr; }
.crew-copy .chapter-text, .pass-copy .chapter-text { margin: 22px 0; max-width: 455px; }
.crew-controls { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; max-width: 360px; }
.crew-controls button { min-height: 44px; border: 1px solid #51415e; border-radius: 3px; font: 600 15px var(--display); }
.crew-controls button:hover { border-color: #c29aff; }
.crew-controls button[aria-pressed="true"] { background: #c39bff; color: #1b1025; border-color: #c39bff; }
.mission-label { display: block; margin: 24px 0 8px; color: #bdaacc; font-size: 10px; }
#crew-mission { display: block; width: min(100%,360px); min-height: 44px; padding: 7px 12px; border-radius: 3px; border: 1px solid #51415e; background: #19131f; color: #fff; font: 15px Golos, sans-serif; }
#crew-mission:focus-visible, #plan-fallback:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.scanner {
  position: relative; isolation: isolate; display: grid; place-items: center; overflow: hidden;
  min-width: 0; padding: 36px 0; border: 1px solid #574565; border-radius: 4px;
  background: radial-gradient(ellipse at 50% 52%, #30203e99, transparent 69%), linear-gradient(#b090dc0c 1px,transparent 1px), linear-gradient(90deg,#b090dc0c 1px,transparent 1px), #120e18;
  background-size: auto, 23px 23px, 23px 23px, auto;
}
.scanner-head,.scanner-foot { position: absolute; left: 20px; right: 20px; display: flex; align-items: center; justify-content: space-between; }
.scanner-head { top: 17px; font-size: 9px; color: #e0d0e9; }
.scanner-foot { bottom: 15px; color: #cfb7e0; }
.scanner-foot > span { font-size: 9px; }
.scanner-foot strong { font: 580 clamp(16px,1.4vw,25px) var(--display); }
.radar {
  width: min(64%,355px); aspect-ratio: 1; border-radius: 50%; position: relative; overflow: hidden;
  border: 1px solid #aa8cbe75;
  background: repeating-radial-gradient(circle,transparent 0 calc(16.66% - 1px),#b18fcd47 calc(16.66% - 1px) 16.66%);
}
.radar-axis::before,.radar-axis::after { content: ""; position: absolute; background: #b595d245; }
.radar-axis::before { top: 50%; left: 0; right: 0; height: 1px; }
.radar-axis::after { left: 50%; top: 0; bottom: 0; width: 1px; }
.sweep { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from 20deg, transparent 0 285deg, #ac6dff06 297deg, #c68aff57 358deg, #e4c4ffb8 359.5deg, transparent 360deg); }
.blip { position: absolute; top: var(--y); left: var(--x); width: 7px; height: 7px; border-radius: 50%; background: #f5ddff; box-shadow: 0 0 12px #d59eff; }
.blip::after { content: ""; position: absolute; inset: -4px; border: 1px solid #ce98fd80; border-radius: 50%; }
.blip b { position: absolute; left: 12px; top: -4px; font: 10px var(--mono); color: #e3cdee; }
.visit { background: #100d15; }
.briefing { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(22px,3.7vw,75px); list-style: none; margin: 0; padding: 0; }
.briefing li { position: relative; border-top: 1px solid #5c486b; padding-top: 20px; }
.briefing li::before { position: absolute; content: ""; width: 28px; height: 3px; background: #c194ff; top: -2px; }
.step-index { font: 560 clamp(28px,3.1vw,58px)/1 var(--display); letter-spacing: -.1em; color: #b28dd5; }
.briefing h3 { font: 600 clamp(16px,1.35vw,25px)/1.3 var(--display); letter-spacing: -.045em; margin: 18px 0 10px; }
.briefing p { font-size: clamp(14px,1.06vw,18px); }
.pass { background: radial-gradient(ellipse at 81% 51%,#392044aa,transparent 55%),#110c18; padding-bottom: 0; }
.pass-layout { grid-template-columns: .9fr 1.1fr; }
.pass-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 20px; }
.pass-actions .text-link { margin: 0; }
.mission-pass {
  --stub: clamp(42px,4.8vw,86px);
  display: grid; grid-template-columns: minmax(0,1fr) var(--stub); align-items: stretch;
  background: linear-gradient(112deg,#e7d8ff,#c1a0f4 70%,#ae82eb);
  border-radius: 6px; color: #251632; transform: rotate(-2deg);
  mask: radial-gradient(circle 12px at calc(100% - var(--stub)) 0,transparent 97%,#000) top/100% 51% no-repeat, radial-gradient(circle 12px at calc(100% - var(--stub)) 100%,transparent 97%,#000) bottom/100% 51% no-repeat;
}
.pass-main { padding: clamp(20px,2.7vw,49px); }
.ticket-head { display: flex; gap: 12px; align-items: center; border-bottom: 1px solid #38244061; padding-bottom: 15px; margin-bottom: clamp(18px,2.8vw,45px); }
.ticket-head strong { font: italic 850 25px/1 var(--display); letter-spacing: -.09em; }
.ticket-head small,.ticket-label { font-size: 9px; }
.mission-pass h3 { margin: 6px 0 20px; font: 720 clamp(19px,2.3vw,40px)/1.12 var(--display); letter-spacing: -.065em; }
.mission-pass dl { margin: 0; display: flex; gap: 30px; }
.mission-pass dt { font-size: 12px; opacity: .8; }.mission-pass dd { font-weight: 650; margin: 2px 0 0; }
.pass-stub { border-left: 2px dashed #553d6755; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 20px 0; }
.pass-stub b { writing-mode: vertical-rl; font-size: 9px; }
.pass-stub i { width: 42%; height: 42%; background: repeating-linear-gradient(0deg,#301e3f 0 2px,transparent 2px 4px,#301e3f 4px 5px,transparent 5px 8px,#301e3f 8px 11px,transparent 11px 14px); }
.copy-status { font-size: 13px; min-height: 1.45em; color: #dec4ff; margin: 9px 0 0; }
#plan-fallback { display: block; width: 100%; height: 105px; font: 14px/1.5 Golos,sans-serif; border: 1px solid var(--accent); background: #16101d; color: white; padding: 9px; }
#plan-fallback[hidden] { display: none; }
.closing-line { border-top: 1px solid var(--rule); margin-top: clamp(45px,6vw,105px); min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: #c2b1cb; font-size: 12px; }
.closing-line a { display: inline-flex; align-items: center; min-height: 44px; color: #e9d8fa; text-decoration: none; }
@media (prefers-reduced-motion:no-preference) {
  .crew.in-view .sweep { animation: radar-scan 6s linear infinite; }
  .in-view .section-index { animation: arrive .48s ease-out; }
  .in-view .briefing li::before { animation: trace-route 1s ease-out both; transform-origin: left; }
  .briefing li:nth-child(2)::before { animation-delay: .12s; }
  .briefing li:nth-child(3)::before { animation-delay: .24s; }
}
@keyframes radar-scan { to { transform: rotate(1turn); } }
@keyframes trace-route { from { transform: scaleX(0); } }
@media (max-width:850px) {
  .chapter-head p { max-width: 275px; }
  .split,.pass-layout { gap: 28px; }
  .club-layout,.crew-layout,.pass-layout { grid-template-columns: 1fr 1fr; }
  .poster-arrow { width: 29px; height: 29px; }
}
@media (max-width:700px) {
  .chapter { --space: 56px; }
  .chapter h2 { font-size: clamp(31px,8.1vw,48px); }
  .section-index { margin-bottom: 18px; font-size: 10px; }
  .chapter-head { display: grid; gap: 15px; margin-bottom: 23px; }
  .chapter-head p { max-width: 450px; }
  .posters { grid-template-columns: 1fr; gap: 13px; }
  .poster { aspect-ratio: 1.62; padding: 15px; }
  .poster img { object-position: 50% 57%; }
  .poster-name { font-size: clamp(23px,5.6vw,30px); }
  .poster-arrow { width: 34px; height: 34px; }
  .club-layout,.crew-layout,.pass-layout { grid-template-columns: minmax(0,1fr); }
  .club-copy { grid-row: 1; }.club-frame img { aspect-ratio: 1.5; }
  .chapter-intro { margin-top: 18px; }
  .crew-copy .chapter-text,.pass-copy .chapter-text { margin: 15px 0 21px; }
  .crew .text-link { margin-top: 10px; }
  .scanner { padding-block: 39px; }
  .radar { width: min(63%,265px); }
  .briefing { grid-template-columns: 1fr; gap: 19px; }
  .briefing li { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 6px 10px; padding-top: 17px; }
  .briefing h3 { margin: 0; align-self: center; font-size: 18px; }
  .briefing p { grid-column: 2; }
  .pass-layout { gap: 18px; }
  .mission-pass { margin-inline: 3px; }
  .closing-line { font-size: 10px; min-height: 57px; }
}