:root{--media-border-radius:13px;--media-gap:0.5rem;--fullscreen-overlay-bg:rgba(0,0,0,0.85);--mobile-overlay-bg:rgba(0,0,0,0.1);--mobile-overlay-blur:blur(10px);--transition-fast:0.2s ease;--transition-medium:0.3s ease;--shadow-subtle:0 1px 2px rgba(0,0,0,0.3);--shadow-prominent:0 0 30px rgba(0,0,0,0.2);--video-placeholder-bg:#e5e5e5;--video-shimmer-from:rgba(255,255,255,0);--video-shimmer-via:rgba(255,255,255,0.7);--video-shimmer-to:rgba(255,255,255,0)}.microblog-media-container{grid-area:media;display:flex;flex-direction:column;gap:var(--media-gap);margin-top:var(--media-gap)}.microblog-media-item{width:100%;border-radius:var(--media-border-radius);overflow:hidden;position:relative}.microblog-media-image,.microblog-media-video{width:100%;height:auto;display:block;border-radius:var(--media-border-radius)}.microblog-media-video{background-color:var(--video-placeholder-bg);background-image:linear-gradient(90deg,var(--video-shimmer-from) 0%,var(--video-shimmer-via) 20%,var(--video-shimmer-from) 40%,var(--video-shimmer-from) 100%);background-size:200% 100%;background-repeat:no-repeat;animation:shimmer 2s infinite linear}.microblog-media-image{cursor:pointer;transition:opacity var(--transition-fast);max-width:100%}.microblog-media-image:hover{opacity:1}.fullscreen-overlay{position:fixed;inset:0;background-color:var(--fullscreen-overlay-bg);z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity var(--transition-medium);visibility:hidden;touch-action:none;overscroll-behavior:none}.fullscreen-overlay.active{opacity:1;pointer-events:auto;visibility:visible}.fullscreen-image-container{position:relative;max-width:95%;max-height:95%;display:flex;justify-content:center;align-items:center}.fullscreen-image{max-width:100%;max-height:90vh;object-fit:contain;transform:scale(0.9);transition:transform var(--transition-medium),opacity var(--transition-medium);box-shadow:var(--shadow-prominent);opacity:1;touch-action:manipulation}.fullscreen-overlay.active .fullscreen-image{transform:scale(1)}.fullscreen-image.zoomed{transition:transform var(--transition-fast);will-change:transform}.fullscreen-close{position:absolute;top:20px;right:20px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1001;transform:scale(0.9);transition:transform var(--transition-fast)}.fullscreen-close:hover{transform:scale(1)}.fullscreen-close img{width:100%;height:100%}.mobile-video-overlay{position:absolute;inset:0;pointer-events:none;z-index:10}.mobile-countdown-timer{position:absolute;bottom:16px;left:16px;background-color:var(--mobile-overlay-bg);color:white;padding:6px 8px;border-radius:16px;font:600 12px/1 system-ui,sans-serif;backdrop-filter:var(--mobile-overlay-blur);-webkit-backdrop-filter:var(--mobile-overlay-blur);opacity:0;transform:translateY(8px);transition:all var(--transition-medium);height:32px;min-width:32px;text-align:center;display:flex;align-items:center;justify-content:center}.mobile-countdown-timer.visible{opacity:1;transform:translateY(0)}.mobile-sound-icon{position:absolute;bottom:16px;right:16px;width:32px;height:32px;background-color:var(--mobile-overlay-bg);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto;backdrop-filter:var(--mobile-overlay-blur);-webkit-backdrop-filter:var(--mobile-overlay-blur);transition:all var(--transition-fast)}.mobile-sound-icon:hover{background-color:rgba(255,255,255,0.1);transform:scale(1.05)}.mobile-sound-icon:active{transform:scale(0.95)}.mobile-sound-icon img{width:16px;height:16px;filter:drop-shadow(var(--shadow-subtle))}.video-fullscreen-btn{position:absolute;bottom:16px;right:16px;width:36px;height:36px;background-color:var(--mobile-overlay-bg);border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:var(--mobile-overlay-blur);-webkit-backdrop-filter:var(--mobile-overlay-blur);transition:all var(--transition-fast);z-index:10;color:white}.video-fullscreen-btn:hover{background-color:rgba(255,255,255,0.2);transform:scale(1.1)}.video-fullscreen-btn:active{transform:scale(0.95)}.video-fullscreen-btn svg{width:20px;height:20px;filter:drop-shadow(var(--shadow-subtle))}@media (max-width:768px){.fullscreen-image{cursor:default}.video-fullscreen-btn{display:none}}@media (min-width:769px){.mobile-video-overlay{display:none}.fullscreen-image{cursor:pointer}}@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}