.pdf-md { min-height: 75vh; padding: clamp(5.5rem, 9vw, 8rem) 1.2rem 5rem; background: radial-gradient(circle at 88% 10%, #c4edf9 0, transparent 35%), linear-gradient(160deg, #eef8fc 0%, #fff 54%, #e7f5fa 100%); color: #112f42; }
.pdf-md__shell { max-width: 1220px; margin: auto; }
.pdf-md__back { display: inline-flex; align-items: center; gap: .5rem; color: #07668e; font-weight: 700; text-decoration: none; }
.pdf-md__back:hover { color: #044c6d; }
.pdf-md__header { max-width: 780px; margin: 2rem 0 2.5rem; }
.pdf-md__eyebrow { display: inline-flex; align-items: center; gap: .5rem; color: #087faf; font-size: .82rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.pdf-md h1 { margin: .55rem 0 .9rem; font-size: clamp(2.25rem, 5vw, 4.25rem); font-weight: 800; line-height: 1.08; }
.pdf-md__header p { max-width: 690px; margin: 0; color: #4a6779; font-size: 1.13rem; line-height: 1.65; }
.pdf-md__promises { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.4rem; }
.pdf-md__promises span { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .8rem; border: 1px solid #c5e2ee; border-radius: 999px; background: #fff; color: #176482; font-size: .86rem; font-weight: 650; }
.pdf-md__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1.25rem; align-items: stretch; }
.pdf-md__panel { min-width: 0; padding: clamp(1.25rem, 2.5vw, 2rem); border: 1px solid #cbe1eb; border-radius: 1.35rem; background: #fff; box-shadow: 0 16px 38px rgba(19, 64, 87, .08); }
.pdf-md__panel-heading { display: flex; align-items: center; gap: .8rem; margin-bottom: 1.25rem; }
.pdf-md__panel-heading h2 { margin: 0; font-size: clamp(1.25rem, 2vw, 1.55rem); font-weight: 800; }
.pdf-md__step { display: grid; flex: none; place-items: center; width: 2.65rem; height: 2.65rem; border-radius: .8rem; background: #e1f3fa; color: #006b96; font-weight: 800; }
.pdf-md__drop { display: flex; min-height: 275px; flex-direction: column; justify-content: center; align-items: center; gap: .7rem; padding: 1.5rem; border: 2px dashed #9dcbde; border-radius: 1rem; background: #f4fbfe; text-align: center; cursor: pointer; transition: border-color .2s, background .2s; }
.pdf-md__drop:hover, .pdf-md__drop:focus-within, .pdf-md__drop.is-dragging { border-color: #087fae; background: #e8f7fc; }
.pdf-md__drop > i { color: #087fae; font-size: 2.5rem; }
.pdf-md__drop strong { font-size: 1.1rem; }
.pdf-md__drop span, .pdf-md__limit, .pdf-md__output-label { color: #537186; font-size: .9rem; }
.pdf-md__drop input { width: min(100%, 290px); margin-top: .25rem; font-size: .87rem; }
.pdf-md__limit { margin: .9rem 0; }
.pdf-md__filename { overflow-wrap: anywhere; padding: .7rem .9rem; border-radius: .65rem; background: #eef8fc; color: #194d67; font-weight: 650; }
.pdf-md__button, .pdf-md__secondary { display: inline-flex; justify-content: center; align-items: center; gap: .55rem; min-height: 2.8rem; padding: .65rem 1.15rem; border: 1px solid #087fae; border-radius: .7rem; background: #087fae; color: #fff; font-weight: 750; transition: background .2s, border-color .2s; }
.pdf-md__button:hover:not(:disabled) { border-color: #045b80; background: #045b80; }
.pdf-md__button:disabled, .pdf-md__secondary:disabled { opacity: .47; cursor: not-allowed; }
.pdf-md__upload > .pdf-md__button { margin-top: .35rem; }
.pdf-md__secondary { border-color: #a6cfdf; background: #f2f9fc; color: #08678d; }
.pdf-md__secondary:hover:not(:disabled) { background: #dff2f9; }
.pdf-md__status { min-height: 2.7rem; margin: 1rem 0 0; color: #32687f; line-height: 1.5; }
.pdf-md__status[data-tone="error"] { color: #ad3030; }
.pdf-md__status[data-tone="warning"] { color: #8a5900; }
.pdf-md__output-label { display: block; margin-bottom: .6rem; }
.pdf-md textarea { display: block; width: 100%; min-height: 315px; padding: 1rem; resize: vertical; border: 1px solid #bfd6e2; border-radius: .8rem; outline-color: #087fae; background: #fbfdfe; color: #19394b; font: .95rem/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }
.pdf-md textarea:disabled { opacity: 1; }
.pdf-md__result-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1rem; color: #537186; font-size: .9rem; }
.pdf-md__result-actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.pdf-md__note { display: flex; gap: .6rem; max-width: 900px; margin: 1.3rem 0 0; color: #547286; font-size: .9rem; line-height: 1.55; }
.pdf-md__note i { margin-top: .2rem; color: #087fae; }
@media (max-width: 850px) { .pdf-md__grid { grid-template-columns: 1fr; } .pdf-md__drop { min-height: 220px; } }
@media (max-width: 500px) { .pdf-md { padding-inline: .9rem; } .pdf-md__panel { padding: 1.1rem; } .pdf-md__result-actions { width: 100%; } .pdf-md__result-actions button { flex: 1; } }

.pdf-md__upload-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; align-items: center; }
.pdf-md__upload .pdf-md__drop { min-height: 190px; }
.pdf-md__upload-actions { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; }
.pdf-md__upload-actions > p:first-child { max-width: 470px; margin: 0; color: #4a6779; line-height: 1.6; }
.pdf-md__upload-actions .pdf-md__limit, .pdf-md__upload-actions .pdf-md__status { margin: 0; }
.pdf-md__workspace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; margin-top: 1.25rem; }
.pdf-md__workspace .pdf-md__panel { display: flex; flex-direction: column; }
.pdf-md__heading-title { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.pdf-md__editor-heading, .pdf-md__preview-heading { justify-content: space-between; flex-wrap: wrap; }
.pdf-md__open { cursor: pointer; text-align: center; }
.pdf-md__visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.pdf-md__open:has(+ input:focus-visible) { outline: 3px solid #087fae; outline-offset: 2px; }
.pdf-md__workspace textarea, .pdf-md__preview { min-height: 490px; max-height: min(66vh, 760px); overflow: auto; }
.pdf-md__preview { padding: 1.25rem; border: 1px solid #bfd6e2; border-radius: .8rem; background: #fff; color: #21394b; line-height: 1.7; overflow-wrap: anywhere; }
.pdf-md__preview-empty { color: #7890a0; font-style: italic; }
.pdf-md__preview > :first-child { margin-top: 0; }
.pdf-md__preview h1, .pdf-md__preview h2, .pdf-md__preview h3, .pdf-md__preview h4 { margin: 1.35em 0 .5em; color: #12384c; line-height: 1.25; font-weight: 800; }
.pdf-md__preview h1 { padding-bottom: .35em; border-bottom: 2px solid #d9eaf1; font-size: 2rem; }
.pdf-md__preview h2 { padding-bottom: .3em; border-bottom: 1px solid #d9eaf1; font-size: 1.55rem; }
.pdf-md__preview h3 { font-size: 1.25rem; }
.pdf-md__preview p, .pdf-md__preview ul, .pdf-md__preview ol, .pdf-md__preview blockquote, .pdf-md__preview table, .pdf-md__preview pre { margin: 0 0 1rem; }
.pdf-md__preview ul, .pdf-md__preview ol { padding-left: 1.5rem; }
.pdf-md__preview li + li { margin-top: .25rem; }
.pdf-md__preview blockquote { padding: .45rem 1rem; border-left: 4px solid #2da3cb; background: #f0f9fc; color: #506b7a; }
.pdf-md__preview pre { overflow: auto; padding: 1rem; border-radius: .65rem; background: #122c3e; color: #eaf7fb; }
.pdf-md__preview code { padding: .13rem .3rem; border-radius: .3rem; background: #e9f3f7; font: .9em ui-monospace, SFMono-Regular, Consolas, monospace; }
.pdf-md__preview pre code { padding: 0; background: transparent; color: inherit; }
.pdf-md__preview table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; }
.pdf-md__preview th, .pdf-md__preview td { padding: .45rem .65rem; border: 1px solid #bfd6e2; }
.pdf-md__preview th { background: #e9f5fa; }
.pdf-md__preview a { color: #086d9a; text-decoration: underline; }
.pdf-md__preview hr { margin: 1.4rem 0; border: 0; border-top: 1px solid #bfd6e2; }
.pdf-md__sync { display: inline-flex; align-items: center; gap: .45rem; color: #537186; font-size: .82rem; cursor: pointer; }
.pdf-md__sync input { accent-color: #087fae; }
.pdf-md__preview-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: 1rem; color: #537186; font-size: .82rem; }
.pdf-md__preview-panel .pdf-md__preview-actions { margin-top: auto; padding-top: 1rem; }
.pdf-md__workspace .pdf-md__result-footer { margin-top: auto; padding-top: 1rem; }
.pdf-md__workspace .pdf-md__status { min-height: 1.5rem; margin-top: .65rem; }
@media (max-width: 850px) { .pdf-md__upload-grid, .pdf-md__workspace { grid-template-columns: 1fr; } .pdf-md__workspace textarea, .pdf-md__preview { min-height: 350px; max-height: 55vh; } }

/* The tools share the site's dark image-led page header and use the viewport for work. */
.body-content:has(> #pdf-md) { padding-inline: 0; }
.pdf-md [hidden] { display: none !important; }
.pdf-md { min-height: 100vh; padding: 0 0 3rem; background: #edf6fa; }
.pdf-md__hero { display: flex; align-items: center; justify-content: center; min-height: clamp(330px, 34vw, 420px); padding: 8.5rem 1.5rem 3.4rem; background-color: #06172a; background-position: center; background-size: cover; color: #fff; text-align: center; }
.pdf-md__hero--pdf { background-image: linear-gradient(90deg, rgba(3,16,31,.16), rgba(3,16,31,.3), rgba(3,16,31,.16)), url('./images/pdf-markdown-hero.png'); }
.pdf-md__hero--preview { background-image: linear-gradient(90deg, rgba(3,16,31,.16), rgba(3,16,31,.3), rgba(3,16,31,.16)), url('./images/markdown-preview-hero.png'); }
.pdf-md__hero-content { width: min(100%, 1040px); }
.pdf-md__hero .pdf-md__eyebrow { color: #a9dff2; font-size: .85rem; }
.pdf-md__hero h1 { margin: .7rem auto .6rem; color: #fff; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.12; text-transform: uppercase; }
.pdf-md__hero p { max-width: 850px; margin: 0 auto; color: #e5f4fa; font-size: clamp(.98rem, 1.35vw, 1.16rem); font-weight: 500; line-height: 1.5; }
.pdf-md__shell { width: calc(100% - clamp(1.5rem, 4vw, 5rem)); max-width: none; margin: 0 auto; padding-top: 1.35rem; }
.pdf-md__panel { padding: clamp(.9rem, 1.5vw, 1.4rem); border-radius: 1rem; }
.pdf-md__panel-heading { margin-bottom: .8rem; }
.pdf-md__panel-heading h2 { font-size: clamp(1.13rem, 1.6vw, 1.4rem); }
.pdf-md__step { width: 2.35rem; height: 2.35rem; }
.pdf-md__upload-grid { grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr); gap: 1rem; }
.pdf-md__upload .pdf-md__drop { min-height: 165px; padding: .85rem; gap: .2rem; }
.pdf-md__drop .pdf-md__visually-hidden { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.pdf-md__drop .pdf-md__browse { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.2rem; margin-top: .35rem; padding: .35rem .9rem; border: 1px solid #91c6da; border-radius: .55rem; background: #fff; color: #075e83; font-size: .85rem; font-weight: 750; }
.pdf-md__drop:hover .pdf-md__browse, .pdf-md__drop:focus-within .pdf-md__browse { border-color: #087fae; background: #e0f3fa; }
.pdf-md__drop > i { font-size: 1.6rem; }
.pdf-md__drop strong { font-size: .97rem; }
.pdf-md__drop input { margin-top: .15rem; }
.pdf-md__upload-actions { gap: .5rem; }
.pdf-md__promises { gap: .4rem; margin-top: 0; }
.pdf-md__upload .pdf-md__promises { margin-bottom: .8rem; }
.pdf-md__promises span { padding: .28rem .65rem; font-size: .78rem; }
.pdf-md__drop .pdf-md__limit { margin: .35rem 0 0; color: #537186; font-size: .78rem; font-weight: 600; }
.pdf-md__drop:has(input:disabled) { opacity: .72; cursor: progress; }
.pdf-md__upload .pdf-md__status:not([hidden]) { min-height: 0; margin: .75rem 0 0; font-size: .9rem; }
.pdf-md__start-empty { display: flex; width: fit-content; min-height: 2.2rem; margin: .8rem auto 0; padding: .35rem .75rem; font-size: .83rem; }
.pdf-md__filename { padding: .3rem .55rem; font-size: .83rem; }
.pdf-md__workspace { gap: 1rem; margin-top: 1rem; }
.pdf-md__open { min-height: 2.2rem; padding: .35rem .65rem; font-size: .83rem; }
.pdf-md__output-label { margin-bottom: .4rem; font-size: .82rem; }
.pdf-md__workspace textarea, .pdf-md__preview { min-height: clamp(540px, 69vh, 1000px); max-height: 78vh; }
.pdf-md__workspace textarea { padding: .85rem; font-size: .85rem; line-height: 1.55; }
.pdf-md__preview { padding: 1rem 1.15rem; font-size: .96rem; font-weight: 400; line-height: 1.55; overflow-x: auto; overflow-wrap: normal; }
.pdf-md__preview p, .pdf-md__preview li, .pdf-md__preview blockquote, .pdf-md__preview td, .pdf-md__preview th { font-size: .96rem; font-weight: 400; line-height: 1.55; }
.pdf-md__preview strong, .pdf-md__preview th { font-weight: 700; }
.pdf-md__preview h1 { font-size: 1.65rem; }
.pdf-md__preview h2 { font-size: 1.35rem; }
.pdf-md__preview h3 { font-size: 1.12rem; }
.pdf-md__preview table { display: table; width: max-content; min-width: 100%; overflow: visible; font-size: .9rem; }
.pdf-md__preview th, .pdf-md__preview td { min-width: 5rem; padding: .4rem .6rem; overflow-wrap: anywhere; }
.pdf-md__note { max-width: none; }
.pdf-md__preview-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .6rem 1rem; margin-left: auto; }
.pdf-md__view-toggle { min-height: 2.3rem; padding: .35rem .7rem; font-size: .82rem; white-space: nowrap; }
.pdf-md__view-toggle span:not([hidden]) { display: inline-flex; align-items: center; gap: .45rem; }
.pdf-md__view-toggle:focus-visible { outline: 3px solid #087fae; outline-offset: 2px; }
body.pdf-md-reading { overflow: hidden; }
body.pdf-md-reading .pdf-md__preview-panel { position: fixed; inset: 0; z-index: 2147483647; display: flex; flex-direction: column; width: 100vw; height: 100vh; height: 100dvh; max-width: none; margin: 0; padding: clamp(.75rem, 1.5vw, 1.4rem); border: 0; border-radius: 0; background: #edf6fa; box-shadow: none; }
body.pdf-md-reading .pdf-md__preview-heading { flex: none; width: 100%; margin-bottom: .65rem; padding-bottom: .6rem; border-bottom: 1px solid #c7dfe9; }
body.pdf-md-reading .pdf-md__sync { display: none; }
body.pdf-md-reading .pdf-md__preview { flex: 1 1 auto; width: 100%; min-height: 0; max-height: none; margin: 0; padding: clamp(1rem, 2vw, 2rem); border-radius: .65rem; background: #fff; overflow: auto; }
body.pdf-md-reading .pdf-md__preview-actions { flex: none; width: 100%; margin-top: 0; padding-top: .65rem; }
body.pdf-md-reading .pdf-md__preview-actions > span { display: none; }
body.pdf-md-reading .pdf-md__preview-panel::backdrop { background: #edf6fa; }
@media (max-width: 850px) { .pdf-md__upload-grid, .pdf-md__workspace { grid-template-columns: 1fr; } .pdf-md__workspace textarea, .pdf-md__preview { min-height: 400px; max-height: 65vh; } }
@media (max-width: 500px) { .pdf-md__hero { min-height: 300px; padding: 7rem .9rem 2.5rem; } .pdf-md__shell { width: calc(100% - 1.1rem); } .pdf-md__panel { padding: .85rem; } .pdf-md__upload-grid { grid-template-columns: 1fr; } }
@media print {
    body.pdf-md-printing #mainNav, body.pdf-md-printing .footer, body.pdf-md-printing .body-content > :not(#pdf-md) { display: none !important; }
    body.pdf-md-printing .body-content { width: 100%; padding: 0 !important; margin: 0 !important; }
    body.pdf-md-printing .pdf-md { padding: 0; min-height: 0; background: #fff; color: #111; }
    body.pdf-md-printing .pdf-md__hero, body.pdf-md-printing .pdf-md__shell > :not(.pdf-md__workspace):not(#pdf-md-stage), body.pdf-md-printing #pdf-md-stage > :not(.pdf-md__workspace), body.pdf-md-printing .pdf-md__result, body.pdf-md-printing .pdf-md__preview-heading, body.pdf-md-printing .pdf-md__preview-actions { display: none !important; }
    body.pdf-md-printing .pdf-md__workspace { display: block; margin: 0; }
    body.pdf-md-printing .pdf-md__preview-panel { display: block; padding: 0; border: 0; box-shadow: none; }
    body.pdf-md-printing .pdf-md__preview { max-height: none; min-height: 0; overflow: visible; padding: 0; border: 0; }
    body.pdf-md-printing .pdf-md__preview pre { white-space: pre-wrap; }
    @page { margin: 16mm; }
}
