/* WisdomHub polish. Tailwind provides base; this adds book-voice details. */

:root {
  --wh-amber: #fbbf24;
  --wh-stone: #0c0a09;
}

[x-cloak] { display: none !important; }

html, body { -webkit-font-smoothing: antialiased; }

body {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(251, 191, 36, 0.05), transparent 60%),
    radial-gradient(900px 700px at 100% 0%, rgba(120, 53, 15, 0.10), transparent 60%),
    #0c0a09;
}

h1, .font-serif {
  font-family: 'Fraunces', 'Cormorant Garamond', 'Georgia', serif;
  letter-spacing: -0.01em;
}

.prose :where(p) { margin: 0; }
.prose :where(p) + p { margin-top: 0.75rem; }

#chat { scrollbar-width: thin; scrollbar-color: #57534e transparent; }
#chat::-webkit-scrollbar { width: 8px; }
#chat::-webkit-scrollbar-thumb { background: #44403c; border-radius: 4px; }

textarea { field-sizing: content; max-height: 8rem; }

@keyframes fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
#chat > div { animation: fade-in .18s ease-out; }

/* "Exact words from the book" rendered as a warm book page, readable on all screens */
.wh-page {
  position: relative;
  margin: 0;
  background: linear-gradient(180deg, #f7f2e7 0%, #f1ead9 100%);
  color: #2b2015;
  border-radius: 14px;
  padding: 1.2rem 1.35rem 1.3rem;
  box-shadow: 0 12px 34px rgba(0,0,0,.38), inset 0 0 0 1px rgba(120,90,40,.10);
}
.wh-page::after {
  content: "";
  position: absolute; left: 0; top: 12px; bottom: 12px;
  width: 3px; border-radius: 3px;
  background: rgba(180,120,40,.45);
}
.wh-page-tag {
  display: inline-block;
  font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8a5a1c;
  background: rgba(160,110,40,.12);
  border: 1px solid rgba(160,110,40,.28);
  padding: 3px 9px;
  border-radius: 999px;
  margin-bottom: .7rem;
}
.wh-page-text {
  margin: 0;
  font-family: 'Fraunces', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  font-size: 1.06rem;
  line-height: 1.8;
  letter-spacing: .003em;
  color: #322517;
  max-width: 64ch;
  quotes: "\201C" "\201D";
}
.wh-page-text::before { content: open-quote; color: rgba(160,110,40,.55); margin-right: .1em; }
.wh-page-text::after  { content: close-quote; color: rgba(160,110,40,.55); margin-left: .05em; }
@media (max-width: 640px) {
  .wh-page { padding: 1rem 1.05rem 1.1rem; border-radius: 12px; }
  .wh-page-text { font-size: 1.01rem; line-height: 1.72; }
}