/* Guestbook at the foot of the home pages (section #libro, 2026-11-01): the form in the same light panel as
   the other sections, the signatures below it.  guestbook.js fills it from /api/guestbook. */
.screen.story .scroll.book { max-width: 820px; }
.book .sign { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; margin: 26px 0 8px; }
.book .sign label { display: grid; gap: 6px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.screen.story .scroll.book .sign label span { font-weight: 400; letter-spacing: .04em; text-transform: none; }
.book .sign .wide, .book .sign-row, .book .sign .note { grid-column: 1 / -1; }
.book .sign input, .book .sign textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #77705f;
  border-radius: .5rem;
  background: #f6f4ee;
  color: #000;
  font: 400 16px/1.45 'DM Sans', sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
.book .sign textarea { resize: vertical; min-height: 110px; }
.book .sign :is(input, textarea):focus-visible { outline: 3px solid #7a5317; outline-offset: 1px; }
.book .sign :is(input, textarea):disabled { opacity: .6; }
.book .sign .trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.book .sign-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }
.screen.story .scroll.book .sign-row .button { margin-top: 0; border: 0; font-family: inherit; cursor: pointer; }
.screen.story .scroll.book .sign-row .button[disabled] { opacity: .55; cursor: wait; transform: none; }
.screen.story .scroll.book .status { margin: 0; font-size: 14px; }
.screen.story .scroll.book .status.ok { color: #1f4d12 !important; }
.screen.story .scroll.book .status.error { color: #7a1010 !important; }
.screen.story .scroll.book .sign .note { margin: 4px 0 0; line-height: 1.6; font-weight: 400; }

.screen.story .scroll.book .signers { margin: 34px 0 6px; font-size: 24px; }
.book .entries { list-style: none; margin: 0; padding: 0; }
.book .entry { padding: 16px 0; border-top: 1px solid #76684c; }
.book .entry:last-child { border-bottom: 1px solid #76684c; }
.book .entry header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 6px; }
.screen.story .scroll.book .entry .who { font: 700 18px Cinzel, Georgia, serif; overflow-wrap: anywhere; }
.screen.story .scroll.book .entry .where { font-size: 13px; color: #3c3a35 !important; }
.book .entry time { margin-left: auto; font-size: 12px; color: #3c3a35; }
.screen.story .scroll.book .entry .text {
  margin: 0;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.screen.story .scroll.book .entries .empty { padding: 16px 0; border-top: 1px solid #76684c; font-weight: 400; color: #3c3a35; }
.book .entry .withdraw, .book .pager button {
  border-radius: .5rem;
  font: 800 11px 'DM Sans', sans-serif;
  letter-spacing: .1em;
  cursor: pointer;
}
.book .entry .withdraw { margin-top: 10px; padding: 7px 12px; border: 1px solid #7a1010; background: transparent; color: #7a1010; }
.book .entry .withdraw:hover, .book .entry .withdraw:focus-visible { background: #7a1010; color: #fff; }
.book .pager { display: flex; justify-content: center; align-items: center; gap: 16px; margin: 14px 0 6px; }
.book .pager:empty { display: none; }
.book .pager button { padding: 9px 16px; border: 0; background: #000; color: #f0e9da; }
.book .pager button:hover, .book .pager button:focus-visible { background: #2c2416; color: #ffdf9c; }
.screen.story .scroll.book .pager .where { font: 700 20px 'UnifrakturCook', Georgia, serif; }
.screen.story .scroll.book > .button { margin-top: 28px; }
@media (max-width: 640px) {
  .book .sign { grid-template-columns: 1fr; }
}