.reading-evidence-mark {
    position: relative;
    padding: 1px 2px;
    border-radius: 4px;
    background-color: #93c5fd !important;
    color: #0f172a !important;
    box-shadow:
        inset 0 -2px 0 #2563eb,
        0 0 0 1px rgba(37, 99, 235, 0.22);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    cursor: help;
    outline: none;
}

.reading-evidence-mark:hover,
.reading-evidence-mark:focus-visible,
.reading-evidence-mark.is-active {
    background-color: #60a5fa !important;
    box-shadow:
        inset 0 -2px 0 #1d4ed8,
        0 0 0 3px rgba(37, 99, 235, 0.30);
}

.reading-evidence-mark .highlight {
    background-color: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

.reading-evidence-qbadge {
    display: inline-flex;
    align-items: center;
    margin-left: 5px;
    padding: 1px 5px;
    border-radius: 4px;
    background: #1d4ed8 !important;
    color: #fff !important;
    font-size: 0.66em;
    font-weight: 850;
    line-height: 1.35;
    vertical-align: 0.22em;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
}

.reading-evidence-qbadge:hover,
.reading-evidence-qbadge:focus-visible {
    background: #0f3fb4 !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.28);
}

.reading-evidence-mark-shared {
    background-color: #bfdbfe !important;
}

.reading-evidence-tooltip {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 1005;
    display: none;
    width: min(440px, calc(100vw - 24px));
    max-height: calc(100vh - 100px);
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: scroll;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
    pointer-events: auto;
    padding: 13px 14px;
    border: 1px solid #a9c9df;
    border-radius: 10px;
    background: #fff;
    color: #172033;
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.24);
    font-size: 0.88rem;
    line-height: 1.45;
}

.reading-evidence-tooltip::-webkit-scrollbar {
    width: 10px;
}

.reading-evidence-tooltip::-webkit-scrollbar-track {
    border-radius: 999px;
    background: #e2e8f0;
}

.reading-evidence-tooltip::-webkit-scrollbar-thumb {
    border: 2px solid #e2e8f0;
    border-radius: 999px;
    background: #64748b;
}

.reading-evidence-tooltip.is-open {
    display: block;
}

.reading-evidence-tooltip-title {
    position: sticky;
    top: -13px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    padding: 10px 0 8px;
    background: #fff;
    color: #1f6b9a;
    font-size: 1rem;
    font-weight: 850;
}

.reading-evidence-tooltip-answer {
    flex: 0 0 auto;
    padding: 2px 7px;
    border-radius: 999px;
    background: #dcfce7;
    color: #166534;
    font-size: 0.78rem;
}

.reading-evidence-tooltip-row {
    margin-top: 8px;
}

.reading-evidence-tooltip-label {
    display: block;
    margin-bottom: 2px;
    color: #334155;
    font-weight: 800;
}

.reading-evidence-tooltip-clue,
.reading-evidence-tooltip-language,
.reading-evidence-tooltip-quote,
.reading-evidence-tooltip-reason {
    padding: 9px 10px;
    border-radius: 7px;
}

.reading-evidence-tooltip-clue {
    border-left: 4px solid #2563eb;
    background: #eff6ff;
}

.reading-evidence-tooltip-language {
    border-left: 4px solid #d97706;
    background: #fffbeb;
}

.reading-evidence-tooltip-quote {
    border-left: 4px solid #0891b2;
    background: #ecfeff;
    font-style: italic;
}

.reading-evidence-tooltip-reason {
    border-left: 4px solid #16a34a;
    background: #f0fdf4;
}

.reading-evidence-tooltip-others {
    margin-top: 10px;
    padding: 9px 10px;
    border-left: 4px solid #dc2626;
    border-radius: 7px;
    background: #fef2f2;
}

.reading-evidence-tooltip-location {
    margin-top: 9px;
    padding-bottom: 6px;
    color: #64748b;
    font-size: 0.8rem;
    font-weight: 700;
}

.contrast-white-black .reading-evidence-mark,
.contrast-yellow-black .reading-evidence-mark {
    background-color: #38bdf8 !important;
    color: #082f49 !important;
    box-shadow: inset 0 -2px 0 #0284c7;
}

.contrast-white-black .reading-evidence-qbadge,
.contrast-yellow-black .reading-evidence-qbadge {
    background: #e0f2fe !important;
    color: #075985 !important;
}

.contrast-white-black .reading-evidence-tooltip,
.contrast-yellow-black .reading-evidence-tooltip {
    border-color: #64748b;
    background: #111827;
    color: #f8fafc;
}

.contrast-white-black .reading-evidence-tooltip-label,
.contrast-yellow-black .reading-evidence-tooltip-label {
    color: #dbeafe;
}

.contrast-white-black .reading-evidence-tooltip-clue,
.contrast-white-black .reading-evidence-tooltip-language,
.contrast-white-black .reading-evidence-tooltip-quote,
.contrast-white-black .reading-evidence-tooltip-reason,
.contrast-white-black .reading-evidence-tooltip-others,
.contrast-yellow-black .reading-evidence-tooltip-clue,
.contrast-yellow-black .reading-evidence-tooltip-language,
.contrast-yellow-black .reading-evidence-tooltip-quote,
.contrast-yellow-black .reading-evidence-tooltip-reason,
.contrast-yellow-black .reading-evidence-tooltip-others {
    background: #1f2937;
}

@media (max-width: 768px) {
    .reading-evidence-tooltip {
        right: 12px !important;
        bottom: 78px !important;
        left: 12px !important;
        top: auto !important;
        width: auto;
        max-height: calc(100vh - 110px);
    }
}