#resume-reader{position:absolute;inset:0;z-index:4;background:#14140f99;animation:resume-enter .65s cubic-bezier(.2,.7,.2,1) both;--reader-width:100vw;--reader-height:100dvh}
#resume-scroll{position:absolute;inset:4% 8% 11%;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c4b69c55 transparent;display:grid;place-items:center}
#resume-page{display:block;width:auto;height:auto;max-width:100%;max-height:calc(var(--reader-height)*.85);box-shadow:0 14px 42px #0006;user-select:none;-webkit-user-drag:none}
#resume-reader[data-zoomed="true"] #resume-scroll{display:block}
#resume-reader[data-zoomed="true"] #resume-page{max-width:none;max-height:none;width:max(1100px,140%);height:auto}
#resume-close{left:20px;bottom:22px}#resume-previous{left:1.5%;top:calc(50% - 24px)}#resume-next{right:1.5%;top:calc(50% - 24px)}#resume-zoom{right:72px;bottom:22px}#resume-download{right:20px;bottom:22px}
#resume-status{position:absolute;bottom:35px;left:calc(50% - 40px);width:80px;text-align:center;color:#c8bea9;font:12px 'Courier New',monospace}
@keyframes resume-enter{from{opacity:0;transform:translateY(4%) rotate(-.6deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@media(orientation:portrait){#resume-reader{--reader-width:100dvh;--reader-height:100vw}#resume-close,#resume-zoom,#resume-download{bottom:8px}#resume-status{bottom:23px}}
@media(max-height:500px){#resume-close,#resume-zoom,#resume-download{bottom:8px}#resume-status{bottom:23px}}
@media(prefers-reduced-motion:reduce){#resume-reader{animation:none}}
