/* zin-render.css (2026-10-28): Zin's messages in every chat window --
   links, centered equations and link previews (public/zin-render.js).
   Colours fall back to the site's values, since the Ask Zin panel also
   opens on pages that do not load home.css. */

.zr-link {
    color: var(--phase-1, #35e8e0);
    text-decoration: underline;
    text-decoration-color: rgba(53, 232, 224, 0.4);
    text-underline-offset: 3px;
    word-break: break-word;
}
.zr-link:hover { text-decoration-color: currentColor; }
.zr-link[data-zr-external]::after { content: " ↗"; font-size: 0.8em; opacity: 0.7; }

/* Display math: its own line, centered, scrolling sideways if it is wider. */
.zr-math {
    display: block;
    margin: 0.7em 0;
    padding: 0.55em 0.75em;
    text-align: center;
    overflow-x: auto;
    overflow-y: hidden;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--line, #23262e);
    color: var(--text, #e8eaef);
    font-size: 1.08em;
}
.zr-math .katex-display { margin: 0; }
.zr-math.is-raw { font-family: "STIX Two Math", "Cambria Math", serif; white-space: pre-wrap; }
.zr-imath { white-space: nowrap; }

.zr-h { margin: 0.8em 0 0.3em; font-weight: 700; color: var(--text, #e8eaef); }

.zr-cards code, .zr-math code { background: none; }

/* Preview cards under a message. */
.zr-cards {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}
.zr-card {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid var(--line, #23262e);
    border-left: 3px solid var(--phase-1, #35e8e0);
    background: var(--bg-card, #14161c);
    color: var(--text, #e8eaef);
    text-decoration: none;
    transition: border-color 0.15s ease, transform 0.15s ease;
}
.zr-card:hover { border-color: rgba(53, 232, 224, 0.55); transform: translateY(-1px); }
.zr-card.is-external { border-left-color: var(--phase-mid, #b05cc4); }
.zr-card-kind {
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--phase-1, #35e8e0);
}
.zr-card.is-external .zr-card-kind { color: var(--phase-mid, #b05cc4); }
.zr-card-title { font-weight: 650; font-size: 0.95rem; line-height: 1.3; }
.zr-card-sum { font-size: 0.85rem; line-height: 1.45; color: var(--text-dim, #9aa1ad); }
.zr-card-url { font-size: 0.72rem; color: var(--text-mute, #6b7280); word-break: break-all; }

/* The chat windows style every link in a message; a card is not a link line. */
.zr-cards a.zr-card,
.zr-cards a.zr-card:hover { text-decoration: none; color: var(--text, #e8eaef); }
.zr-cards a.zr-card span { text-decoration: none; }
.zr-cards a.zr-card .zr-card-title { color: var(--text, #e8eaef); }
.zr-cards a.zr-card .zr-card-sum { color: var(--text-dim, #9aa1ad); }
.zr-cards a.zr-card .zr-card-url { color: var(--text-mute, #6b7280); }
