.preview-dialog{padding:0;border:1px solid rgb(var(--gray-200));background-color:rgb(var(--raised));color:rgb(var(--gray-900));box-shadow:var(--shadow-lift);overscroll-behavior:contain;width:100%;max-width:100%;max-height:85dvh;margin:auto 0 0;border-bottom:0;border-radius:1.25rem 1.25rem 0 0}.preview-sheet{padding:.75rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom))}.preview-grabber{display:block;width:2.25rem;height:5px;margin:0 auto 1rem;border-radius:9999px;background-color:rgb(var(--gray-300))}@media(min-width:640px){.preview-dialog{width:min(30rem,100% - 2.5rem);max-height:min(40rem,100dvh - 4rem);margin:auto;border-bottom:1px solid rgb(var(--gray-200));border-radius:1rem}.preview-sheet{padding:1.5rem 1.5rem 1.75rem}.preview-grabber{display:none}}.preview-dialog::backdrop{background-color:#0006}:root[data-theme=dark] .preview-dialog::backdrop{background-color:#0000009e}@media(prefers-reduced-motion:no-preference){.preview-dialog[open]{animation:sheet-rise var(--duration-base) var(--ease-out) both}.preview-dialog[open]::backdrop{animation:backdrop-fade var(--duration-base) var(--ease-out) both}@media(min-width:640px){.preview-dialog[open]{animation:card-pop var(--duration-slow) var(--ease-spring) both}}}@media(prefers-reduced-motion:reduce){.preview-dialog[open],.preview-dialog[open]::backdrop{animation:backdrop-fade var(--duration-fast) var(--ease-out) both}}@keyframes sheet-rise{0%{transform:translateY(100%)}}@keyframes card-pop{0%{opacity:0;transform:translateY(8px) scale(.96)}}@keyframes backdrop-fade{0%{opacity:0}}html:has(dialog.preview-dialog[open]){overflow:hidden}@media(min-width:640px){.preview-dialog.preview-dialog-wide{width:min(46rem,100% - 2.5rem)}}.preview-sheet.preview-sheet-split{position:relative;padding:0}.preview-close{position:absolute;top:.5rem;right:.5rem;z-index:2;border-radius:9999px;background-color:rgb(var(--raised) / .82)}.preview-panel-media{position:relative;display:grid;place-items:center;padding:.5rem 1.25rem 1.5rem;background-color:rgb(var(--gray-100))}.preview-panel-text{padding:1.5rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom))}.preview-panel-media.preview-panel-media-fill{padding:0;height:15rem;overflow:hidden}.preview-panel-media-fill>img{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.preview-sheet-split>.preview-grabber{width:100%;height:auto;margin:0;padding:.75rem 0;border-radius:0;background-color:rgb(var(--gray-100))}.preview-sheet-split>.preview-grabber:before{content:"";display:block;width:2.25rem;height:5px;margin:0 auto;border-radius:9999px;background-color:rgb(var(--gray-300))}@media(min-width:640px){.preview-panels{display:grid;grid-template-columns:17rem minmax(0,1fr)}.preview-panel-media{padding:2.25rem}.preview-panel-media.preview-panel-media-fill{height:auto;min-height:24rem}.preview-panel-text{padding:2.25rem 3.25rem 2.25rem 2rem;align-self:center}.preview-close{background-color:transparent}}.preview-book{--book-figure: .12s;--book-lines: .16s;--book-paper: var(--gray-50);--book-gutter: .12;--book-spine-light: .06;--book-figure-width: 7.5rem}:root[data-theme=dark] .preview-book{--book-paper: 34 34 39;--book-gutter: .45;--book-spine-light: .08}.book-figure{display:block;width:var(--book-figure-width);height:auto;border-radius:2px 5px 5px 2px;box-shadow:var(--shadow-lift)}.book-figure.book-swatch{aspect-ratio:2 / 3;background-color:rgb(var(--cloth));background-image:linear-gradient(90deg,rgb(0 0 0 / .12) 0,transparent 14%)}.book-figure[hidden],.book-front{display:none}@media(min-width:640px){.preview-book{--book-fly: .56s;--book-swing: .68s;--book-close: .48s;--book-figure: .46s;--book-lines: .36s;--book-page-margin: 1.25rem;--book-figure-width: min(100%, (100dvh - 4rem - 2 * var(--book-page-margin)) * 2 / 3);width:min(50rem,100% - 2.5rem);max-height:calc(100dvh - 4rem);background-color:transparent}.preview-book .preview-panels{position:relative;grid-template-columns:minmax(0,1fr) minmax(0,1fr);perspective:2200px}.preview-book .preview-panel-media{position:relative;padding:var(--book-page-margin);z-index:1;background:none;transform-style:preserve-3d;transform-origin:right center}.preview-book .preview-panel-media:before{content:"";position:absolute;inset:0;border-radius:calc(1rem - 1px) 0 0 calc(1rem - 1px);background:linear-gradient(to left,rgb(0 0 0 / var(--book-gutter)),rgb(0 0 0 / calc(var(--book-gutter) / 5)) 14%,transparent 35%),rgb(var(--book-paper));backface-visibility:hidden}.preview-book .preview-panel-media:after{content:"";position:absolute;inset:0;border-radius:inherit;background:#000;opacity:0;backface-visibility:hidden;pointer-events:none}.preview-book .preview-panel-text{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;border-radius:0 calc(1rem - 1px) calc(1rem - 1px) 0;background:linear-gradient(to right,rgb(0 0 0 / var(--book-gutter)),rgb(0 0 0 / calc(var(--book-gutter) / 5)) 14%,transparent 35%),rgb(var(--book-paper))}.preview-book .preview-panels:after{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translate(-1px);background:linear-gradient(to right,rgb(0 0 0 / calc(var(--book-gutter) * 1.5)),rgb(255 255 255 / var(--book-spine-light)));pointer-events:none}.preview-book .preview-panel-media>:not(.book-front){position:relative;backface-visibility:hidden}.book-front{position:absolute;inset:0;display:grid;place-items:center;padding:var(--book-page-margin);transform:rotateY(180deg) translateZ(1px);backface-visibility:hidden;border-radius:0 1rem 1rem 0;background-color:#1e2028;box-shadow:inset 10px 0 18px -10px #00000080}.book-front[data-book-tone]{background-color:rgb(var(--cloth))}.book-front>img{position:relative;display:block;width:var(--book-figure-width);height:auto;border-radius:2px 5px 5px 2px;box-shadow:0 12px 30px -10px #0009}.book-front>img[hidden]{display:none}.book-front>.book-swatch{box-shadow:0 12px 30px -10px #0009}.book-front:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,rgb(0 0 0 / .28) 0,transparent 9%,rgb(255 255 255 / .08) 55%,transparent);pointer-events:none}}@media(prefers-reduced-motion:no-preference){@media(min-width:640px){.preview-dialog.preview-book[data-flying]{border-color:transparent;box-shadow:none}.preview-book[data-flying] .preview-sheet{animation:book-materialize .26s var(--ease-out) calc(var(--book-fly) - .26s) both}.preview-book[data-flying] .preview-panel-media{transform:rotateY(180deg)}.preview-book[data-flying] [data-flight-target]{visibility:hidden}.preview-book[data-flying] :is(.popup-line,.preview-close){opacity:0}.preview-dialog.preview-book[open]:not([data-flying]){animation:book-unclip var(--book-swing) linear backwards,book-surface .36s var(--ease-out) calc(var(--book-swing) * .45) backwards}.preview-book[open]:not([data-flying]) .preview-panel-media{animation:book-open var(--book-swing) cubic-bezier(.45,0,.15,1) both}.preview-book[open]:not([data-flying]) .preview-panel-media:after{animation:book-leaf-shade var(--book-swing) cubic-bezier(.45,0,.15,1) both}.preview-book[open]:not([data-flying]) .preview-close{animation:book-line-in .3s var(--ease-out) var(--book-lines) both}}.preview-book[open]:not([data-flying]) .popup-figure{animation:book-figure-lift .48s var(--ease-spring) var(--book-figure) both}.preview-book[open]:not([data-flying]) .popup-line{animation:book-line-in .4s var(--ease-out) both;animation-delay:calc(var(--book-lines) + var(--i, 0) * 45ms)}}@keyframes book-materialize{0%{opacity:0}}@keyframes book-surface{0%{border-color:transparent;box-shadow:none}}@keyframes book-unclip{0%,to{overflow:visible}}@keyframes book-open{0%{transform:rotateY(180deg)}}@keyframes book-leaf-shade{50%{opacity:.22}}@keyframes book-figure-lift{0%{transform:scale(.985);box-shadow:0 1px 2px #0000001f}}@keyframes book-line-in{0%{opacity:0;transform:translateY(6px)}}@media(prefers-reduced-motion:no-preference){dialog.preview-dialog[open][data-closing]{animation:dialog-out .18s var(--ease-out) both}dialog.preview-dialog[open][data-closing]::backdrop{animation:dialog-out .18s var(--ease-out) both}@media(max-width:639.98px){dialog.preview-dialog[open][data-closing]{animation:sheet-out .2s var(--ease-out) both}}}@media(prefers-reduced-motion:no-preference)and (min-width:640px){dialog.preview-dialog.preview-book[open][data-closing]:not([data-closing=quick]){animation:book-unclip var(--book-close) linear backwards,book-surface-out .22s var(--ease-out) both}dialog.preview-dialog.preview-book[open][data-closing=""]::backdrop{animation:none}dialog.preview-dialog.preview-book[open][data-closing=quick]{animation:dialog-out .18s var(--ease-out) both}.preview-book[open][data-closing]:not([data-closing=quick]) .preview-panel-media{animation:book-close var(--book-close) cubic-bezier(.5,0,.3,1) both}.preview-book[open][data-closing]:not([data-closing=quick]) .preview-panel-media:after{animation:book-leaf-shade var(--book-close) cubic-bezier(.5,0,.3,1) both}.preview-book[open][data-closing]:not([data-closing=quick]) :is(.popup-line,.preview-close){animation:book-line-out .16s var(--ease-out) both}dialog.preview-dialog.preview-book[open][data-closing=fly]::backdrop{animation:backdrop-out var(--book-fly) var(--ease-out) both}.preview-book[open][data-closing=fly] .preview-sheet{animation:book-sheet-out .2s var(--ease-out) both}.preview-book[open][data-closing=fly] [data-flight-target]{visibility:hidden}}@keyframes book-surface-out{to{border-color:transparent;box-shadow:none}}@keyframes book-close{to{transform:rotateY(180deg)}}@keyframes book-line-out{to{opacity:0}}@keyframes book-sheet-out{to{opacity:0}}@keyframes backdrop-out{to{opacity:0}}dialog.preview-dialog>.book-flier{position:fixed;z-index:10;margin:0;transform-origin:0 0;pointer-events:none}@keyframes dialog-out{to{opacity:0;transform:scale(.98)}}@keyframes sheet-out{to{transform:translateY(100%)}}