.surface-dialog{position:fixed;inset:1rem;width:min(76rem,calc(100vw - 2rem));max-width:none;max-height:calc(100dvh - 2rem);margin:auto;padding:0;overflow:visible;border:0;border-radius:var(--radius-sheet);background:var(--paper-fiber),var(--paper);color:var(--ink);box-shadow:var(--print-shadow);transform-origin:top left}.surface-dialog::backdrop{background-color:#263942;background-image:var(--paper-mottle-image),var(--paper-fibers-image);background-position:0 0,0 0;background-size:1024px 1024px,512px 512px;animation:surface-backdrop .24s ease both}.surface-dialog[data-closing]::backdrop{animation:surface-backdrop-out .22s cubic-bezier(.4,0,1,1) both}.surface-dialog__frame{max-height:calc(100dvh - 2rem);overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:inherit}.surface-dialog__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;padding:.6rem clamp(1rem,3vw,2rem);border-bottom:1px solid var(--line);background:var(--paper)}.surface-dialog__toolbar strong{min-width:0;font-size:var(--fs-lead);font-weight:var(--fw-strong);letter-spacing:0;line-height:1.25;overflow-wrap:anywhere}.surface-dialog__close{display:grid;place-items:center;flex:none;width:var(--target-min);height:var(--target-min);border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--paper);color:var(--ink);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast)}.surface-dialog__close:hover{color:var(--signal-strong);border-color:var(--signal)}.surface-dialog__close:focus-visible{border-color:var(--ink);background:var(--ink);color:var(--paper)}.surface-dialog__close:active{border-color:var(--signal-press);background:var(--signal-press);color:var(--paper)}.surface-dialog__content{padding:clamp(1rem,3.5vw,3rem)}.surface-dialog__content.is-flush{padding:0}.surface-dialog__content>.frag{width:min(100%,62rem);max-width:none;margin-inline:auto}.surface-dialog__content>img{display:block;width:100%;height:auto;max-height:calc(100dvh - 10rem);-o-object-fit:contain;object-fit:contain}@keyframes surface-backdrop{0%{opacity:0}to{opacity:1}}@keyframes surface-backdrop-out{0%{opacity:1}to{opacity:0}}@media(max-width:600px){.surface-dialog{inset:max(.5rem,env(safe-area-inset-top)) max(.5rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(.5rem,env(safe-area-inset-left));width:calc(100% - 1rem - env(safe-area-inset-left) - env(safe-area-inset-right));max-height:calc(100dvh - 1rem - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.surface-dialog__frame{max-height:inherit}.surface-dialog__content{padding:.75rem}.surface-dialog__content.is-flush{padding:0}}@media(prefers-reduced-motion:reduce){.surface-dialog::backdrop,.surface-dialog[data-closing]::backdrop{animation:none}}