img.media-image[data-media-state=loading],img.media-image[data-media-state=error]{background-color:var(--surface-subtle,#f4f4f4);background-image:var(--media-preview,none);background-repeat:no-repeat;background-position:var(--media-preview-position,center);background-size:var(--media-preview-size,contain);color:#0000}:is(.app-lightbox-image,.date-gallery-dialog-image):has(>img.media-image){container-type:size}body :is(.app-lightbox-image,.date-gallery-dialog-image)>img.media-image:not([data-media-state=ready]){width:min(100cqw,calc(100cqh * var(--media-aspect)));height:min(100cqh,calc(100cqw / var(--media-aspect)));object-fit:contain}body .media-retry{z-index:90;box-sizing:border-box;background:var(--paper,#fff);color:var(--ink,#111);border-radius:var(--radius-control,12px);text-align:center;pointer-events:none;font:400 14px/20px var(--font-body,sans-serif);flex-direction:column;align-items:center;gap:8px;padding:12px 8px;display:flex;position:fixed;transform:translate(-50%,-50%);box-shadow:0 1px 8px #00000012}body .media-retry>span{font:inherit;color:inherit}body .media-retry>button{border-radius:var(--radius-control,12px);background:var(--surface-subtle,#f4f4f4);width:auto;min-width:44px;height:auto;min-height:44px;color:var(--ink,#111);font:600 14px/20px var(--font-body,sans-serif);cursor:pointer;pointer-events:auto;border:0;flex:none;margin:0;padding:8px 16px;display:block;position:relative}body .media-retry>button:focus-visible{outline-offset:2px;outline:2px solid}body .media-retry[data-compact=true]{box-shadow:none;background:0 0;padding:0}body .media-retry[data-compact=true]>button{max-width:100%;padding:4px 8px;font-size:12px}
