/* Preview the whole file. Intrinsic image dimensions must not enlarge a grid
   track beyond its frame (especially the previously clipped Quick preview). */
:root{--file-mat:#f0edf1;--preview-max-height:min(51svh,460px)}

:is(.card-art,.qc-thumbnail,.explore-art,.explore-mini,.queue-thumbnail,.activity-event-thumbnail,.review-art,.preview-art,.file-cover-art)>img{
  display:block;min-width:0;min-height:0;max-width:100%;max-height:100%;
  width:100%;height:100%;object-fit:contain;object-position:center;
}
:is(.qc-thumbnail,.explore-mini,.queue-thumbnail,.activity-event-thumbnail,.file-cover-art){
  grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);background:var(--file-mat);
}

/* The floating paper has three safe areas: software badge, artwork, filename.
   Keep both overlays outside the image while using the space between them. */
.file-card .card-surface,.file-card .card-art{background:var(--file-mat)}
.file-card .card-art{display:grid;grid-template: minmax(0,1fr) / minmax(0,1fr);padding:64px 6px 4px;bottom:50px}
.file-card .card-art>img{object-fit:contain}
.file-card .file-ext{color:#61526b;background:#fffc;border-color:#dcd4df}

/* Natural-ratio artwork in large previews avoids a panoramic strip for a
   square product rendering and keeps a whole slide/page visible at once. */
:is(.qc-preview-art,.preview-art):has(>img){
  display:flex;align-items:center;justify-content:center;
  width:fit-content;max-width:100%;height:auto;min-height:0;max-height:none;
  margin-inline:auto;background:var(--file-mat);
}
:is(.qc-preview-art,.preview-art):has(>img)>img{
  display:block;width:auto;height:auto;min-width:0;min-height:0;
  max-width:100%;max-height:var(--preview-max-height);object-fit:contain;object-position:center;background:transparent;
}
:is(.qc-preview-art,.preview-art):has(>.file-cover-art){
  display:grid;grid-template:minmax(0,1fr) / minmax(0,1fr);
  width:min(100%,calc(var(--preview-max-height)*1.4));height:auto;min-height:0;
  aspect-ratio:800/570;margin-inline:auto;background:var(--file-mat);
}
:is(.qc-preview-art,.preview-art)>.file-cover-art{width:100%;max-width:none;height:100%}

.explore-card-image{height:auto;aspect-ratio:4/3;background:var(--file-mat)}
.explore-card-art>img,.review-art>img{object-fit:contain}
.explore-detail-art,.explore-compare-art,.review-art{background:var(--file-mat)}
:is(.explore-detail-art,.explore-compare-art)>.file-cover-art{max-width:none}
@media(max-width:700px){.file-card .card-art{padding:49px 4px 3px;bottom:42px}}
@media(max-height:680px){:root{--preview-max-height:41svh}}

/* Keep actual preview pixels out of rounded corners. */
:is(.qc-thumbnail,.explore-mini,.queue-thumbnail,.activity-event-thumbnail){padding:3px}
.explore-card-art,.explore-detail-art,.explore-compare-art,.review-art{padding:6px}
:is(.qc-preview-art,.preview-art):has(>img){padding:4px}
.preview-dialog>.close-button{position:relative;inset:auto;display:grid;place-items:center;width:32px;height:32px;margin:8px 12px 5px auto}
.explore-entry-row{display:flex;align-items:center;gap:8px;min-width:0}
.explore-entry-row .explore-pinned{position:relative;inset:auto;flex:none}
/* The native checkbox gets a generous hit area; its visible mark sits 13px
   in from both edges, above the separate file-opening surface. */
.explore-card-image>.explore-select{top:4px;left:4px;width:44px;height:44px}
.explore-card-image>.explore-select>span{width:26px;height:26px;box-sizing:border-box;pointer-events:none;background:#fcfafb;border-color:#87738b;box-shadow:0 1px 4px #33243738,0 0 0 1px #ffffffa6}
.explore-card-image>.explore-select>input:checked+span{background:#79537b;border-color:#79537b;color:#fff}
.explore-card-image>.explore-select>input:focus-visible+span{outline:3px solid #593762;outline-offset:2px;box-shadow:0 0 0 3px #fff}
@media(forced-colors:active){.explore-card-image>.explore-select>span{forced-color-adjust:none;background:Canvas;border-color:ButtonText;color:transparent}.explore-card-image>.explore-select>input:checked+span{background:Highlight;color:HighlightText;border-color:Highlight}.explore-card-image>.explore-select>input:focus-visible+span{outline-color:Highlight}}
.explore-entry-row .explore-card-name{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;flex:1}
.explore-filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.explore-entry-row .explore-card-enter{position:static;flex:none;width:18px;height:18px;border:0;background:none;backdrop-filter:none;color:#87758e;opacity:1;transform:none;font-size:14px}
.explore-selection-files{padding-left:0;gap:3px}.explore-mini{margin-left:0}
.activity-event-thumbnail:has(>.activity-file-count){grid-template-rows:minmax(0,1fr) auto}
.activity-event-thumbnail>.activity-file-count{position:static;place-self:end center;padding:1px 3px;min-width:0;box-shadow:none}

/* Welcome and Explore share the same editorial full-bleed type carousel.
   File grids, opened files and comparisons retain complete source previews. */
body:is([data-page="home"],[data-page="explore"]) .file-card .card-surface,body:is([data-page="home"],[data-page="explore"]) .file-card .card-art{background:#302838}
body:is([data-page="home"],[data-page="explore"]) .file-card .card-art{inset:0;display:block;padding:0}
body:is([data-page="home"],[data-page="explore"]) .file-card .card-art>img{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:var(--cover-focus,50% 50%)}
body:is([data-page="home"],[data-page="explore"]) .file-card .card-art::after{content:"";position:absolute;inset:52% 0 0;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,#19131e13 26%,#19131e94 70%,#19131eda 100%)}
body:is([data-page="home"],[data-page="explore"]) .file-card .card-caption{z-index:2;background:transparent;backdrop-filter:none;border:0;color:#fff;text-shadow:0 1px 3px #161018a6}
body:is([data-page="home"],[data-page="explore"]) .file-card .file-ext{color:#fff;background:#201923ae;border-color:#ffffff56}