.story-lockup {
  display: flex;
  align-items: baseline;
  gap: .8rem;
  margin-bottom: 1.1rem;
  text-transform: uppercase;
  font-family: Cinzel, serif;
  letter-spacing: .12em;
}
.story-lockup span { font-size: clamp(1rem, 1.5vw, 1.3rem); }
.story-lockup strong {
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  color: #fff;
  font-weight: 500;
}
.story-lockup small {
  font: 600 .58rem Manrope, sans-serif;
  letter-spacing: .18em;
  color: var(--gold);
}
.intro { max-width: 650px; }
.intro strong { font-weight: 500; color: #fff; }
.hotel-intro {
  max-width: 680px;
  color: var(--muted);
  margin-top: -.8rem;
}
.hotel-scroll {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.25rem 1.5rem;
  overflow: visible;
  padding: 0 6vw 2rem;
  scroll-snap-type: none;
}
.hotel-scroll figure {
  min-width: 0;
  scroll-snap-align: none;
}
.hotel-scroll img {
  aspect-ratio: 16 / 9;
}
.hotel-scroll figure:last-child {
  padding: .45rem;
  border: 1px solid rgba(181, 138, 72, .55);
  background: rgba(181, 138, 72, .045);
}
.hotel-scroll figure:last-child figcaption {
  color: var(--gold);
  padding: .8rem .35rem .2rem;
}
@media (max-width: 560px) {
  .story-lockup { align-items: flex-start; flex-direction: column; gap: .1rem; }
  .story-lockup small { margin-top: .25rem; }
}

.book-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin: 2rem 0 1.5rem; }
.book-actions > * { min-height: 3.2rem; padding: .9rem 1.2rem; border: 1px solid var(--gold); font: 600 .67rem Manrope, sans-serif; letter-spacing: .15em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .25s ease, color .25s ease, border-color .25s ease; }
.read-chapter { background: var(--gold); color: #0b0d0b; }
.read-chapter:hover { background: #d2b173; }
.buy-paperback { display: inline-flex; align-items: center; gap: .55rem; background: transparent; color: var(--paper); }
.buy-paperback:hover { background: rgba(181,138,72,.12); }
.reader-dialog { width: min(980px, 94vw); height: min(900px, 92vh); max-height: 92vh; padding: 0; border: 1px solid rgba(181,138,72,.62); background: #f1ecdf; color: #211c14; overflow: hidden; box-shadow: 0 35px 110px rgba(0,0,0,.82); }
.reader-dialog[open] { display: grid; grid-template-rows: auto 1fr auto; animation: character-in .35s ease both; }
.reader-dialog::backdrop { background: rgba(2,3,2,.9); backdrop-filter: blur(10px); }
.reader-bar { position: absolute; z-index: 5; top: 0; left: 0; width: 100%; height: 3px; background: rgba(33,28,20,.1); }
.reader-bar span { display: block; width: 0; height: 100%; background: var(--gold); transition: width .1s linear; }
.reader-header { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.15rem 1.4rem 1rem; border-bottom: 1px solid rgba(33,28,20,.14); background: rgba(242,240,232,.97); }
.reader-header p { margin: 0 0 .25rem; font: 600 .55rem Manrope, sans-serif; letter-spacing: .19em; text-transform: uppercase; color: #8c6734; }
.reader-header h2 { margin: 0; font: 500 1rem Cinzel, serif; letter-spacing: .08em; text-transform: uppercase; }
.reader-close { width: 2.6rem; height: 2.6rem; border: 1px solid rgba(33,28,20,.25); border-radius: 50%; background: transparent; color: #211c14; font-size: 1.7rem; line-height: 1; cursor: pointer; }
.reader-frame { display: block; width: 100%; height: 100%; border: 0; background: #f1ecdf; }
.reader-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1.4rem; border-top: 1px solid rgba(33,28,20,.14); background: #e8e0d0; }
.reader-footer p { margin: 0; font: 500 .75rem Cinzel, serif; text-transform: uppercase; letter-spacing: .1em; }
.reader-footer a { padding: .75rem 1rem; background: #211c14; color: #fff; text-decoration: none; font: 600 .58rem Manrope, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
body.reader-open { overflow: hidden; }
@media (max-width: 560px) {
  .book-actions { flex-direction: column; }
  .book-actions > * { width: 100%; justify-content: center; text-align: center; }
  .reader-dialog { width: 100vw; height: 100dvh; max-height: 100dvh; border: 0; }
  .reader-header { padding: 1rem; }
  .reader-footer { padding: .75rem 1rem; }
  .reader-footer p { display: none; }
  .reader-footer a { width: 100%; text-align: center; }
}

.section-note {
  width: min(360px, 100%);
  margin: 0 0 1rem;
  color: var(--muted);
  font-family: Cinzel, serif;
  font-size: 1rem;
}
.character-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.character-open { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.character-open img { inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.character-open:focus-visible { outline: 2px solid var(--gold); outline-offset: -5px; }
.character .character-copy { position: absolute; z-index: 2; left: 2rem; right: 2rem; bottom: 2rem; display: block; }
.character .character-copy > span { display: block; font-size: .68rem; letter-spacing: .18em; color: var(--gold); text-transform: uppercase; }
.character .character-copy strong { display: block; font: 500 2rem/1.1 Cinzel, serif; text-transform: uppercase; margin: .35rem 0; }
.character .character-copy small { display: block; margin-top: .85rem; color: #d4ccbf; font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; opacity: 0; transform: translateY(7px); transition: .35s ease; }
.character:hover .character-copy small, .character-open:focus-visible .character-copy small { opacity: 1; transform: none; }
.character:nth-child(1) img { object-position: center 24%; }
.character:nth-child(2) img { object-position: center 20%; }
.character:nth-child(3) img { object-position: center 18%; }
.character:nth-child(4) img { object-position: center 17%; }
.character:nth-child(5) img { object-position: center 18%; }
.character:nth-child(6) img { object-position: center 16%; }
.character-archive { grid-column: 2; }
.character-archive img { filter: grayscale(1) contrast(1.05); }

.character-dialog { width: min(1040px, 92vw); max-height: 88vh; padding: 0; border: 1px solid rgba(181,138,72,.5); background: #0d100d; color: var(--paper); overflow: hidden; grid-template-columns: minmax(300px,.8fr) minmax(360px,1.2fr); box-shadow: 0 35px 100px rgba(0,0,0,.75); }
.character-dialog[open] { display: grid; animation: character-in .35s ease both; }
.character-dialog::backdrop { background: rgba(2,3,2,.88); backdrop-filter: blur(8px); }
.character-dialog-image { min-height: 650px; overflow: hidden; background: #171a16; }
.character-dialog-image img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.72); }
.character-dialog-copy { padding: clamp(3rem,6vw,6rem); display: flex; flex-direction: column; justify-content: center; }
.character-dialog-copy h2 { margin: 0 0 2rem; font: 500 clamp(2.7rem,5vw,5rem)/1 Cinzel, serif; text-transform: uppercase; }
.character-dialog.long-name .character-dialog-copy h2 { font-size: clamp(2.35rem, 3.65vw, 3.85rem); line-height: 1.02; overflow-wrap: normal; }
.character-dialog-copy > p:not(.chapter,.character-detail) { margin: 0; color: #c5bdb1; font-size: 1.05rem; line-height: 1.85; }
.character-detail { margin: 2rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--line); color: var(--gold); font: 500 .85rem/1.7 Cinzel, serif; letter-spacing: .05em; }
.character-close { position: absolute; z-index: 3; top: 1rem; right: 1rem; width: 2.7rem; height: 2.7rem; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; background: rgba(6,8,6,.72); color: #fff; font-size: 1.7rem; line-height: 1; cursor: pointer; }
body.profile-open { overflow: hidden; }
@keyframes character-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }

.world-gallery { padding: 10rem 5vw; background: #0d100d; }
.world-heading { display: grid; grid-template-columns: .65fr 1.35fr; gap: 4rem; align-items: end; margin-bottom: 4rem; }
.world-heading h2 { margin: 0; max-width: 900px; font: 500 clamp(2.5rem, 5vw, 5.4rem)/1.05 Cinzel, serif; text-transform: uppercase; letter-spacing: -.03em; }
.world-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.world-card { position: relative; min-height: 510px; margin: 0; overflow: hidden; background: #151914; }
.world-card-wide { grid-column: 1 / -1; min-height: 620px; }
.world-card img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; filter: saturate(.74) contrast(1.03); transition: transform .8s ease, filter .8s ease; }
.world-card:hover img { transform: scale(1.02); filter: saturate(.9) contrast(1.03); }
.world-card:after { content: ""; position: absolute; inset: 48% 0 0; background: linear-gradient(transparent, rgba(4,5,4,.92)); }
.world-card figcaption { position: absolute; z-index: 2; left: 2rem; right: 2rem; bottom: 1.8rem; display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 0; }
.world-card figcaption strong { color: var(--paper); font: 500 1.5rem Cinzel, serif; text-transform: uppercase; }
.world-card figcaption span { color: #b9b1a5; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; text-align: right; }

@media (max-width: 900px) {
  .hotel-scroll { grid-template-columns: 1fr; gap: 2rem; overflow: visible; }
  .character-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .character-archive { grid-column: auto; }
  .character-dialog[open] { display: block; overflow-y: auto; }
  .character-dialog-image { min-height: 52vh; height: 52vh; }
  .character-dialog-copy { padding: 3rem 7vw 4rem; }
  .character-dialog.long-name .character-dialog-copy h2 { font-size: clamp(2.25rem, 7vw, 3.5rem); }
  .world-heading { grid-template-columns: 1fr; gap: 1rem; }
  .world-card, .world-card-wide { min-height: 500px; }
}
@media (max-width: 560px) {
  .character-grid, .world-grid { grid-template-columns: 1fr; }
  .world-gallery { padding: 7rem 5vw; }
  .world-card-wide { grid-column: auto; }
  .world-card, .world-card-wide { min-height: 430px; }
  .world-card figcaption { align-items: flex-start; flex-direction: column; left: 1.4rem; right: 1.4rem; bottom: 1.4rem; }
  .world-card figcaption span { text-align: left; }
  .character .character-copy small { opacity: 1; transform: none; }
  .character-dialog { width: 94vw; max-height: 90vh; }
  .character-dialog-image { min-height: 44vh; height: 44vh; }
}
