.media-viewer {
  --mv-paper:var(--paper,#fff);--mv-ink:var(--ink,#3c3c3a);--mv-muted:var(--muted,#777773);--mv-line:var(--line,#e2ddd6);
  --mv-soft:#f1ede8;--mv-check:#ded8d0;--mv-viewport:#fbf8f4;
  box-sizing:border-box;width:min(1100px,calc(100% - 48px));max-width:none;
  max-height:calc(100dvh - 48px);padding:0;border:1px solid var(--mv-line);border-radius:16px;
  color:var(--mv-ink);background:var(--mv-paper);box-shadow:0 24px 68px #0006;
  font-family:"Avenir Next","Segoe UI",Inter,ui-sans-serif,system-ui,sans-serif;
  overflow:hidden;
}
.media-viewer[open]{display:flex;flex-direction:column}
.media-viewer *{box-sizing:border-box}
.media-viewer::backdrop{background:#12110fb3;backdrop-filter:blur(3px)}
.media-viewer-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--mv-line);flex-shrink:0}
.media-viewer-heading{min-width:0}
.media-viewer-heading strong{display:block;font-size:14px;overflow-wrap:anywhere;line-height:1.35}
.media-viewer-heading small{display:block;margin-top:4px;font-size:12px;color:var(--mv-muted)}
.media-viewer-actions{display:flex;gap:8px;flex-shrink:0}
.media-viewer button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:38px;min-height:38px;padding:8px 12px;border:1px solid var(--mv-line);border-radius:11px;color:var(--mv-ink);background:var(--mv-soft);font:600 13px/1.2 "Segoe UI",system-ui,sans-serif;box-shadow:none}
.media-viewer button:hover{filter:brightness(.96)}
.media-viewer button:disabled{opacity:.45;cursor:default}
.media-viewer button:focus-visible{outline:3px solid #ee76224d;outline-offset:2px}
.media-viewer svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.media-viewer button.media-viewer-download{color:#fff;background:linear-gradient(45deg,#e32925,#ee7622);border-color:transparent;box-shadow:0 10px 24px #e329252e}
.media-viewer-stage{position:relative;flex:1 1 auto;min-height:100px;height:min(62dvh,720px);background-color:var(--mv-viewport);background-image:linear-gradient(45deg,var(--mv-check) 25%,transparent 25%),linear-gradient(-45deg,var(--mv-check) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--mv-check) 75%),linear-gradient(-45deg,transparent 75%,var(--mv-check) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;overflow:hidden}
.media-viewer-canvas{position:absolute;inset:16px;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
.media-viewer-canvas img,.media-viewer-canvas video{display:block;max-width:none;max-height:none;object-fit:contain;flex-shrink:0;transform-origin:center;user-select:none}
.media-viewer-stage.can-pan .media-viewer-canvas{cursor:grab}
.media-viewer-stage.is-dragging .media-viewer-canvas{cursor:grabbing}
.media-viewer-status{position:absolute;inset:0;display:grid;place-content:center;padding:24px;pointer-events:none;text-align:center;font-size:14px;color:var(--mv-ink)}
.media-viewer-status:empty{display:none}
.media-viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-top:1px solid var(--mv-line);flex-shrink:0}
.media-viewer-info,.media-viewer-key-hint{font-size:12px;color:var(--mv-muted)}
.media-viewer-zoom{display:flex;align-items:center;gap:3px;border:1px solid var(--mv-line);border-radius:11px;padding:3px;background:var(--mv-soft)}
.media-viewer-zoom button{border:0;padding:6px 8px;background:transparent}
.media-viewer-zoom [data-viewer-reset]{min-width:60px;font-variant-numeric:tabular-nums}
.media-viewer-download-status{margin:0;padding:8px 18px 12px;font-size:12px;color:var(--mv-muted);flex-shrink:0}
.media-viewer-download-status:empty{display:none}
.media-viewer-details{padding:10px 18px;border-top:1px solid var(--mv-line);max-height:30dvh;overflow:auto;flex-shrink:0;font-size:12px}
.media-viewer-details[hidden]{display:none}
.media-viewer-details summary{cursor:pointer;font-weight:600}
.media-viewer-details dl{display:grid;grid-template-columns:120px minmax(0,1fr);gap:7px 12px;margin:12px 0;}
.media-viewer-details dt{color:var(--mv-muted)}.media-viewer-details dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;}
.media-viewer-details [data-viewer-edit-actions]{display:flex;flex-wrap:wrap;gap:6px;}
:root[data-theme=dark] .media-viewer{--mv-soft:#2b2722;--mv-check:#302b26;--mv-viewport:#171513}
.media-viewer[data-media-theme=spaces]{--mv-paper:#1a1a1a;--mv-ink:#f5f5f5;--mv-muted:#aaa;--mv-line:#353535;--mv-soft:#252525;--mv-check:#242424;--mv-viewport:#101010;border-radius:20px;font-family:SpacesGeist,Inter,"Segoe UI",system-ui,sans-serif}
.media-viewer[data-media-theme=spaces] button.media-viewer-download{color:#101010;background:#f5f5f5;box-shadow:none}
.media-open-button,.reference-view-button,.h3-file-view{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line,#e2ddd6);border-radius:8px;background:var(--paper,#fff);color:var(--ink,#3c3c3a);padding:7px 10px;font-size:12px}
.reference-view-button{width:100%;margin-top:6px;padding:5px}
.reference-item{height:auto;min-height:88px}
.reference-card{position:relative;height:88px}
#h3 .h3-file-card{height:auto;min-height:88px}
#h3 .h3-file-thumb{position:relative;height:88px}
#h3 .h3-single-tag{top:64px;bottom:auto}
.h3-file-view{position:relative;width:100%;margin-top:5px;padding:5px;background:var(--h3-card,var(--paper,#fff));color:var(--h3-text,var(--ink,#3c3c3a))}
.h3-live-image-view{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:transparent;overflow:hidden;box-shadow:none;cursor:zoom-in}
.h3-live-image-view img{width:100%;height:100%;object-fit:contain}
#h3-live-preview .media-open-button{position:absolute;top:10px;right:10px;z-index:2}
.chat-file-preview{padding:0;border:0;background:transparent;box-shadow:none}
.chat-file-preview img{display:block}
.chat-file-chip button.chat-file-preview{background:transparent;border:0;border-radius:5px;padding:0;width:34px;height:34px;color:inherit;flex-shrink:0}
.chat-markdown img{cursor:zoom-in}
.chat-markdown button.chat-markdown-media{display:inline-block;max-width:100%;padding:0;border:0;background:transparent;box-shadow:none;overflow:hidden;border-radius:8px;cursor:zoom-in}
.chat-markdown-media img{display:block;max-width:100%}
@media(max-width:620px){.reference-item{min-height:76px}.reference-card{height:76px}}
@media(max-width:600px){
  .reference-item{min-height:76px}.reference-card{height:76px}
  .media-viewer{width:calc(100% - 16px);max-height:calc(100dvh - 16px);border-radius:12px}
  .media-viewer-head{padding:12px 10px;gap:8px;align-items:flex-start}
  .media-viewer-heading strong{font-size:12px}.media-viewer-heading small{font-size:11px}
  .media-viewer-actions{gap:5px}.media-viewer button{padding:8px;min-width:36px}
  .media-viewer-actions .media-viewer-download{font-size:12px}
  .media-viewer-stage{height:55dvh}.media-viewer-canvas{inset:8px}
  .media-viewer-footer{padding:10px;flex-wrap:wrap;justify-content:center;gap:8px}
  .media-viewer-info{width:100%;text-align:center}.media-viewer-key-hint{display:none}
}
@media(pointer:coarse){.media-viewer button{min-width:44px;min-height:44px}.reference-view-button,.h3-file-view,.media-open-button{min-height:44px}}