/* ══ CSS CUSTOM PROPERTIES ─────────────────────────── */
.u4ea-chat-panel {
    /* ── RGB channel values (for rgba()) ── */
    --green:       0, 255, 136;
    --cyan:        0, 212, 255;
    --pink:        255, 68, 102;
    --error-rgb:   255, 60, 100;
    --warn-rgb:    255, 180, 0;
    --gold-rgb:    255, 214, 0;

    /* ── Backgrounds ── */
    --bg-panel:      linear-gradient(180deg,#0a0f18 0%,#0d1520 100%);
    --bg-header:     linear-gradient(135deg,rgba(var(--green),.06) 0%,rgba(var(--cyan),.04) 100%);
    --bg-surface:    #0d1520;
    --bg-overlay:    rgba(0,0,0,.4);
    --bg-card:       rgba(0,0,0,.6);
    --bg-input:      rgba(var(--green),.03);
    --bg-hover:      rgba(var(--green),.18);

    /* ── Text ── */
    --text-base:     #a0c0d0;
    --text-primary:  #c0dce8;
    --text-bright:   #d0e8f0;
    --text-muted:    #5a8a9a;
    --text-muted-rgb: 90, 160, 200;
    --text-dim:      #3a5a6a;
    --text-faint:    rgba(var(--text-muted-rgb),.4);
    --text:          #c8d8e8;
    --neon-green:    #00ff88;
    --accent:        #00ff88;
    --accent-cyan:   #00d4ff;
    --accent-pink:   #ff4466;
    --accent-error:  #ff3c64;
    --accent-warn:   #ffb400;
    --accent-gold:   #ffe566;
    --on-accent:     #050b14;

    /* ── Borders ── */
    --border:        rgba(var(--green),.15);
    --border-strong: rgba(var(--green),.2);
    --border-bright: rgba(var(--green),.35);
    --border-cyan:   rgba(var(--cyan),.2);
    --border-pink:   rgba(var(--pink),.2);
    --border-error:  rgba(var(--error-rgb),.15);

    /* ── Misc ── */
    --shadow:        0 8px 40px rgba(0,0,0,.6);
    --scrollbar:     rgba(var(--green),.2);
    --hover-cyan:    #00b8e0;
    --dark-green:    #060e06;
    --bg-searchbar:  #060d16;
}

/* ══ HIGH CONTRAST OVERRIDES ══ */
.u4ea-chat-panel.high-contrast {
    --green:       255, 255, 255;
    --cyan:        255, 255, 255;
    --pink:        255, 255, 255;
    --error-rgb:   255, 255, 255;
    --warn-rgb:    255, 255, 255;
    --gold-rgb:    255, 255, 255;

    --bg-panel:      #000000;
    --bg-header:     #000000;
    --bg-surface:    #000000;
    --bg-overlay:    #000000;
    --bg-card:       #000000;
    --bg-input:      #000000;
    --bg-hover:      #ffffff;

    --text-base:     #ffffff;
    --text-primary:  #ffffff;
    --text-bright:   #ffffff;
    --text-muted:    #ffffff;
    --text-muted-rgb: 255, 255, 255;
    --text-dim:      #ffffff;
    --text-faint:    #ffffff;
    --text:          #ffffff;
    --neon-green:    #ffffff;
    --accent:        #ffffff;
    --accent-cyan:   #ffffff;
    --accent-pink:   #ffffff;
    --accent-error:  #ffffff;
    --accent-warn:   #ffffff;
    --accent-gold:   #ffffff;
    --on-accent:     #000000;

    --border:        #ffffff;
    --border-strong: #ffffff;
    --border-bright: #ffffff;
    --border-cyan:   #ffffff;
    --border-pink:   #ffffff;
    --border-error:  #ffffff;

    --shadow:        none;
    --scrollbar:     #ffffff;
    --hover-cyan:    #ffffff;
    --dark-green:    #000000;
    --bg-searchbar:  #000000;
}

/* ══ GLOBAL CHATBOX ══ */
.u4ea-chat-panel {
    background:var(--bg-panel)!important;
    border:1px solid var(--border-strong)!important;
    border-radius:12px!important;
    box-shadow:var(--shadow)!important;
    flex-direction:column!important;
    overflow:hidden!important;
}
.u4ea-chat-header {
    background:var(--bg-header)!important;
    border-bottom:1px solid var(--border)!important;
    padding:.6rem .8rem!important;
    display:flex!important; align-items:center!important; gap:.6rem!important;
}
.u4ea-chat-header-title {
    font-family:"Orbitron",monospace!important;
    font-size:.65rem!important; font-weight:700!important;
    letter-spacing:1.5px!important; text-transform:uppercase!important;
    color:var(--accent)!important;
    flex:1!important;
}
.u4ea-chat-viewers {
    display:flex!important; align-items:center!important; gap:.35rem!important; margin-left:auto!important;
    font-size:.55rem!important; font-family:"Orbitron",monospace!important;
    color:var(--text-muted)!important; letter-spacing:.5px!important;
    white-space:nowrap!important;
}
.u4ea-chat-viewers-dot {
    width:6px!important; height:6px!important;
    background:var(--accent)!important; border-radius:50%!important;
    animation:u4ea-pulse 2s ease-in-out infinite!important;
    flex-shrink:0!important;
}
.u4ea-chat-header-close {
    background:none!important; border:none!important;
    color:var(--text-dim)!important; font-size:1.1rem!important;
    cursor:pointer!important; padding:4px 8px!important; line-height:1!important;
    min-width:36px!important; min-height:36px!important;
    display:inline-flex!important; align-items:center!important; justify-content:center!important;
    touch-action:manipulation!important; -webkit-tap-highlight-color:var(--border-strong)!important;
}
.u4ea-chat-header-close:hover { color:var(--accent)!important; }
/* Inner text/emoji must not intercept clicks — the <button> is the hit target */
.u4ea-chat-header-close > * { pointer-events:none!important; }
.u4ea-chat-messages {
    flex:1!important; overflow-y:auto!important; overflow-x:hidden!important;
    padding:.6rem!important;
    display:flex!important; flex-direction:column!important; gap:.4rem!important;
    scrollbar-width:thin!important;
    scrollbar-color:var(--border-strong) transparent!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
}
.u4ea-chat-msg {
    display:flex!important; gap:.5rem!important; align-items:flex-start!important;
    padding:.35rem 0!important;
    position:relative!important;
}
.u4ea-chat-msg-avatar {
    width:28px!important; height:28px!important;
    border-radius:50%!important; object-fit:cover!important;
    border:1px solid var(--border)!important;
    flex-shrink:0!important;
}
.u4ea-chat-msg-body { flex:1!important; min-width:0!important; overflow:hidden!important; padding-right:1.8rem!important; }
.u4ea-chat-msg-meta {
    display:flex!important; align-items:baseline!important; gap:.6rem!important;
    margin-bottom:.1rem!important;
}
.u4ea-chat-msg-name {
    font-family:"Orbitron",monospace!important;
    font-size:.58rem!important; font-weight:700!important;
    color:var(--accent-cyan)!important; letter-spacing:.5px!important;
}
.u4ea-chat-msg-time {
    font-size:.6rem!important; color:rgba(var(--text-muted-rgb),.75)!important;
}
.u4ea-chat-msg-text {
    font-size:.8rem!important; color:var(--text-base)!important;
    line-height:1.35!important; word-break:break-word!important;
}
.u4ea-chat-msg-text img.u4ea-emoji-img {
    width:2.5rem!important;
    height:2.5rem!important;
}
/* Plain Unicode emojis in chat messages */
.u4ea-chat-msg-text .emoji,
.u4ea-chat-msg-text img.emoji,
.u4ea-chat-msg-text .u4ea-chat-emoji-char {
    font-size:2.5rem!important;
    line-height:1!important;
    vertical-align:middle!important;
    display:inline!important;
}
.u4ea-chat-link {
    color:var(--accent-cyan)!important;
    text-decoration:underline!important;
    text-decoration-color:rgba(var(--cyan),.35)!important;
    text-underline-offset:2px!important;
    word-break:break-all!important;
    transition:color .15s!important;
}
.u4ea-chat-link:hover {
    color:var(--accent)!important;
    text-decoration-color:rgba(var(--green),.5)!important;
}
/* YouTube embed card */
.u4ea-yt-card {
    display:inline-flex!important;
    flex-direction:column!important;
    align-self:flex-start!important;
    margin-top:.4rem!important;
    background:rgba(0,0,0,.4)!important;
    border:1px solid rgba(var(--green),.14)!important;
    border-radius:7px!important;
    overflow:hidden!important;
    text-decoration:none!important;
    color:inherit!important;
    width:220px!important;
    max-width:220px!important;
    transition:border-color .18s,box-shadow .18s!important;
    box-shadow:0 2px 8px rgba(0,0,0,.3)!important;
}
.u4ea-yt-card:hover {
    border-color:rgba(var(--green),.4)!important;
    box-shadow:0 4px 14px var(--border)!important;
}
.u4ea-yt-card-thumb {
    width:100%!important;
    aspect-ratio:16/9!important;
    object-fit:cover!important;
    display:block!important;
}
.u4ea-yt-card-info {
    padding:.35rem .5rem .4rem!important;
}
.u4ea-yt-card-title {
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
    font-size:.72rem!important;
    font-weight:600!important;
    color:var(--text-bright)!important;
    line-height:1.35!important;
    margin-bottom:.2rem!important;
}
.u4ea-yt-card-author {
    display:block!important;
    font-size:.63rem!important;
    color:var(--text-muted)!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    line-height:1.2!important;
}
/* Chat warning banner (inserted above input) */
.u4ea-chat-warn {
    padding:.35rem .8rem!important;
    font-size:.72rem!important;
    font-family:"Exo 2",sans-serif!important;
    text-align:center!important;
    border-top:1px solid!important;
}
.u4ea-chat-warn--success {
    color:var(--accent)!important;
    background:rgba(var(--green),.07)!important;
    border-top-color:var(--border)!important;
}
.u4ea-chat-warn--error {
    color:var(--accent-error)!important;
    background:rgba(var(--error-rgb),.08)!important;
    border-top-color:rgba(var(--error-rgb),.15)!important;
}
/* Stats card (local profile card injected into messages area) */
.u4ea-stats-card {
    display:block !important;
    box-sizing:border-box !important;
    position:relative !important;
    flex-shrink:0 !important;
    width:calc(100% - .6rem) !important;
    margin:.5rem .3rem .3rem !important;
    background:rgba(0,0,0,.6) !important;
    border:1px solid var(--border-strong) !important;
    border-radius:8px !important;
    box-shadow:0 2px 16px rgba(0,0,0,.5) !important;
    overflow:visible !important;
    z-index:10 !important;
}
.u4ea-stats-card-header {
    display:flex !important;
    align-items:center !important;
    gap:.6rem !important;
    padding:.55rem .7rem .5rem !important;
    background:rgba(var(--green),.04) !important;
    border-bottom:1px solid rgba(var(--green),.1) !important;
    border-radius:7px 7px 0 0 !important;
}
.u4ea-stats-card-avatar {
    display:block !important;
    width:40px !important;
    height:40px !important;
    border-radius:50% !important;
    object-fit:cover !important;
    border:2px solid !important;
    flex-shrink:0 !important;
}
.u4ea-stats-card-meta {
    display:block !important;
    flex:1 !important;
    min-width:0 !important;
}
.u4ea-stats-card-name {
    display:block !important;
    font-family:Orbitron,monospace !important;
    font-size:.65rem !important;
    font-weight:700 !important;
    letter-spacing:.5px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}
.u4ea-stats-card-role {
    display:block !important;
    font-family:Orbitron,monospace !important;
    font-size:.52rem !important;
    font-weight:700 !important;
    letter-spacing:.7px !important;
    text-transform:uppercase !important;
    opacity:.7 !important;
    margin-top:.15rem !important;
}
.u4ea-stats-card-body {
    display:block !important;
    padding:.5rem .75rem .6rem !important;
}
.u4ea-stats-card-row {
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    padding:.18rem 0 !important;
    font-size:.72rem !important;
    line-height:1.4 !important;
}
.u4ea-stats-card-label {
    color:var(--text-muted)!important;
}
.u4ea-stats-card-value {
    color:var(--text-primary)!important;
    font-weight:600 !important;
}
.u4ea-stats-card-close {
    position:absolute !important;
    top:.4rem !important;
    right:.5rem !important;
    background:none !important;
    border:none !important;
    cursor:pointer !important;
    color:rgba(var(--text-muted-rgb),.4) !important;
    font-size:.78rem !important;
    padding:2px 5px !important;
    line-height:1 !important;
}
.u4ea-chat-input-area {
    border-top:1px solid var(--border)!important;
    padding:.5rem!important;
    display:flex!important; gap:.4rem!important;
}
.u4ea-chat-input {
    flex:1!important;
    background:rgba(var(--green),.03)!important;
    border:1px solid rgba(var(--green),.12)!important;
    border-radius:6px!important;
    padding:.45rem .6rem!important;
    color:var(--text-primary)!important;
    font-size:.8rem!important;
    outline:none!important;
    font-family:inherit!important;
    min-height:2.1rem!important;
    max-height:4rem!important;
    overflow-y:auto!important;
    white-space:pre-wrap!important;
    word-break:break-word!important;
    line-height:1.4!important;
    display:flex!important;
    align-items:center!important;
    cursor:text!important;
}
/* Placeholder via data-placeholder + :empty */
.u4ea-chat-input:empty::before {
    content:attr(data-placeholder)!important;
    color:var(--text-muted)!important;
    pointer-events:none!important;
}
.u4ea-chat-input:focus { border-color:var(--border-bright)!important; }
/* Size emoji images inside the contenteditable */
.u4ea-chat-input img.u4ea-emoji-img {
    width:1.94rem!important; height:1.94rem!important;
    object-fit:contain!important; vertical-align:middle!important;
    display:inline-block!important;
}
.u4ea-chat-send {
    background:rgba(var(--green),.08)!important;
    border:1px solid var(--border-strong)!important;
    border-radius:6px!important;
    color:var(--accent)!important;
    padding:.4rem .7rem!important;
    font-size:.75rem!important;
    cursor:pointer!important;
    font-family:"Orbitron",monospace!important;
    font-weight:700!important;
    letter-spacing:.5px!important;
    transition:all .2s!important;
}
.u4ea-chat-send:hover {
    background:var(--bg-hover)!important;
    border-color:var(--accent)!important;
}
@media(max-width:480px) {
    .u4ea-chat-panel {
        width:calc(100vw - 20px)!important;
        height:calc(100vh - 120px)!important;
        right:10px!important; bottom:122px!important;
    }
}
.u4ea-chat-delete {
    position:absolute!important;
    right:3.2rem!important;
    top:.3rem!important;
    background:rgba(4,10,20,.88)!important;
    border:1px solid rgba(var(--pink),.2)!important;
    border-radius:4px!important;
    color:rgba(var(--pink),.6)!important;
    font-size:.78rem!important;
    cursor:pointer!important;
    padding:.1rem .4rem!important;
    line-height:1.5!important;
    display:inline-flex!important; align-items:center!important;
    opacity:0!important;
    transition:opacity .12s, color .12s, border-color .12s, background .12s!important;
    z-index:3!important;
    pointer-events:none!important;
    flex-shrink:0!important;
}
.u4ea-chat-delete svg { display:block!important; pointer-events:none!important; }
.u4ea-chat-msg:hover .u4ea-chat-delete { opacity:1!important; pointer-events:auto!important; }
.u4ea-chat-delete:hover {
    color:var(--accent-pink)!important;
    border-color:rgba(var(--pink),.5)!important;
    background:rgba(var(--pink),.1)!important;
}
.u4ea-chat-edit {
    background:none!important; border:none!important;
    color:var(--text-dim)!important; font-size:.85rem!important;
    cursor:pointer!important; padding:0 .3rem!important;
    line-height:1!important; display:inline-flex!important;
    align-items:center!important;
    opacity:0!important; transition:color .15s, opacity .15s!important;
    flex-shrink:0!important;
}
.u4ea-chat-edit svg { display:block!important; pointer-events:none!important; }
.u4ea-chat-msg:hover .u4ea-chat-edit { opacity:1!important; }
.u4ea-chat-edit:hover { color:var(--accent-cyan)!important; }
/* Inline message edit */
.u4ea-chat-msg-edit-wrap {
    display:flex!important; flex-direction:column!important; gap:.35rem!important;
    margin-top:.25rem!important;
}
.u4ea-chat-msg-edit-input {
    width:100%!important; box-sizing:border-box!important;
    background:var(--bg-surface)!important; border:1px solid rgba(var(--cyan),.3)!important;
    border-radius:5px!important; color:var(--text-primary)!important;
    font-size:.8rem!important; line-height:1.35!important;
    padding:.35rem .5rem!important; resize:vertical!important;
    outline:none!important; min-height:2.4rem!important;
    font-family:inherit!important;
}
.u4ea-chat-msg-edit-input:focus { border-color:rgba(var(--cyan),.6)!important; }
.u4ea-chat-msg-edit-actions {
    display:flex!important; gap:.4rem!important; align-items:center!important;
}
.u4ea-chat-edit-save, .u4ea-chat-edit-cancel {
    font-size:.68rem!important; padding:.2rem .55rem!important;
    border-radius:4px!important; cursor:pointer!important;
    border:none!important; font-family:inherit!important;
}
.u4ea-chat-edit-save {
    background:var(--accent-cyan)!important; color:var(--on-accent)!important; font-weight:700!important;
}
.u4ea-chat-edit-save:hover { background:var(--hover-cyan)!important; }
.u4ea-chat-edit-cancel {
    background:rgba(255,255,255,.07)!important; color:var(--text-base)!important;
}
.u4ea-chat-edit-cancel:hover { background:rgba(255,255,255,.12)!important; }
.u4ea-chat-edit-hint {
    font-size:.6rem!important; color:rgba(var(--text-muted-rgb),.5)!important;
    margin-left:auto!important;
}
/* Edited badge */
.u4ea-chat-msg-edited {
    font-size:.55rem!important; color:rgba(var(--text-muted-rgb),.65)!important;
    font-style:italic!important; margin-left:.3rem!important;
    cursor:default!important;
}
/* ── Roster status line ───────────────────────────────────────────────────── */
.u4ea-roster-name-wrap { display:flex!important; flex-direction:column!important; min-width:0!important; }
.u4ea-roster-status {
    font-size:.6rem!important; color:rgba(var(--text-muted-rgb),.55)!important;
    font-style:italic!important; display:block!important;
    white-space:nowrap!important; overflow:hidden!important;
    text-overflow:ellipsis!important; line-height:1.2!important;
    margin-top:1px!important; max-width:130px!important;
}
/* ── Status bar in chat panel ─────────────────────────────────────────────── */
.u4ea-chat-status-bar {
    display:flex!important; align-items:center!important; gap:.4rem!important;
    padding:.25rem .4rem!important;
    background:rgba(var(--cyan),.04)!important;
    border:1px solid rgba(var(--cyan),.1)!important;
    border-radius:5px!important;
    cursor:pointer!important;
}
.u4ea-chat-my-status {
    font-size:.72rem!important; color:rgba(var(--text-muted-rgb),.75)!important;
}
.u4ea-chat-status-pencil {
    font-size:.75rem!important; opacity:.4!important; flex-shrink:0!important;
    transition:opacity .15s!important;
}
.u4ea-chat-status-bar:hover .u4ea-chat-status-pencil { opacity:.9!important; }
.u4ea-chat-status-input-row {
    display:none!important; flex-direction:column!important; gap:.4rem!important;
    margin-top:.4rem!important;
}
.u4ea-chat-status-input-row.visible { display:flex!important; }
.u4ea-chat-status-field {
    width:100%!important; box-sizing:border-box!important; background:var(--bg-surface)!important;
    border:1px solid rgba(var(--cyan),.25)!important; border-radius:4px!important;
    color:var(--text-primary)!important; font-size:.75rem!important; font-style:italic!important;
    padding:.3rem .5rem!important; outline:none!important; font-family:inherit!important;
}
.u4ea-chat-status-field:focus { border-color:rgba(var(--cyan),.55)!important; }
.u4ea-status-btns { display:flex!important; gap:.4rem!important; }
.u4ea-chat-status-ok, .u4ea-chat-status-clr {
    flex:1!important; font-size:.68rem!important; padding:.28rem .5rem!important;
    border-radius:4px!important; cursor:pointer!important; border:none!important;
    font-family:inherit!important; font-weight:600!important;
}
.u4ea-chat-status-ok  { background:var(--accent-cyan)!important; color:var(--bg-surface)!important; }
.u4ea-chat-status-ok:hover  { background:var(--hover-cyan)!important; }
.u4ea-chat-status-clr { background:rgba(var(--error-rgb),.18)!important; color:var(--accent-pink)!important; }
.u4ea-chat-status-clr:hover { background:rgba(255,60,60,.3)!important; }
/* ── Pinned message bar ───────────────────────────────────────────────────── */
.u4ea-chat-pinned-bar {
    display:none!important; align-items:flex-start!important; gap:.5rem!important;
    padding:.35rem .75rem!important;
    background:rgba(0,180,100,.06)!important;
    border-bottom:1px solid rgba(0,200,100,.15)!important;
    cursor:pointer!important;
}
.u4ea-chat-pinned-bar.visible { display:flex!important; }
.u4ea-chat-pinned-icon { font-size:.8rem!important; flex-shrink:0!important; margin-top:1px!important; }
.u4ea-chat-pinned-body { flex:1!important; min-width:0!important; }
.u4ea-chat-pinned-label {
    font-size:.58rem!important; color:rgba(0,220,120,.6)!important;
    font-weight:700!important; letter-spacing:.4px!important;
    text-transform:uppercase!important; display:block!important;
}
.u4ea-chat-pinned-text {
    font-size:.68rem!important; color:var(--text-base)!important;
    white-space:nowrap!important; overflow:hidden!important;
    text-overflow:ellipsis!important; display:block!important;
}
.u4ea-chat-unpin-btn {
    background:none!important; border:none!important; color:rgba(var(--text-muted-rgb),.35)!important;
    cursor:pointer!important; font-size:.75rem!important; padding:0!important;
    flex-shrink:0!important; line-height:1!important; margin-top:1px!important;
}
.u4ea-chat-unpin-btn:hover { color:var(--accent-pink)!important; }
/* Pin button on messages (mods only) */
.u4ea-chat-pin-btn {
    background:none!important; border:none!important;
    color:var(--text-dim)!important; font-size:.72rem!important;
    cursor:pointer!important; padding:0 .3rem!important;
    line-height:1!important; display:inline-flex!important; align-items:center!important;
    opacity:0!important; transition:color .15s, opacity .15s!important; flex-shrink:0!important;
}
.u4ea-chat-msg:hover .u4ea-chat-pin-btn { opacity:1!important; }
.u4ea-chat-pin-btn:hover { color:var(--accent)!important; }
/* ── Channel topic bar ────────────────────────────────────────────────────── */
.u4ea-chat-topic-bar {
    display:flex!important; align-items:center!important; gap:.5rem!important;
    padding:.28rem .75rem!important;
    background:rgba(0,150,220,.06)!important;
    border-bottom:1px solid rgba(0,180,255,.12)!important;
}
.u4ea-chat-topic-icon { font-size:.78rem!important; flex-shrink:0!important; }
.u4ea-chat-topic-text {
    font-size:.67rem!important; color:var(--text-base)!important;
    white-space:nowrap!important; overflow:hidden!important;
    text-overflow:ellipsis!important; flex:1!important;
}
/* ── Reply / quote ────────────────────────────────────────────────────────── */
.u4ea-chat-reply-preview {
    display:none!important; align-items:center!important; gap:.5rem!important;
    padding:.25rem .7rem!important;
    background:rgba(0,180,220,.06)!important;
    border-left:2px solid rgba(0,180,220,.4)!important;
    border-bottom:1px solid rgba(0,180,220,.1)!important;
}
.u4ea-chat-reply-preview.visible { display:flex!important; }
.u4ea-chat-reply-preview-text {
    flex:1!important; font-size:.63rem!important; color:rgba(140,190,220,.7)!important;
    white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;
    font-style:italic!important;
}
.u4ea-chat-reply-preview-text strong { color:rgba(var(--cyan),.7)!important; font-style:normal!important; }
.u4ea-chat-reply-cancel {
    background:none!important; border:none!important; cursor:pointer!important;
    color:rgba(var(--text-muted-rgb),.45)!important; font-size:.8rem!important; padding:0!important;
    flex-shrink:0!important; line-height:1!important;
}
.u4ea-chat-reply-cancel:hover { color:var(--accent-pink)!important; }
/* Quote block inside a rendered message */
.u4ea-chat-msg-quote {
    display:block!important; border-left:2px solid rgba(var(--cyan),.3)!important;
    padding:.2rem .5rem!important; margin-bottom:.3rem!important;
    background:rgba(0,120,180,.07)!important; border-radius:0 4px 4px 0!important;
    cursor:pointer!important;
}
.u4ea-chat-msg-quote-user {
    font-size:.58rem!important; color:rgba(var(--cyan),.6)!important;
    font-weight:700!important; display:block!important;
}
.u4ea-chat-msg-quote-text {
    font-size:.65rem!important; color:rgba(140,180,200,.65)!important;
    white-space:nowrap!important; overflow:hidden!important;
    text-overflow:ellipsis!important; display:block!important; font-style:italic!important;
}
/* Reply button — floats as absolute overlay on the right of the message row */
.u4ea-chat-reply-btn {
    position:absolute!important;
    right:.5rem!important;
    top:.3rem!important;
    background:rgba(4,10,20,.88)!important;
    border:1px solid rgba(var(--cyan),.2)!important;
    border-radius:4px!important;
    color:rgba(var(--cyan),.6)!important;
    font-size:.78rem!important;
    cursor:pointer!important;
    padding:.1rem .4rem!important;
    line-height:1.5!important;
    opacity:0!important;
    transition:opacity .12s, color .12s, border-color .12s, background .12s!important;
    z-index:3!important;
    white-space:nowrap!important;
    pointer-events:none!important;
}
.u4ea-chat-msg:hover .u4ea-chat-reply-btn {
    opacity:1!important;
    pointer-events:auto!important;
}
.u4ea-chat-reply-btn:hover {
    color:var(--accent-cyan)!important;
    border-color:rgba(var(--cyan),.5)!important;
    background:rgba(var(--cyan),.1)!important;
}
/* Touch screens: always faintly visible so it can be tapped */
@media (hover: none) {
    .u4ea-chat-reply-btn {
        opacity:.38!important;
        pointer-events:auto!important;
    }
    .u4ea-chat-msg:active .u4ea-chat-reply-btn { opacity:1!important; }
}
/* ── Chat search ──────────────────────────────────────────────────────────── */
.u4ea-chat-search-btn {
    background:none!important; border:none!important; cursor:pointer!important;
    color:rgba(var(--text-muted-rgb),.5)!important; font-size:.8rem!important;
    padding:0 .3rem!important; line-height:1!important;
    transition:color .15s!important;
}
.u4ea-chat-search-btn:hover, .u4ea-chat-search-btn.active { color:var(--accent-cyan)!important; }
.u4ea-chat-search-bar {
    display:none!important; align-items:center!important; gap:.4rem!important;
    padding:.3rem .6rem!important;
    border-bottom:1px solid rgba(var(--cyan),.15)!important;
    background:var(--bg-searchbar)!important;
}
.u4ea-chat-search-bar.visible { display:flex!important; }
.u4ea-chat-search-input {
    flex:1!important; background:var(--bg-surface)!important;
    border:1px solid rgba(var(--cyan),.2)!important; border-radius:4px!important;
    color:var(--text-primary)!important; font-size:.75rem!important;
    padding:.25rem .5rem!important; outline:none!important; font-family:inherit!important;
}
.u4ea-chat-search-input:focus { border-color:rgba(var(--cyan),.5)!important; }
/* ── Search controls (count + nav + clear) ── */
.u4ea-search-controls {
    display:none!important; align-items:center!important; gap:2px!important;
    flex-shrink:0!important;
}
.u4ea-search-controls.visible { display:flex!important; }
.u4ea-search-count {
    font-size:.6rem!important; color:rgba(var(--cyan),.55)!important;
    white-space:nowrap!important; padding:0 4px!important;
    font-family:"Orbitron",monospace!important; letter-spacing:.5px!important;
}
.u4ea-search-nav {
    background:none!important; border:none!important; cursor:pointer!important;
    color:rgba(var(--text-muted-rgb),.6)!important; font-size:.8rem!important;
    padding:0!important; line-height:1!important;
    width:22px!important; height:22px!important;
    display:inline-flex!important; align-items:center!important; justify-content:center!important;
    border-radius:3px!important; transition:background .12s,color .12s!important;
    touch-action:manipulation!important;
}
.u4ea-search-nav > * { pointer-events:none!important; }
.u4ea-search-nav:hover { background:rgba(var(--cyan),.1)!important; color:var(--accent-cyan)!important; }
.u4ea-search-nav:disabled { opacity:.3!important; cursor:default!important; }
.u4ea-search-clear:hover { color:var(--accent-pink)!important; background:rgba(var(--pink),.08)!important; }
/* Deprecated standalone close — kept for safety but superseded by .u4ea-search-clear */
.u4ea-chat-search-close {
    background:none!important; border:none!important; cursor:pointer!important;
    color:rgba(var(--text-muted-rgb),.5)!important; font-size:.85rem!important;
    padding:0!important; line-height:1!important;
    touch-action:manipulation!important;
}
.u4ea-chat-search-close:hover { color:var(--accent-pink)!important; }
.u4ea-chat-search-result {
    display:flex!important; gap:.5rem!important; align-items:flex-start!important;
    padding:.4rem .75rem!important; cursor:pointer!important;
    border-bottom:1px solid rgba(var(--cyan),.05)!important;
    transition:background .12s!important;
}
.u4ea-chat-search-result:hover { background:rgba(0,180,255,.06)!important; }
.u4ea-chat-search-result.u4ea-search-active {
    background:rgba(var(--cyan),.1)!important;
    border-left:2px solid var(--accent-cyan)!important;
    padding-left:calc(.75rem - 2px)!important;
}
/* Highlighted match term */
.u4ea-chat-search-result-text mark {
    background:rgba(255,214,0,.22)!important;
    color:var(--accent-gold)!important;
    border-radius:2px!important;
    padding:0 1px!important;
    font-style:normal!important;
}
/* Supplementary meta elements */
.u4ea-search-avatar-link { flex-shrink:0!important; }
.u4ea-search-ts { margin-left:auto!important; }
.u4ea-search-edited { color:rgba(var(--cyan),.35)!important; font-size:.55rem!important; font-style:italic!important; }
.u4ea-chat-search-result-avatar {
    width:22px!important; height:22px!important; border-radius:50%!important;
    flex-shrink:0!important; margin-top:2px!important;
}
.u4ea-chat-search-result-body { flex:1!important; min-width:0!important; }
.u4ea-chat-search-result-meta {
    font-size:.57rem!important; color:rgba(var(--cyan),.5)!important;
    display:flex!important; gap:.4rem!important; margin-bottom:2px!important;
}
.u4ea-chat-search-result-text {
    font-size:.7rem!important; color:var(--text-base)!important;
    white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;
}
.u4ea-chat-search-empty {
    text-align:center!important; padding:1.2rem!important;
    font-size:.72rem!important; color:rgba(var(--text-muted-rgb),.4)!important;
    font-style:italic!important;
}
/* ── In-chat search highlight pulse (Phase 3) ── */
@keyframes u4eaSearchPulse {
    0%   { background:rgba(0,255,140,.22)!important; box-shadow:0 0 0 0 rgba(0,255,140,.45)!important; }
    35%  { background:rgba(0,255,140,.12)!important; box-shadow:0 0 0 5px rgba(0,255,140,.0)!important; }
    100% { background:transparent!important;         box-shadow:none!important; }
}
.u4ea-highlight-search {
    animation:u4eaSearchPulse 2s ease-out forwards!important;
    border-radius:4px!important;
    position:relative!important;
}
/* Drag-and-drop overlay */
.u4ea-chat-drop-overlay {
    display:none!important; position:absolute!important; inset:0!important;
    z-index:10!important; border-radius:12px!important;
    background:rgba(var(--green),.08)!important;
    border:2px dashed rgba(var(--green),.6)!important;
    align-items:center!important; justify-content:center!important;
    flex-direction:column!important; gap:.5rem!important;
    pointer-events:none!important;
}
.u4ea-chat-drop-overlay.active { display:flex!important; }
.u4ea-chat-drop-overlay svg { opacity:.7!important; }
.u4ea-chat-drop-overlay span {
    color:var(--accent)!important; font-family:"Orbitron",monospace!important;
    font-size:.65rem!important; font-weight:700!important; letter-spacing:1.5px!important;
    text-transform:uppercase!important; text-shadow:0 0 10px rgba(var(--green),.5)!important;
}
/* ── AI Config Bot messages ─────────────────────────────────────────────*/
.u4ea-chat-ai-msg { background:rgba(var(--green),.02)!important; border-left:3px solid rgba(var(--green),.25)!important; border-radius:0 6px 6px 0!important; }
.u4ea-chat-ai-avatar { font-size:1.3rem!important; flex-shrink:0!important; margin-top:2px!important; }
.u4ea-chat-ai-block { position:relative!important; margin-top:.35rem!important; }
.u4ea-chat-ai-copy { position:absolute!important; top:.35rem!important; right:.35rem!important; background:rgba(0,0,0,.55)!important; border:1px solid rgba(var(--green),.18)!important; border-radius:4px!important; color:rgba(var(--green),.6)!important; padding:2px 6px!important; cursor:pointer!important; font-size:.7rem!important; line-height:1!important; z-index:2!important; opacity:.65!important; transition:opacity .15s,color .15s,border-color .15s!important; display:flex!important; align-items:center!important; }
.u4ea-chat-ai-copy:hover { opacity:1!important; color:var(--accent)!important; border-color:rgba(var(--green),.4)!important; }
.u4ea-chat-ai-copy.copied { color:var(--accent)!important; border-color:var(--accent)!important; }
.u4ea-chat-ai-copy svg { pointer-events:none!important; }
.u4ea-chat-ai-pre {
    background:rgba(0,0,0,.35)!important;
    border:1px solid rgba(var(--green),.08)!important;
    border-radius:6px!important;
    padding:.7rem .9rem!important;
    color:var(--text-base)!important;
    font-size:.76rem!important;
    line-height:1.45!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    white-space:pre-wrap!important;
    word-break:break-word!important;
    scrollbar-width:thin!important;
    scrollbar-color:var(--border) transparent!important;
}
/* ── Scroll-to-bottom button ─────────────────────────────────────────────*/
#u4eaChatScrollBtn {
    position:sticky!important; bottom:8px!important;
    align-self:flex-end!important; margin-right:6px!important;
    flex-shrink:0!important;
    width:28px!important; height:28px!important;
    border-radius:50%!important;
    background:rgba(var(--green),.13)!important;
    border:1px solid var(--border-bright)!important;
    color:var(--accent)!important;
    cursor:pointer!important;
    align-items:center!important; justify-content:center!important;
    transition:opacity .2s,background .2s,transform .15s!important;
    z-index:5!important;
    box-shadow:0 2px 8px rgba(0,0,0,.4)!important;
}
#u4eaChatScrollBtn:hover {
    background:rgba(var(--green),.25)!important;
    transform:scale(1.1)!important;
}
#u4eaChatScrollBtn svg { display:block!important; pointer-events:none!important; }
/* ── Jump-to-unread bar ──────────────────────────────────────────────────*/
.u4ea-chat-unread-bar {
    display:flex; align-items:center; gap:.5rem;
    padding:0 .75rem;
    background:rgba(var(--green),.9);
    font-size:.62rem; font-family:"Orbitron",monospace;
    letter-spacing:.8px; color:var(--dark-green); font-weight:700;
    cursor:pointer; flex-shrink:0; user-select:none;
    max-height:0; overflow:hidden; opacity:0; pointer-events:none;
    transition:max-height .28s ease, opacity .28s ease, padding .28s ease;
}
.u4ea-chat-unread-bar.u4ea-bar-visible {
    max-height:2.8rem; opacity:1; pointer-events:auto;
    padding:.3rem .75rem;
}
.u4ea-chat-unread-bar:hover { background:rgba(var(--green),1); }
.u4ea-chat-unread-bar-text {
    flex:1; overflow:hidden;
    white-space:nowrap; text-overflow:ellipsis;
}
.u4ea-chat-unread-dismiss {
    background:rgba(0,0,0,.18); border:none;
    color:var(--dark-green); font-size:.78rem;
    cursor:pointer; padding:0 .28rem; line-height:1;
    flex-shrink:0; border-radius:3px;
    display:inline-flex; align-items:center; justify-content:center;
    min-width:20px; min-height:20px;
    transition:background .15s;
}
.u4ea-chat-unread-dismiss:hover { background:rgba(0,0,0,.32); }
.u4ea-chat-unread-bar .u4ea-chat-unread-dot {
    width:7px!important; height:7px!important; min-width:7px!important;
    border-radius:50%!important; background:var(--dark-green)!important;
    animation:u4ea-unread-pulse 1.4s ease-in-out infinite!important;
    flex-shrink:0!important; display:inline-block!important; margin-left:0!important;
}
@keyframes u4ea-unread-pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(.65);}}
/* ── Message flash on jump-to-unread ─────────────────────────────────────*/
@keyframes u4ea-msg-flash{0%{background:rgba(var(--green),.12);}100%{background:transparent;}}
.u4ea-msg-unread-flash {
    animation:u4ea-msg-flash 1.6s ease-out forwards!important;
    border-radius:4px!important;
}
/* ── Connection status bar ───────────────────────────────────────────────*/
.u4ea-chat-connection-bar {
    display:flex; align-items:center; gap:.5rem;
    padding:.35rem .75rem;
    background:rgba(255,180,0,.12);
    border-bottom:1px solid rgba(255,180,0,.25);
    font-size:.62rem; font-family:"Exo 2",sans-serif;
    letter-spacing:.3px; color:var(--accent-warn); font-weight:600;
    flex-shrink:0; user-select:none;
    transition:background .3s, color .3s;
}
.u4ea-chat-connection-bar[hidden] { display:none; }
.u4ea-chat-connection-bar.u4ea-conn-error {
    background:rgba(var(--error-rgb),.1);
    border-bottom-color:rgba(var(--error-rgb),.2);
    color:var(--accent-error);
}
.u4ea-chat-connection-icon {
    width:14px; height:14px; flex-shrink:0;
    border:2px solid currentColor;
    border-radius:50%;
    position:relative;
}
.u4ea-chat-connection-icon::after {
    content:"";
    position:absolute; top:50%; left:50%;
    width:2px; height:6px;
    background:currentColor;
    transform:translate(-50%,-50%) rotate(0deg);
    transform-origin:center bottom;
    animation:u4ea-conn-spin 1.2s linear infinite;
}
.u4ea-chat-connection-bar.u4ea-conn-error .u4ea-chat-connection-icon::after {
    animation:none;
    width:8px; height:2px;
    transform:translate(-50%,-50%) rotate(45deg);
}
.u4ea-chat-connection-bar.u4ea-conn-error .u4ea-chat-connection-icon::before {
    content:"";
    position:absolute; top:50%; left:50%;
    width:8px; height:2px;
    background:currentColor;
    transform:translate(-50%,-50%) rotate(-45deg);
}
@keyframes u4ea-conn-spin{0%{transform:translate(-50%,-50%) rotate(0deg);}100%{transform:translate(-50%,-50%) rotate(360deg);}}
/* ══ HIGH CONTRAST TOGGLE ══ */
.u4ea-chat-hc-toggle {
    background: none !important;
    border: none !important;
    color: var(--text) !important;
    font-size: 1.1rem !important;
    cursor: pointer !important;
    padding: 2px 6px !important;
    opacity: .7 !important;
    line-height: 1 !important;
    transition: opacity .15s, color .15s !important;
}
.u4ea-chat-hc-toggle:hover {
    opacity: 1 !important;
    color: var(--neon-green) !important;
}
.u4ea-chat-hc-toggle.hc-active {
    opacity: 1 !important;
    color: var(--neon-green) !important;
}
/* ── Reduced motion: pause all chat animations ───────────────────────────────*/
@media (prefers-reduced-motion: reduce) {
    .u4ea-chat-viewers-dot,
    .u4ea-chat-msg-unread-dot { animation:none!important; }
    .u4ea-msg-unread-flash { animation:none!important; }
    .u4ea-chat-search-pulse { animation:none!important; }
}
