.trc-chatbot { width: 100%; max-width: none; margin: 18px 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.trc-log { border: 1px solid #ddd; border-radius: 10px; padding: 12px; min-height: 260px; max-height: 40vh; background: #fafafa; overflow-y: auto; overflow-x: hidden; }
.trc-form { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.trc-input { flex: 1; min-width: 0; padding: 10px 12px; border-radius: 10px; border: 1px solid #ccc; }
.trc-btn { padding: 10px 14px; border-radius: 10px; border: 1px solid #222; background: #222; color: #fff; cursor: pointer; }
.trc-btn-clear { padding: 10px 14px; border-radius: 10px; border: 1px solid #ccc; background: transparent; color: #555; cursor: pointer; }
.trc-btn-clear:hover { background: #f0f0f0; color: #222; }
.trc-msg { margin: 10px 0; }
.trc-divider { border-top: 1px solid rgba(0,0,0,0.08); margin: 40px 0; }
.trc-role { font-weight: 700; }
.trc-text { white-space: pre-wrap; margin-top: 6px; }
.trc-meta { color: #666; font-size: 12px; margin-top: 6px; }
.trc-sources { margin: 8px 0 0 0; font-size: calc(1em - 2px); }
.trc-sources-list { margin: 6px 0 0 1.25em; padding: 0; }
.trc-sources-item { margin: 0 !important; }
.trc-source-link { color: inherit; text-decoration: underline; }
.trc-source-link:hover { text-decoration: underline; }
.trc-source-text { color: inherit; }
.trc-related { margin: 10px 0 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; }
.trc-related-item { width: 160px; }
.trc-related-link { display: block; color: inherit; text-decoration: none; }
.trc-related-link:hover .trc-related-title { text-decoration: none; }
.trc-related-img { display: block; width: 100%; aspect-ratio: 16 / 10.35; object-fit: cover; border-radius: 12px; background: #eee; }
.trc-related-title { margin-top: 8px; font-weight: 600; line-height: 1.2; }
.trc-related-score { margin-top: 6px; }
.trc-text a { text-decoration: underline; }
.trc-text a.trc-cite { text-decoration: none; font-weight: 600; color: #1b9e3c; }
.trc-text a.trc-cite:visited { color: #1b9e3c; }
.trc-text a.trc-cite:hover { text-decoration: underline; color: #168533; }

/* Floating popup variant ([fifthandmissing_chatbot_popup]) */
.trc-chatbot-popup { position: relative; z-index: 99999; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.trc-popup-launcher {
    position: fixed; bottom: 24px; right: 24px;
    width: 60px; height: 60px;
    border-radius: 50%;
    background: #222; color: #fff;
    border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 6px 22px rgba(0,0,0,0.22);
    transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    z-index: 99999;
}
.trc-popup-launcher:hover { transform: scale(1.06); box-shadow: 0 10px 28px rgba(0,0,0,0.28); }
.trc-popup-launcher:focus-visible { outline: 2px solid #1b9e3c; outline-offset: 3px; }
.trc-popup-launcher .trc-popup-icon-close { display: none; }
.trc-chatbot-popup.trc-popup-open .trc-popup-launcher .trc-popup-icon-chat { display: none; }
.trc-chatbot-popup.trc-popup-open .trc-popup-launcher .trc-popup-icon-close { display: block; }

.trc-popup-panel {
    position: fixed; bottom: 100px; right: 24px;
    width: min(380px, calc(100vw - 32px));
    height: min(580px, calc(100vh - 140px));
    background: #fff;
    color: #222;
    border-radius: 14px;
    box-shadow: 0 18px 50px rgba(0,0,0,0.22);
    display: flex; flex-direction: column;
    overflow: hidden;
    z-index: 99999;
    animation: trc-popup-in 0.18s ease-out;
}
.trc-popup-panel[hidden] { display: none; }
@keyframes trc-popup-in {
    from { opacity: 0; transform: translateY(8px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.trc-popup-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px;
    border-bottom: 1px solid #eee;
    background: #fafafa;
    flex: 0 0 auto;
}
.trc-popup-title { font-weight: 700; font-size: 15px; }
.trc-popup-close {
    background: transparent; border: 0;
    cursor: pointer; color: #555;
    padding: 6px; border-radius: 8px;
    display: inline-flex; align-items: center; justify-content: center;
}
.trc-popup-close:hover { background: #ececec; color: #000; }
.trc-popup-close:focus-visible { outline: 2px solid #1b9e3c; outline-offset: 2px; }

.trc-popup-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 12px; }
.trc-popup-body .trc-chatbot { margin: 0; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.trc-popup-body .trc-log { flex: 1 1 auto; min-height: 0; max-height: none; }
.trc-popup-body .trc-form { flex: 0 0 auto; }

@media (max-width: 480px) {
    .trc-popup-launcher { bottom: 14px; right: 14px; width: 54px; height: 54px; }
    .trc-popup-panel {
        right: 8px; left: 8px; bottom: 80px;
        width: auto; height: calc(100vh - 100px);
        max-height: calc(100vh - 100px);
    }
}