/* Magnetic glass: an asymmetrical color body with soft depth and pointer inertia. */
.cover-shell { position: relative; isolation: isolate; }
.cover-atmosphere { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.magnetic-light {
  position: absolute; left: 58%; top: 32%; width: min(52vw, 700px); height: min(66vh, 560px);
  border-radius: 58% 42% 48% 52%; filter: blur(46px); opacity: var(--magnet-opacity, .82);
  transform: translate3d(calc(var(--magnet-x, 0px) - 50%), calc(var(--magnet-y, 0px) - 50%), 0)
    rotate(var(--magnet-rotate, 0deg)) scale(var(--magnet-scale-x, 1), var(--magnet-scale-y, 1));
  transform-origin: 42% 58%; will-change: transform; mix-blend-mode: multiply;
  transition: opacity .8s ease;
}
.magnetic-light::after {
  content: ''; position: absolute; inset: -18%; border-radius: inherit; filter: blur(34px);
  animation: glass-breathe 11s ease-in-out infinite alternate;
}
.magnetic-light-primary {
  background: radial-gradient(ellipse at 32% 42%, #2748c86e 0 18%, #526cae3d 36%, transparent 72%);
}
.magnetic-light-primary::after { background: radial-gradient(ellipse at 70% 64%, #c29b5550, transparent 64%); }
.magnetic-light-secondary {
  left: 64%; top: 26%; width: min(40vw, 520px); height: min(48vh, 420px);
  opacity: calc(var(--magnet-opacity, .82) * .65); filter: blur(58px); mix-blend-mode: soft-light;
  transition: opacity 1.1s ease; animation: glass-drift 18s ease-in-out infinite alternate;
}
.magnetic-light-secondary::after { background: radial-gradient(ellipse at 36% 44%, #d1ad6b45, transparent 68%); animation-delay: -4s; }
.cover-art { position: relative; z-index: 0; perspective: 1400px; }
.cover-art::after {
  content: ''; position: absolute; inset: 0 0 1.75rem; pointer-events: none; border-radius: 1px;
  background: radial-gradient(ellipse 30% 42% at var(--art-light-x, 50%) var(--art-light-y, 50%), #fff9dfcc 0, #e8d5a833 34%, transparent 72%);
  mix-blend-mode: screen; opacity: var(--art-light-opacity, .08); transition: opacity .8s ease;
}
.cover-art img {
  position: relative; z-index: 0;
  transform: perspective(1400px) rotateX(var(--art-tilt-x, 0deg)) rotateY(var(--art-tilt-y, 0deg));
  transition: transform .9s cubic-bezier(.16, 1, .3, 1); will-change: transform;
}
.cover-shell[data-motion-paused="true"] .cover-art img { transition: none; }
.cover-shell[data-motion-paused="true"] .cover-art::after,
.cover-shell[data-motion-paused="true"] .magnetic-light { transition: none; }
.cover-meta { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.motion-toggle { display: inline-flex; align-items: center; gap: .4rem; border: 0; border-bottom: 1px solid #929889; padding: .25rem 0; color: #565e52; background: transparent; font-size: .75rem; white-space: nowrap; line-height: 1.5; }
.motion-toggle:disabled { opacity: .7; cursor: default; border-bottom-color: transparent; }
.reader-toolbar { background: #f5f2e9; }
.reader-home { display: inline-flex; align-items: center; gap: .625rem; color: var(--blue); font-size: .875rem; padding: .625rem 0; white-space: nowrap; }
.reader-home:hover { text-decoration: underline; text-underline-offset: .3rem; }
.reader-home span { font-size: 1.25rem; line-height: 1; }
.author-profile { margin: 0 5%; padding: 4rem 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr 2fr; gap: 3rem; }
.author-period .eyebrow { color: var(--blue); }
.life-dates { font-family: var(--serif); font-size: clamp(3rem, 5vw, 5.5rem); line-height: 1.05; letter-spacing: -.05em; margin: 2rem 0 1.5rem; }
.life-dates span { color: #727a6a; }
.author-period > p:last-child { font-size: .8125rem; line-height: 1.9; color: #656b5f; }
.author-biography h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(2.75rem, 4vw, 4.5rem); line-height: 1.1; margin: 0 0 1rem; letter-spacing: -.04em; }
.author-biography h2 span { display: block; font-family: 'Songti SC', serif; font-size: .5em; letter-spacing: .1em; margin-top: .75rem; }
.author-role { font-size: .875rem; line-height: 1.8; color: #626b58; margin-bottom: 1.75rem; }
.biography-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.biography-columns p { margin: 0 0 1.25rem; font-family: 'Songti SC', serif; font-size: 1rem; line-height: 1.95; color: #3c423b; }
.biography-columns [lang="en"] p { font-family: var(--serif); font-size: 1.125rem; line-height: 1.7; }
.bio-sources { font-size: .75rem; line-height: 1.9; color: #606955; margin-bottom: 0; }
.bio-sources a { text-decoration: underline; text-underline-offset: .2rem; }
@media (min-width: 1600px) { .author-profile { max-width: 1440px; margin-left: auto; margin-right: auto; } }
@media (max-width: 800px) {
  .author-profile { grid-template-columns: 1fr; gap: 1.5rem; padding: 2.5rem 0; }
  .author-period { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
  .life-dates { font-size: 2.75rem; margin: 0; }
  .life-dates br { display: none; }
}
@media (max-width: 600px) {
  .cover-meta { max-width: 48%; gap: .125rem; flex-direction: column; align-items: flex-start; }
  .cover-bottom .edition-meta { max-width: none; }
  .motion-toggle { font-size: .6875rem; padding: .125rem 0; }
  .author-profile { margin: 0 6%; }
  .biography-columns { grid-template-columns: 1fr; gap: .5rem; }
  .author-period .eyebrow { width: 100%; margin: 0; }
  .author-period > p:last-child { margin: 0; }
  .author-biography h2 { font-size: 3rem; }
}
@keyframes glass-breathe { from { transform: translate3d(-3%, 2%, 0) scale(.95); opacity: .58; } to { transform: translate3d(4%, -3%, 0) scale(1.08); opacity: 1; } }
@keyframes glass-drift { from { transform: translate3d(-18px, 10px, 0) rotate(-4deg); } to { transform: translate3d(16px, -12px, 0) rotate(5deg); } }
.cover-shell[data-motion-paused="true"] .magnetic-light::after,
.cover-shell[data-motion-paused="true"] .magnetic-light-secondary { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .cover-art img { transition: none; } .magnetic-light::after, .magnetic-light-secondary { animation: none; } }
@media (hover: none), (pointer: coarse) { .cover-art::after { opacity: .06; } }
@media print { .cover-atmosphere, .motion-toggle, .reader-home { display: none; } .cover-art img { transform: none; } .author-profile { break-before: page; } }
