.pen-in-process .jacket { position: relative; isolation: isolate; overflow: hidden; }
.pen-in-process .jacket > .book-model, .pen-in-process .jacket > img { filter: blur(15px) brightness(.72) saturate(.55); }
.pen-in-process .mist-overlay { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; padding: 1.5rem; pointer-events: none; overflow: hidden; background: radial-gradient(circle at 16% 18%, #fff7eab5 0 2px, transparent 5px), radial-gradient(circle at 83% 31%, #fff8e0c2 0 3px, transparent 7px), radial-gradient(circle at 71% 72%, #fff5e7aa 0 2px, transparent 6px), linear-gradient(138deg, #fcf5e5d9, #d7c7d1a8 44%, #f9f0e1d1); backdrop-filter: blur(18px) saturate(.6); -webkit-backdrop-filter: blur(18px) saturate(.6); border: 1px solid #fff7e8ad; box-shadow: inset 0 0 35px #fffaf2a8, inset 0 -40px 80px #68435c42; }
.pen-in-process .mist-overlay::before { content: ''; position: absolute; inset: 0; opacity: .68; background: radial-gradient(ellipse 8px 15px at 26% 14%, #fff9edc9 0 32%, #b3a1b47c 45%, transparent 65%), radial-gradient(ellipse 6px 11px at 78% 12%, #fff9edb8 0 30%, #a695ac5c 50%, transparent 72%), radial-gradient(ellipse 5px 10px at 89% 61%, #fff9edb8 0 30%, #a695ac5c 50%, transparent 72%), radial-gradient(ellipse 7px 13px at 13% 76%, #fff9edbf 0 30%, #a695ac6b 50%, transparent 72%); }
.pen-in-process .mist-message { position: relative; z-index: 1; max-width: 12ch; font-family: 'Caveat', cursive; font-size: clamp(2.8rem, 5vw, 4.4rem); font-weight: 700; line-height: .9; color: #4c1832; text-align: center; transform: rotate(-5deg); text-shadow: 1px 2px 0 #fff8, 0 3px 14px #fff8; }
.pen-in-process .mist-message::after { content: ''; display: block; width: 72%; height: 3px; margin: .2rem auto 0; border-radius: 50%; background: #7c304c; transform: rotate(-2deg); }
.pen-in-process .jacket-link:hover .jacket, .pen-in-process .jacket-link:focus-visible .jacket { filter: drop-shadow(12px 25px 20px #000b); }
.book-shelf:not(.journal-shelf) .pen-in-process .jacket-link { perspective: 1200px; }
.book-shelf:not(.journal-shelf) .pen-in-process .jacket { overflow: visible; isolation: auto; transform-style: preserve-3d; transition: transform .72s cubic-bezier(.2,.72,.2,1); }
.pen-in-process .book-model, .pen-in-process .mist-overlay { backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.book-shelf:not(.journal-shelf) .pen-in-process .jacket-link:hover .jacket,
.book-shelf:not(.journal-shelf) .pen-in-process .jacket-link:focus-visible .jacket,
.book-shelf:not(.journal-shelf) .pen-in-process.is-flipped .jacket { transform: rotateY(180deg); filter: none; }
.book-shelf:not(.journal-shelf) .pen-in-process .jacket-link:hover .book-model,
.book-shelf:not(.journal-shelf) .pen-in-process .jacket-link:focus-visible .book-model { transform: none; }
.pen-in-process .fact-back { position: absolute; z-index: 4; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 1.4rem; padding: 2.1rem; color: #f9eddf; background: radial-gradient(circle at 80% 15%, #9b5c7155, transparent 50%), linear-gradient(140deg,#521d37,#241322); border: 1px solid #dab879; box-shadow: inset 0 0 0 8px #f2d49a18, 0 14px 30px #0007; transform: rotateY(180deg); backface-visibility: hidden; -webkit-backface-visibility: hidden; text-align: left; }
.pen-in-process .fact-eyebrow { color: #e6bd7f; font: 700 .72rem 'DM Sans', sans-serif; text-transform: uppercase; letter-spacing: .12em; }
.pen-in-process .fact-list { display: grid; gap: .9rem; font: 1.1rem/1.35 'DM Sans',sans-serif; }
.pen-in-process .fact-list span { display: block; border-bottom: 1px solid #f6dcb536; padding-bottom: .7rem; }
.pen-in-process .fact-signature { font: 2rem 'Caveat',cursive; color: #f0abbe; align-self: end; }
.pen-in-process .flip-trigger { display: block; margin: -.8rem auto 1.1rem; padding: .35rem .85rem; border: 1px solid #e6bd7f8c; border-radius: 30px; background: #38172a; color: #f4d8ad; cursor: pointer; font: .78rem 'DM Sans',sans-serif; }
.pen-in-process .flip-trigger:hover, .pen-in-process .flip-trigger:focus-visible { background: #70304d; }
.journal-shelf .jacket-link:hover .jacket, .journal-shelf .jacket-link:focus-visible .jacket { transform: translateY(-6px) scale(1.01); filter: drop-shadow(9px 16px 15px #0009); }
@media (max-width: 600px) { .pen-in-process .fact-back { padding: 1.4rem; gap: .85rem; } .pen-in-process .fact-list { font-size: 1rem; gap: .6rem; } }
@media (prefers-reduced-motion: reduce) { .book-shelf:not(.journal-shelf) .pen-in-process .jacket { transition: none; } }
