dialog.chat-media-viewer{position:fixed;inset:0;box-sizing:border-box;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#0b1117f8;color:#e9edef;box-shadow:none;overflow:hidden;color-scheme:dark}
dialog.chat-media-viewer[open]{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto}
.chat-media-viewer::backdrop{background:#080d12;backdrop-filter:none}
.chat-media-viewer svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.chat-media-viewer button{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:transparent;color:#e9edef;border:0;border-radius:6px;padding:10px;cursor:pointer;font:inherit}
.chat-media-viewer button:hover{background:#ffffff10}.chat-media-viewer button:focus-visible{outline:2px solid #20c997;outline-offset:3px}.chat-media-viewer button:disabled{opacity:.35;cursor:default}
.chat-media-viewer-header{grid-row:1;display:flex;align-items:center;gap:12px;min-height:78px;padding:12px 27px;background:#10171df2;box-sizing:border-box}
.chat-media-viewer-avatar{display:block;position:relative;width:44px;height:44px;border-radius:50%;background:#45515a;color:#ced8de;overflow:hidden;flex:none}
.chat-media-viewer-avatar>svg{width:32px;height:32px;margin:6px}.chat-media-viewer-avatar img{position:absolute;inset:0;width:44px;height:44px;object-fit:cover;border-radius:50%;margin:0}
.chat-media-viewer-author{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.chat-media-viewer-author strong{font-size:14px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.chat-media-viewer-author time{font-size:12px;line-height:16px;color:#aebac1}
.chat-media-viewer-actions{display:flex;align-items:center;gap:18px}.chat-media-viewer-actions button{width:42px;height:42px;padding:9px}
.chat-media-viewer-notice{grid-row:2;padding:8px 20px;text-align:center;background:#563c20;color:#f8e6ce;font-size:13px}
.chat-media-viewer-stage{grid-row:3;position:relative;display:flex;align-items:center;justify-content:center;min-height:0;min-width:0;overflow:hidden}
.chat-media-viewer-frame{position:absolute;inset:14px 76px 8px;display:flex;align-items:center;justify-content:center;min-height:0;min-width:0}
.chat-media-viewer .chat-media-viewer-media{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;margin:0;border-radius:0;background:transparent}
.chat-media-viewer video.chat-media-viewer-media{outline:none}
.chat-media-viewer .chat-media-viewer-previous,.chat-media-viewer .chat-media-viewer-next{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:#ffffff10;z-index:2}
.chat-media-viewer-previous{left:20px}.chat-media-viewer-next{right:20px}.chat-media-viewer .chat-media-viewer-previous:hover,.chat-media-viewer .chat-media-viewer-next:hover{background:#ffffff24}
.chat-media-viewer-loading,.chat-media-viewer-error{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:12px;padding:18px 22px;max-width:min(440px,calc(100% - 130px));border-radius:8px;background:#16222dec;text-align:center;color:#dfe7ec;font-size:14px}
.chat-media-viewer-loading>span{display:block;width:22px;height:22px;border-radius:50%;border:2px solid #ffffff30;border-top-color:#20c997;animation:chat-media-viewer-spin .8s linear infinite;flex:none}
.chat-media-viewer-error{flex-direction:column}.chat-media-viewer-error p{margin:0;line-height:1.5}.chat-media-viewer-error button,.chat-media-viewer-page-error button{border:1px solid #73848f;padding:8px 12px;font-size:13px}
.chat-media-viewer-footer{grid-row:4;display:flex;flex-direction:column;align-items:center;min-width:0;padding:8px 22px 16px;background:linear-gradient(transparent,#10171df0);box-sizing:border-box}
.chat-media-viewer-caption{max-width:min(100%,960px);max-height:72px;overflow:auto;margin:0 0 8px;padding:0 8px;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.45;color:#e9edef}
.chat-media-viewer-caption .chat-link{color:#69c5f1;text-decoration:underline;text-underline-offset:2px}
.chat-media-viewer-count{margin:0 0 10px;font-size:12px;line-height:17px;color:#aebac1;font-variant-numeric:tabular-nums}
.chat-media-viewer-strip{display:flex;align-items:center;gap:9px;width:max-content;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:5px 4px 8px;scrollbar-width:thin;scrollbar-color:#53616b transparent;overscroll-behavior-x:contain;box-sizing:border-box}
.chat-media-viewer-thumbnails{display:flex;align-items:center;gap:9px;flex:none}
.chat-media-viewer .chat-media-viewer-thumb{position:relative;display:flex;width:68px;height:68px;flex:none;overflow:hidden;box-sizing:border-box;padding:14px;border:2px solid transparent;border-radius:5px;background:#26323a;color:#c2ccd2}
.chat-media-viewer-thumb>svg{width:32px;height:32px}.chat-media-viewer-thumb img{position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;object-fit:cover}
.chat-media-viewer .chat-media-viewer-thumb[aria-current="true"]{border-color:#06cf9c;box-shadow:0 0 0 1px #06cf9c}.chat-media-viewer .chat-media-viewer-thumb[aria-current="true"]:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px #06cf9c;pointer-events:none}
.chat-media-viewer-video-mark{position:absolute;right:4px;bottom:3px;padding:0 3px;border-radius:3px;font-size:12px;background:#0009;color:#fff}
.chat-media-viewer .chat-media-viewer-page{flex:none;flex-direction:column;gap:3px;width:58px;height:68px;padding:7px;border:1px solid #384650;font-size:11px}
.chat-media-viewer-page-error{display:flex;align-items:center;gap:12px;padding:8px 0 0;font-size:12px;color:#efc8a8}
.chat-media-viewer [hidden]{display:none!important}
@keyframes chat-media-viewer-spin{to{transform:rotate(360deg)}}
@media(max-width:650px){.chat-media-viewer-header{min-height:66px;padding:9px 12px;gap:9px}.chat-media-viewer-actions{gap:5px}.chat-media-viewer-actions button{width:36px;height:38px;padding:7px}.chat-media-viewer-avatar,.chat-media-viewer-avatar img{width:38px;height:38px}.chat-media-viewer-avatar>svg{width:28px;height:28px;margin:5px}.chat-media-viewer-frame{inset:6px 0}.chat-media-viewer .chat-media-viewer-previous,.chat-media-viewer .chat-media-viewer-next{width:34px;height:38px;background:#10171da8}.chat-media-viewer-previous{left:6px}.chat-media-viewer-next{right:6px}.chat-media-viewer-footer{padding:8px 9px 10px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.chat-media-viewer-caption{max-height:65px;font-size:13px}.chat-media-viewer-count{margin-bottom:5px}.chat-media-viewer .chat-media-viewer-thumb{width:58px;height:58px}.chat-media-viewer .chat-media-viewer-page{width:48px;height:58px}.chat-media-viewer-strip,.chat-media-viewer-thumbnails{gap:7px}.chat-media-viewer-loading,.chat-media-viewer-error{max-width:calc(100% - 90px);padding:15px;font-size:13px}.chat-media-viewer-page-error{flex-wrap:wrap;justify-content:center}}
@media(prefers-reduced-motion:reduce){.chat-media-viewer-loading>span{animation:none}}