#resume-preview,#image-preview{width:min(1100px,calc(100vw - 40px));height:fit-content;max-height:calc(100dvh - 40px);overflow:hidden}
#resume-preview[open],#image-preview[open]{display:flex;flex-direction:column}
.resume-toolbar{display:flex;align-items:center;gap:16px;min-height:64px;padding:10px 20px;border-bottom:1px solid var(--rule);font:14px/1.4 'Space Grotesk',sans-serif;flex-shrink:0}
.resume-heading{display:flex;align-items:center;gap:16px;min-width:0;margin-inline-end:auto}
.resume-toolbar h2{font:inherit;white-space:nowrap}
.resume-language{font:10px 'JetBrains Mono',monospace;letter-spacing:.08em;flex-shrink:0}
.resume-toolbar>a,.resume-toolbar>button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;flex-shrink:0}
.resume-toolbar>a{text-underline-offset:4px;text-decoration:underline;text-decoration-color:var(--rule)}
.resume-toolbar>a:hover{text-decoration-color:currentColor}
:is([data-resume-close],.preview-close){width:44px}
:is([data-resume-close],.preview-close) svg{width:20px;height:20px}
.resume-scroll{flex:0 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0;background:var(--surface)}
.resume-page{display:block;width:100%;max-width:none;height:auto;margin:0;background:#fff}
.resume-page[hidden]{display:none}
@media(max-width:600px){
  #resume-preview,#image-preview{width:calc(100vw - 16px);max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .resume-toolbar{gap:8px;min-height:56px;padding:6px 12px}
  .resume-heading{gap:8px}
  :is([data-resume-close],.preview-close){width:36px}
}