/* Resting, overlapping folder faces; only their own documents move. */
.works-dialog.works-folio-ready{height:min(800px,calc(100dvh - 80px));overflow:hidden;overflow:clip;touch-action:pinch-zoom}
.works-folio-ready .works-menu{height:100%;display:flex;flex-direction:column;overflow:hidden}
.works-folio-ready .works-menu-header{position:relative;flex:none;z-index:2}
.works-folio-ready .works-menu-list[hidden]{display:none!important}
.work-folio-viewport{position:relative;flex:1;min-height:0;width:100%;overflow:hidden;overflow:clip;isolation:isolate}
.work-folio-deck{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.work-folio{position:absolute;min-width:0;margin:0;padding:0}
/* Fade the ink only: each paper face must still occlude the folders behind it. */
.has-selection .work-folio:not(.is-selected) .work-folio-trigger{opacity:.36}
.has-selection .work-folio:not(.is-selected) .work-folio-outline{stroke-opacity:.25}
.has-selection .work-folio:not(.is-selected):focus-within .work-folio-trigger{opacity:.85}
.has-selection .work-folio:not(.is-selected):focus-within .work-folio-outline{stroke-opacity:.85}
.work-folio-surface{position:absolute;inset:0;z-index:calc(var(--folder-order)*10 + 2);pointer-events:none}
.work-folio-outline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:#4b4246;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;transition:stroke-opacity .28s ease}
.work-folio-fill{fill:var(--menu-paper);fill-opacity:1;stroke:none}
.work-folio-fill{pointer-events:auto;cursor:pointer}
.work-folio-trigger{position:absolute;inset:0;z-index:calc(var(--folder-order)*10 + 4);width:100%;height:100%;margin:0;padding:0;border:0;background:none;color:var(--menu-ink);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .28s ease}
.work-folio-label{position:absolute;top:var(--tab-label-y);left:var(--tab-label-x,24px);width:var(--tab-label-width);display:flex;align-items:baseline;gap:.8em;white-space:nowrap;font:var(--tab-font-size,10px)/1.1 "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:0;color:var(--menu-muted)}
.work-folio-number{flex:none;font-family:Georgia,serif}
.work-folio-category{min-width:0}
.work-folio-name{position:absolute;left:var(--body-x);top:var(--name-y);max-width:var(--name-width);font:400 var(--name-size)/1.1 Georgia,serif;letter-spacing:-.035em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-selected .work-folio-name{max-width:var(--selected-name-width)}
/* The label, face and documents share their folder's permanent depth. */
.work-folio-trigger{pointer-events:none}
.work-folio-label,.work-folio-name,.work-folio-mark{pointer-events:auto}
.work-folio-name{padding:6px 3px;margin:-6px -3px}
.work-folio-label{box-sizing:content-box;padding:5px;margin:-5px}
.work-folio-mark{position:absolute;right:var(--body-x);top:var(--mark-y);width:12px;height:12px;opacity:.6}
.is-inline.is-selected .work-folio-mark{right:52%}
.work-folio-mark::before,.work-folio-mark::after{content:"";position:absolute;left:0;top:5px;width:12px;height:1px;background:currentColor;transition:transform .3s ease}
.work-folio-mark::after{transform:rotate(90deg)}
.is-selected .work-folio-mark::after{transform:rotate(0)}
.works-dialog .work-folio-trigger:focus-visible{outline:none}
.work-folio-trigger:focus-visible .work-folio-name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
/* Neither the item nor panel establishes a stacking context. Each folder's papers,
   face, caption and trigger keep a fixed depth relative to neighboring folders. */
.work-folio-panel{position:absolute;inset:0;pointer-events:none;visibility:hidden;transition:visibility 0s .38s}
.is-selected .work-folio-panel{visibility:visible;transition-delay:0s}
.work-folio-fan{position:absolute;display:block;z-index:calc(var(--folder-order)*10 + 1);pointer-events:none}
.is-selected .work-folio-fan{pointer-events:auto}
.work-folio-sheet{position:absolute;left:50%;top:0;display:block;transform-origin:50% 100%;transform:translate(-50%,var(--sheet-hide)) rotate(0deg) scale(.85);opacity:0;overflow:hidden;background:#fffefa;border:1px solid #e0dbd4;border-radius:3px;padding:3px;transition:transform .52s cubic-bezier(.18,.8,.23,1),opacity .18s ease;will-change:transform}
.is-selected .work-folio-sheet{transform:translate(calc(-50% + var(--sheet-x)),var(--sheet-y)) rotate(var(--sheet-angle)) scale(1);opacity:1;transition:transform .64s cubic-bezier(.18,.8,.23,1) calc(var(--sheet-index)*45ms),opacity .24s ease calc(var(--sheet-index)*45ms)}
.work-folio-sheet img{display:block;width:100%;height:100%;object-fit:contain;object-position:top center}
.works-dialog .work-folio-fan:focus-visible{outline:1px solid var(--menu-ink);outline-offset:3px;border-radius:4px}
.work-folio-copy{position:absolute;left:var(--copy-x);top:var(--copy-y);width:max-content;max-width:var(--copy-width);z-index:calc(var(--folder-order)*10 + 3);display:inline-flex;align-items:baseline;gap:var(--copy-gap);padding:0 0 var(--copy-pad);border-bottom:1px solid transparent;font:400 var(--copy-size)/var(--copy-leading,1.4) "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:.01em;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .16s ease,transform .2s ease,border-color .2s ease}
.is-selected .work-folio-copy{opacity:1;pointer-events:auto;transform:translateY(0);transition:opacity .3s ease .16s,transform .35s ease .12s}
.work-folio-copy h3{margin:0;min-width:0;font:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.work-folio-more{position:static;flex:none;font-size:1.14em;line-height:1}
.work-folio-copy:active{border-bottom-color:var(--menu-ink)}
@media(hover:hover){.work-folio-copy:hover{border-bottom-color:var(--menu-ink)}}
.works-dialog .work-folio-copy:focus-visible{outline:1px solid var(--menu-ink);outline-offset:4px;border-radius:2px}
.works-folio-ready .works-menu-footer{flex:none;margin-top:6px}
.is-still .work-folio-trigger,.is-still .work-folio-outline,.is-still .work-folio,.is-still .work-folio-sheet,.is-still .work-folio-copy,.is-still .work-folio-panel{transition:none!important}
@media(max-width:760px){
  .works-dialog.works-folio-ready{height:100vh;height:100dvh;max-height:none}
  .works-folio-ready .works-menu-header{padding-bottom:12px}
  .works-folio-ready .works-menu-footer{margin-top:4px}
  .work-folio-outline{stroke-width:1.5}
}
@media(max-height:500px){
  .works-dialog.works-folio-ready{height:calc(100dvh - 32px);max-height:calc(100dvh - 32px)}
  .works-folio-ready .works-menu{padding:0 20px 12px}
  .works-folio-ready .works-menu-header{padding:10px 0 8px}
  .works-folio-ready .works-menu-header h2{font-size:30px}
  .works-folio-ready .works-menu-close{min-height:36px}
  .works-folio-ready .works-menu-footer{margin-top:4px}
  .works-folio-ready .works-menu-footer a{min-height:32px}
}
@media(max-width:760px) and (max-height:500px){.works-dialog.works-folio-ready{height:100dvh;max-height:none}}
@media(prefers-reduced-motion:reduce){.work-folio-trigger,.work-folio-outline,.work-folio,.work-folio-sheet,.work-folio-copy,.work-folio-panel,.work-folio-mark::after{transition:none!important}}
