/* ============ Hikâye sahneleri: yazılan sayfa, mektup, yakınlaşan resim ============ */
.ink-cur { display: inline-block; width: 2px; height: 1em; margin-left: 1px; background: #6b4a2b; vertical-align: -2px; animation: blinkCur .8s steps(1) infinite; }
@keyframes blinkCur { 50% { opacity: 0; } }

/* Ken Burns: hikâyenin resmine yavaş yakınlaşma */
.cinema { position: absolute; inset: 0; z-index: 7; opacity: 0; overflow: hidden; }
.cinema img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cinema .cap {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 14px 12px; text-align: center;
  font-family: Georgia, serif; font-style: italic; font-size: clamp(12px, 1.25vw, 15px); line-height: 1.45; color: #fff4dc;
  background: linear-gradient(transparent, rgba(18, 16, 24, .82)); text-shadow: 0 1px 4px #000; min-height: 3.4em;
}
.cinema .cap .ink-cur { background: #fff4dc; }

/* Sandıktan çıkan mektup */
.letter-fx { position: absolute; inset: 0; z-index: 8; pointer-events: none; perspective: 700px; }
.letter-fx .env { position: absolute; left: 50%; bottom: 10%; width: 30%; aspect-ratio: 1.55; opacity: 0; background: linear-gradient(160deg, #efe0bd, #d9c08e); border: 1px solid #8a6a42; border-radius: 3px; box-shadow: 0 8px 18px rgba(0,0,0,.35); }
.letter-fx .env::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to top right, transparent 49%, rgba(138,106,66,.35) 50%, transparent 51%), linear-gradient(to top left, transparent 49%, rgba(138,106,66,.35) 50%, transparent 51%); }
.letter-fx .flap { position: absolute; left: 0; right: 0; top: 0; height: 55%; transform-origin: top center; background: #e4cf9f; clip-path: polygon(0 0, 100% 0, 50% 100%); border-top: 1px solid #8a6a42; }
.letter-fx .flap::after { content: ''; position: absolute; left: 50%; top: 52%; width: 22%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(#d0605a, #8f2c2a); }
.letter-fx .paper { position: absolute; left: 50%; top: 6%; width: 56%; opacity: 0; background: #fbf3df; border: 1px solid #c9b08a; border-radius: 3px; box-shadow: 0 12px 26px rgba(0,0,0,.4); padding: 4% 5%;
  background-image: repeating-linear-gradient(transparent 0 1.45em, rgba(160,120,60,.18) 1.45em calc(1.45em + 1px)); }
.letter-fx .txt { font-family: 'Caveat', 'Segoe Print', cursive; font-size: clamp(13px, 1.5vw, 19px); line-height: 1.45em; color: #4a3220; min-height: 4.4em; }

/* Raftan çıkan kitabın iç sayfası el yazısı */
.flybook .pg { font-size: clamp(11px, 1.3vw, 16px); }
.pic.chained > img { filter: grayscale(.55) brightness(.72); }
.pic > img { transition: filter 1.4s ease, opacity 1.2s ease; }
.page:has(.inline-task) > .stamp { display: none; }

/* Baştan başla onayı */
.ask-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 16px; background: rgba(15, 12, 20, .6); backdrop-filter: blur(3px); animation: fadeIn .2s both; }
.ask-box { width: min(420px, 100%); background: linear-gradient(180deg, #f3e5c4, #ead6ab); color: #4a3b2e; border: 1px solid #8a6a42; border-radius: 10px; padding: 22px 22px 18px; text-align: center; box-shadow: 0 24px 60px rgba(0,0,0,.5); font-family: Georgia, serif; animation: popIn .3s cubic-bezier(.3,1.5,.5,1) both; }
.ask-star { color: #c9962e; font-size: 22px; }
.ask-box h3 { margin: 6px 0 8px; font-weight: 400; font-size: 22px; }
.ask-box p { margin: 0 0 16px; font-size: 15px; line-height: 1.55; color: #6b5640; }
.ask-row { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ask-row button { min-height: 40px; padding: 8px 18px; border-radius: 6px; font-size: 14px; font-family: 'Segoe UI', system-ui, sans-serif; }
.ask-no { border: 1px solid #8a6a42; color: #6b5640; background: transparent; }
.ask-yes { background: #8a5a36; color: #fbf0d6; border: 1px solid #6b4528; }
.ask-yes:hover { background: #9a6640; }

/* Ex libris: sınıf / grup kodu */
.exlibris .grp { margin-top: 10px; font-size: 14px; color: #6b5640; }
.exlibris .grp input { font-family: Georgia, serif; font-size: 14px; color: #4a3b2e; background: transparent; border: 0; border-bottom: 1px dashed #8a6a42; width: 230px; text-align: center; padding: 2px 4px; }