/* Desktop keeps the v17 rail. Only the phone reference viewer uses this sheet. */
.mv-sheet-handle{display:none}
@media(max-width:760px){
 .mv-fullscreen-layer{--ink:#cdd1d8;--ink2:#b4bac2;--ink3:#9fa6af;--ink4:#9fa6af;--surface:#171717;--surface2:#222225;--fill:#222225;--fill2:#29292e;--line:#2c2c30;color-scheme:dark;top:var(--mv-viewport-top,0px);bottom:auto;height:var(--mv-viewport-height,100dvh)}
 .mv-fullscreen-layer .meld-dialog{height:100%;background:#0a0a0a}
 .mv-fullscreen-layer .mv-viewer{display:block;position:relative;height:100%;min-height:0;max-height:none;background:#0a0a0a}
 .mv-fullscreen-layer .mv-media-pane{position:absolute;inset:0 0 auto;display:flex;flex-direction:column;width:100%;height:calc(100% - var(--mv-media-inset,200px));min-height:0;background:#0a0a0a;overflow:hidden;transition:height 450ms cubic-bezier(.32,.72,0,1)}
 .mv-fullscreen-layer .mv-media-topbar{min-height:60px;padding:10px max(12px,env(safe-area-inset-right)) 10px 64px;gap:8px;flex-wrap:wrap;flex-shrink:0}
 .mv-fullscreen-layer .mv-media-count{display:none}
 .mv-fullscreen-layer .mv-stage{flex:1;min-height:0;padding:12px max(16px,env(safe-area-inset-right)) 20px max(16px,env(safe-area-inset-left))}
 .mv-fullscreen-layer .mv-viewer .mv-image-frame.mv-fit img,.mv-fullscreen-layer .mv-viewer:has(.mv-thumbs) .mv-image-frame.mv-fit img,.mv-fullscreen-layer .mv-viewer .mv-video-frame video,.mv-fullscreen-layer .mv-viewer:has(.mv-thumbs) .mv-video-frame video{max-height:100%;border-radius:2px}
 .mv-fullscreen-layer .mv-image-frame.mv-fit{max-height:100%;min-height:0;display:flex;align-items:center;justify-content:center}
 .mv-fullscreen-layer .mv-image-frame.mv-page img{max-height:none}
 .mv-fullscreen-layer .mv-details{--ink:#1f1f1f;--ink2:#525252;--ink3:#646864;--ink4:#687068;--surface:#fff;--surface2:#eaebef;--fill:rgba(20,20,20,.06);--fill2:rgba(20,20,20,.10);--line:rgba(20,20,20,.10);color:var(--ink);color-scheme:light;position:absolute;inset:0 0 auto;display:flex;flex-direction:column;height:100%;max-height:none;min-height:0;flex:none;overflow:hidden;border:0;border-radius:16px 16px 0 0;background:var(--surface);transform:translate3d(0,calc(100% - var(--mv-sheet-height,200px)),0);transition:transform 450ms cubic-bezier(.32,.72,0,1);z-index:20;box-shadow:0 -8px 24px rgb(0 0 0/.08)}
 .mv-fullscreen-layer .mv-details.mv-sheet-dragging,.mv-fullscreen-layer .mv-details.mv-sheet-instant{transition:none;user-select:none}
 .mv-fullscreen-layer .mv-details.mv-sheet-dragging{will-change:transform}
 .mv-fullscreen-layer .mv-sheet-handle{display:flex;align-items:center;justify-content:center;align-self:center;flex:0 0 44px;width:calc(100% - 128px);height:44px;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}
 .mv-fullscreen-layer .mv-sheet-handle:active{cursor:grabbing}
 .mv-fullscreen-layer .mv-sheet-handle span{display:block;width:68px;height:4px;border-radius:999px;background:var(--ink3)}
 .mv-fullscreen-layer .mv-sheet-handle:focus-visible{outline-offset:-5px;border-radius:12px}
 .mv-fullscreen-layer .dialog-close{width:44px;height:44px;top:max(8px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));background:var(--surface);color:var(--ink)}
 .mv-fullscreen-layer .mv-media-tools{gap:0}
 .mv-fullscreen-layer .mv-media-tools button{padding-inline:10px;min-height:36px}
 .mv-fullscreen-layer .mv-annotate{padding-inline:12px;min-height:40px}
 .mv-fullscreen-layer .mv-thumbs{flex-shrink:0;background:#0a0a0a;border:0}
 .mv-fullscreen-layer .mv-mount ::selection{background:#4e4e56;color:#f3f4f6}
 .mv-fullscreen-layer .mv-details ::selection{background:#d9d9ff;color:#191945}
 @media(prefers-reduced-motion:reduce){.mv-fullscreen-layer .mv-details,.mv-fullscreen-layer .mv-media-pane{transition:none!important}}
}
@media(max-width:760px){
 .mv-fullscreen-layer .mv-stage{container-type:size}
 .mv-fullscreen-layer .mv-image-frame.mv-fit{display:inline-grid;width:max-content;height:max-content;place-items:center}
 .mv-fullscreen-layer .mv-viewer .mv-image-frame.mv-fit img,.mv-fullscreen-layer .mv-viewer:has(.mv-thumbs) .mv-image-frame.mv-fit img,.mv-fullscreen-layer .mv-viewer .mv-video-frame video,.mv-fullscreen-layer .mv-viewer:has(.mv-thumbs) .mv-video-frame video{max-height:100cqh;max-width:100cqw}
}