.conversation-stage { background: #d9c7a6; }
.conversation-nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; min-height: 58px; padding: 12px 22px; background: #efe4ce; }
.conversation-nav a { font-size: 12px; text-decoration: none; white-space: nowrap; }
.conversation-nav .conversation-brand { font: 17px 'Ridi', serif; letter-spacing: .03em; }
.conversation-scene { height: 278px; overflow: hidden; }
.conversation-scene > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.conversation-paper { position: relative; margin: -19px 9px 0; padding: 17px 8px 15px; }
.conversation-intro { text-align: center; }
.conversation-byline { font-size: 11px; color: #716655; margin: 0 0 7px; letter-spacing: .04em; }
.conversation-intro h1 { margin-bottom: 14px; font-size: 29px; }
.conversation-greeting { font: 16px/1.95 'Ridi', serif; color: #504636; margin-bottom: 21px; }
.conversation-profile { font-size: 12px; margin: 0 0 23px; }
.conversation-profile summary { cursor: pointer; width: fit-content; margin: auto; color: #5e5647; }
.conversation-profile strong { color: #302a22; font-weight: 600; }
.conversation-profile p { margin: 10px 0 0; font-size: 11px; color: #716655; }
.conversation-usage { border-top: 1px solid #9d896d70; border-bottom: 1px solid #9d896d70; padding: 13px 0; display: flex; gap: 6px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.conversation-usage p { margin: 0; font-size: 13px; font-weight: 600; color: #263f35; }
.conversation-usage > span { font-size: 10px; color: #716655; }
.conversation-sample { font-size: 11px; line-height: 1.7; color: #716655; margin: 12px 0 0; }
.conversation-history-section { margin-top: 30px; }
.conversation-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.conversation-section-heading h2, .conversation-compose h2 { font-size: 20px; margin: 0 0 9px; }
.conversation-section-heading a { font-size: 11px; color: #716655; }
.conversation-date { font-size: 10px; text-align: center; color: #716655; margin: 20px 0; }
.conversation-turn { margin-bottom: 28px; scroll-margin-top: 20px; }
.conversation-user-label { font-size: 10px; text-align: right; color: #716655; margin: 0 2px 6px; }
.conversation-user { width: fit-content; max-width: 92%; margin: 0 0 20px auto; padding: 14px 17px; background: #dcd7bc; border-radius: 10px 2px 10px 10px; font-size: 14px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; }
.conversation-answer { padding: 0 0 22px; border-bottom: 1px solid #9d896d50; }
.conversation-speaker { color: #263f35; font: 13px 'Ridi', serif; margin-bottom: 12px; }
.conversation-answer-body { white-space: pre-wrap; font: 15px/1.95 'Ridi', serif; overflow-wrap: anywhere; }
.conversation-evidence { margin-top: 21px; padding-top: 17px; border-top: 1px solid #9d896d40; }
.conversation-evidence h3 { font-size: 14px; margin-bottom: 8px; }
.conversation-evidence p { font-size: 12px; line-height: 1.9; margin-bottom: 9px; color: #5e5647; }
.conversation-answer .basis { margin: 17px 0 0; }
.conversation-answer .basis a { display: inline-block; font-size: 11px; margin-top: 10px; }
.conversation-pending { display: flex; gap: 12px; align-items: center; padding-bottom: 16px; }
.conversation-pending img { width: 82px; height: 82px; object-fit: cover; object-position: 50% 28%; border-radius: 5px; }
.conversation-pending > div { flex: 1; min-width: 0; }
.conversation-pending strong { font-size: 13px; line-height: 1.7; font-weight: 500; }
.conversation-pending p { font-size: 11px; color: #716655; margin: 5px 0 0; }
.conversation-failed { padding: 16px 0; border-bottom: 1px solid #9d896d50; }
.conversation-failed p { font-size: 13px; margin-bottom: 5px; }
.conversation-compose { margin-top: 28px; }
.conversation-followup-label { font-size: 12px; color: #716655; margin: 5px 0 3px; }
.conversation-help { font-size: 11px; color: #716655; line-height: 1.8; margin-bottom: 16px; }
.conversation-topics { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid #9d896d70; margin: 5px 0 7px; }
.conversation-topics button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 12px 1px; font-size: 11px; color: #716655; white-space: nowrap; }
.conversation-topics button[aria-pressed=true] { color: #263f35; border-bottom-color: #263f35; font-weight: 700; }
.conversation-suggestions { margin-bottom: 25px; }
.conversation-suggestions button { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 12px 1px; text-align: left; border: 0; border-bottom: 1px solid #9d896d35; background: none; font-size: 12px; line-height: 1.8; color: #5d5241; }
.conversation-suggestions button > span:last-child { color: #857252; font-size: 16px; }
.conversation-topics button:hover, .conversation-suggestions button:hover { color: #263f35; }
#conversation-input-label { font-size: 13px; margin-bottom: 10px; font-weight: 600; }
#conversation-body { font-size: 14px; line-height: 1.85; padding: 8px; min-height: 150px; resize: vertical; }
.conversation-input-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 8px 0 19px; }
.conversation-input-meta p { margin: 0; font-size: 10px; color: #716655; }
.conversation-input-meta > span { flex-shrink: 0; font-size: 10px; color: #716655; font-variant-numeric: tabular-nums; }
.conversation-save-note { text-align: center; margin: 12px 0 0; font-size: 10px; }
.conversation-complete { padding: 12px 0 0; }
.conversation-complete p:first-child { font: 17px/1.8 'Ridi', serif; }
.conversation-complete p, .conversation-complete a { font-size: 13px; }
.conversation-stage button:disabled { cursor: default; opacity: .55; }
.report-conversation-entry { border-top: 1px solid #9d896d60; padding-top: 28px; margin-top: 30px; }
.report-conversation-entry > p { font-size: 14px; }
.report-conversation-entry > .hint { font-size: 11px; }
@media (max-width: 370px) {
  .conversation-nav { padding: 10px 15px; gap: 8px; }
  .conversation-nav .conversation-brand { font-size: 15px; }
  .conversation-scene { height: 225px; }
  .conversation-paper { margin-left: 3px; margin-right: 3px; padding-left: 1px; padding-right: 1px; }
  .conversation-intro h1 { font-size: 26px; }
  .conversation-greeting { font-size: 14px; }
  .conversation-input-meta { flex-wrap: wrap; }
  .conversation-input-meta > span { margin-left: auto; }
}
