.attachment{display:grid;gap:8px;min-width:180px;max-width:min(420px,70vw)}
.attachment img,.attachment video{display:block;width:100%;max-height:360px;border-radius:12px;object-fit:contain;background:#0d1728}
.attachment-file{display:flex;align-items:center;gap:10px;padding:10px;border-radius:11px;background:#eef2f7;color:#17233b;text-decoration:none}
.mine .attachment-file{background:#ffffff18;color:#fff}.attachment-file b{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#3976ea;color:#fff;font-size:18px}.attachment-file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.attachment-loading{padding:18px;color:#8994a5;font-size:10px;text-align:center}.uploading{opacity:.55;pointer-events:none}
.attachment-loading{display:grid;gap:9px;min-width:min(260px,68vw)}.attachment-loading-progress{display:block;width:100%;height:4px;overflow:hidden;border-radius:99px;background:#81917f2e}.attachment-loading-progress b{display:block;width:4%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#73952e,#cfff57);box-shadow:0 0 12px #cfff5788;transition:width .3s ease}
@media(max-width:700px){.attachment{max-width:72vw}.attachment img,.attachment video{max-height:52dvh}}
.voice-attachment audio{display:block;width:min(310px,68vw);height:42px}.round-video-attachment{min-width:0}.round-video-attachment video{width:240px;height:240px;max-height:none!important;border:4px solid #cfff57;border-radius:50%;object-fit:cover;box-shadow:0 14px 38px #0b160e4a}.call-history-bubble{position:relative;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:9px;min-width:210px}.call-history-bubble .call-history-icon{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#cfff57;color:#132119;font-size:17px}.call-history-bubble p,.call-history-bubble time{grid-column:2}.call-history-bubble p{margin:0}@media(max-width:700px){.round-video-attachment video{width:min(220px,62vw);height:min(220px,62vw)}}
.round-video-attachment video{cursor:pointer}.round-video-player{position:fixed;z-index:500;inset:0;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#020604ed;backdrop-filter:blur(18px);animation:round-player-in .28s ease both}.round-video-player video{display:block;width:min(760px,88vw,82vh);height:min(760px,88vw,82vh);border:5px solid #cfff57;border-radius:50%;object-fit:cover;background:#000;box-shadow:0 30px 110px #000,0 0 0 1px #dcff7c66;outline:0}.round-video-player video::-webkit-media-controls{display:none!important}.round-video-player video::-webkit-media-controls-enclosure{display:none!important}@keyframes round-player-in{from{opacity:0}to{opacity:1}}@media(max-width:700px){.round-video-player video{width:min(88vw,72vh);height:min(88vw,72vh);border-width:4px}}
.round-video-attachment video,.round-video-player video{border:0!important;box-shadow:none!important}
.round-video-attachment video{background:radial-gradient(circle,#28352c,#0a0f0c);transition:filter .25s ease}.round-video-attachment video:not(.poster-ready){filter:brightness(.72)}.round-video-attachment video.poster-ready{filter:none}
.attachment.attachment-carousel{position:relative;display:block;width:min(420px,70vw);max-width:none;overflow:hidden;border-radius:22px;background:#111;box-shadow:0 12px 34px #0002}.attachment-carousel-viewport,.attachment-carousel-track{border-radius:inherit}.attachment-carousel-viewport{width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x}.attachment-carousel-viewport::-webkit-scrollbar{display:none}.attachment-carousel-track{display:flex;width:100%}.attachment-carousel-slide{position:relative;display:grid;flex:0 0 100%;width:100%;min-width:0;aspect-ratio:4/5;place-items:center;overflow:hidden;border-radius:22px;isolation:isolate;scroll-snap-align:start;scroll-snap-stop:always;background:#111}.attachment-carousel-slide>.attachment-loading{z-index:2;margin:auto}.attachment-carousel-slide>img,.attachment-carousel-slide>video{width:100%;height:100%;max-height:none;border-radius:inherit;object-fit:contain;background:transparent}.attachment-carousel-slide>.attachment-carousel-ambient{position:absolute;z-index:-1;inset:-9%;width:118%;height:118%;border-radius:0;object-fit:cover;filter:blur(22px) saturate(1.18) brightness(.72);transform:scale(1.06);pointer-events:none}.attachment-carousel-slide>.attachment-carousel-image{position:relative;z-index:1;object-fit:contain;filter:drop-shadow(0 4px 14px #0005);cursor:pointer}.attachment-carousel-slide>.attachment-file{width:calc(100% - 24px);margin:auto}.attachment-carousel-dots{position:absolute;z-index:3;right:0;bottom:11px;left:0;display:flex;justify-content:center;gap:6px;pointer-events:none}.attachment-carousel-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#fff8;box-shadow:0 1px 5px #0008;pointer-events:auto;transition:width .2s ease,background .2s ease,transform .2s ease}.attachment-carousel-dots button.active{width:18px;border-radius:99px;background:#cfff57;transform:scale(1.04)}
@media(max-width:700px){.attachment.attachment-carousel{width:min(82vw,380px);max-width:82vw}.attachment-carousel-slide{aspect-ratio:4/5}.attachment-carousel-dots{bottom:9px}}

/* Album previews fill the frame; tapping still opens the uncropped original. */
.attachment-carousel-slide>.attachment-carousel-image{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;filter:none!important}
.attachment-carousel-slide>.attachment-carousel-ambient{display:none!important}

/* Safari can preserve an intrinsic image height inside a snapping flex item. */
.attachment-carousel-track{align-items:stretch!important}
.attachment-carousel-slide{flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important}
.attachment-carousel-slide>img.attachment-carousel-image{position:absolute!important;inset:0!important;display:block!important;width:100%!important;min-width:100%!important;max-width:none!important;height:100%!important;min-height:100%!important;max-height:none!important;margin:0!important;border-radius:inherit!important;object-fit:cover!important;object-position:center!important}
.attachment-carousel-viewport{touch-action:pan-x pan-y!important;overscroll-behavior-y:auto!important}
.voice-attachment,.round-video-attachment,.attachment-file{touch-action:pan-y!important}
.message-line .attachment:has(.attachment-file){width:auto!important;min-width:0!important;max-width:min(280px,70vw)!important;background:transparent!important}
.message-line .attachment-file{width:auto!important;max-width:min(280px,70vw)!important;padding:5px 2px!important;border:0!important;background:transparent!important;box-shadow:none!important}
.attachment-carousel-dots{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:none!important}.attachment-carousel-dots button{display:block!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}

/* Larger edge-to-edge albums. Originals still open uncropped on tap. */
.attachment.attachment-carousel{width:min(520px,78vw)!important}
.attachment-carousel-slide>img.attachment-carousel-image,.attachment-carousel-slide>video{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
@media(max-width:700px){.attachment.attachment-carousel{width:min(calc(100vw - 72px),430px)!important;max-width:calc(100vw - 72px)!important}}
