.chat-media-composer{position:relative;transition:border-color .15s ease,box-shadow .15s ease}
.chat-media-composer.is-dragging{outline:2px dashed rgba(255,106,0,.55);outline-offset:-4px;box-shadow:inset 0 0 35px rgba(255,106,0,.06)}
.chat-media-editor{position:relative;min-width:0}
.chat-media-toolbar{display:flex;align-items:center;gap:6px;margin-bottom:7px}
.standalone-toolbar{margin:0}
.chat-media-tool{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:29px;padding:5px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.07);background:#ffffff04;color:#d4d4d8;font:inherit;font-size:11px;cursor:pointer;transition:.15s}
.chat-media-tool:hover{border-color:rgba(255,106,0,.35);background:rgba(255,106,0,.07);color:#fff}
.chat-media-format-hint{margin-left:auto;color:#606068;font-size:9px}
.chat-emoji-panel{position:absolute;left:0;bottom:calc(100% + 8px);z-index:80;width:286px;max-height:190px;overflow-y:auto;display:grid;grid-template-columns:repeat(8,1fr);gap:3px;padding:9px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:#161619;box-shadow:0 18px 55px rgba(0,0,0,.45)}
.chat-emoji-panel[hidden]{display:none}
.chat-emoji{width:31px;height:31px;border:0;border-radius:7px;background:transparent;font-size:19px;cursor:pointer}
.chat-emoji:hover{background:#ffffff0b;transform:scale(1.08)}
.chat-media-preview{display:grid;grid-template-columns:48px minmax(0,1fr) 28px;align-items:center;gap:9px;margin:6px 0 8px;padding:7px;border-radius:10px;background:#0c0c0f;border:1px solid rgba(255,255,255,.07)}
.chat-media-preview[hidden]{display:none}
.chat-media-preview img{width:48px;height:48px;border-radius:8px;object-fit:cover;background:#09090b}
.chat-media-preview>div{min-width:0;display:grid;gap:2px}
.chat-media-preview b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-media-preview span{font-size:9px;color:#72727b}
.chat-media-preview>button{width:27px;height:27px;border:0;border-radius:7px;background:transparent;color:#777;cursor:pointer}
.chat-media-preview>button:hover{background:#ef444414;color:#f87171}
.chat-message-media{position:relative;display:block;width:min(100%,360px);margin-top:7px;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.075);background:#08080a;cursor:zoom-in}
.chat-message-media img{display:block;width:100%;max-height:340px;object-fit:contain;background:#08080a}
.global-chat-media{width:min(100%,420px)}
.chat-gif-badge{position:absolute;left:8px;bottom:8px;padding:3px 6px;border-radius:6px;background:rgba(0,0,0,.72);color:#fff;font-size:8px;font-weight:900;letter-spacing:.08em;pointer-events:none}
.chat-media-lightbox{width:min(94vw,1200px);height:min(92vh,900px);padding:0;border:0;border-radius:14px;background:#09090b;box-shadow:0 25px 90px rgba(0,0,0,.75);overflow:hidden}
.chat-media-lightbox::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(3px)}
.chat-media-lightbox img{display:block;width:100%;height:100%;max-height:92vh;object-fit:contain}
.chat-media-lightbox-close{position:absolute;right:10px;top:10px;z-index:2;width:36px;height:36px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(0,0,0,.7);color:#fff;font-size:15px;cursor:pointer}
@media(max-width:600px){.chat-media-format-hint{display:none}.chat-emoji-panel{width:min(286px,calc(100vw - 48px));grid-template-columns:repeat(7,1fr)}.chat-message-media{width:100%}}


/* Audio / video / voice */
.chat-voice-button.recording{
    color:#ff8686;
    border-color:rgba(239,68,68,.38);
    background:rgba(239,68,68,.12);
    animation:chatVoicePulse 1.1s ease-in-out infinite
}
@keyframes chatVoicePulse{
    50%{box-shadow:0 0 0 5px rgba(239,68,68,.06)}
}
.chat-voice-status{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:#f87171;
    font-size:9px;
    font-weight:750
}
.chat-voice-status[hidden]{display:none}
.chat-media-preview-visual{
    width:48px;height:48px;border-radius:8px;
    display:grid;place-items:center;
    background:#15151a;overflow:hidden
}
.chat-media-preview-visual img{
    width:48px;height:48px;object-fit:cover
}
.chat-media-preview-visual span{
    font-size:23px
}
.chat-media-preview-visual span[hidden],
.chat-media-preview-visual img[hidden]{
    display:none
}
.chat-audio-card,
.chat-video-card{
    width:min(100%,430px);
    margin-top:8px;
    padding:9px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.075);
    background:#0b0b0e
}
.chat-audio-card.voice{
    border-color:rgba(255,106,0,.2);
    background:
        linear-gradient(135deg,rgba(255,106,0,.055),transparent 55%),
        #0b0b0e
}
.chat-media-player-label{
    margin:0 0 7px;
    color:#a7a7b0;
    font-size:10px;
    font-weight:750
}
.chat-audio-card audio{
    display:block;
    width:100%;
    height:38px
}
.chat-video-card video{
    display:block;
    width:100%;
    max-height:390px;
    border-radius:8px;
    background:#050506
}
.global-chat-player{
    width:min(100%,480px)
}
@media(max-width:600px){
    .chat-audio-card,
    .chat-video-card,
    .global-chat-player{
        width:100%
    }
}