/* QuickPDF Studio v7: readability, clear navigation and editor workflow. */
:root {font-size:16px}
body {font-size:16px;line-height:1.65}
:focus-visible {outline:3px solid #bbf58c;outline-offset:3px}
.primary-nav {font-size:14px;gap:18px}
.primary-nav>a,.menu-dropdown>summary {font-weight:650}
.nav-shell {gap:18px;max-width:1400px}
.logo-mark {width:clamp(175px,18vw,240px);height:auto;max-width:none}
.nav-cta {font-size:14px;padding:11px 17px}
/* Tool dropdown: the old two-column panel overflowed and could remain visible when closed. */
.menu-dropdown {z-index:100}
.menu-dropdown:not([open]) > .dropdown-panel {display:none!important}
.menu-dropdown>summary {cursor:pointer;display:flex;align-items:center;gap:8px;padding:10px 0}
.menu-dropdown[open]>summary {color:#c7f6a7}
.menu-dropdown[open]>summary span {transform:rotate(180deg)}
.dropdown-panel {display:block!important;position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-48%);width:min(720px,calc(100vw - 34px));max-height:min(73vh,670px);overflow:auto;overscroll-behavior:contain;border-radius:18px;padding:20px;background:#111b15;border:1px solid #58745c;box-shadow:0 22px 60px #000a;z-index:110}
.dropdown-heading {position:sticky;top:-20px;display:flex;align-items:center;gap:18px;justify-content:space-between;background:#111b15;padding:9px 0 17px;border-bottom:1px solid #425d49;z-index:1}
.dropdown-heading strong {color:#f0f9eb;font-size:17px;font-weight:750}
.dropdown-heading label {flex:0 1 250px}
.dropdown-heading input {width:100%;min-height:42px;padding:10px 13px;background:#182b1d;border:1px solid #5d7b64;color:white;border-radius:10px;font-size:14px;outline:none}
.dropdown-heading input:focus {border-color:#b7ef8e}
.dropdown-tool-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding-top:18px}
.nav-tool-group {min-width:0}
.nav-tool-group[hidden],.nav-tool-link[hidden] {display:none!important}
.nav-tool-group h3 {font-size:12px;text-transform:uppercase;letter-spacing:1px;margin:0 0 9px;color:#b7e38f}
.dropdown-panel .nav-tool-link {display:flex;align-items:center;gap:10px;padding:9px 10px;font-size:14px;color:#dcebdd;border-radius:9px;min-height:40px;line-height:1.25}
.dropdown-panel .nav-tool-link:hover,.dropdown-panel .nav-tool-link:focus-visible {background:#274631;color:#fff}
.nav-tool-ico {display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:7px;background:#213b28;color:#bdf19b;font-weight:750}
.dropdown-empty {padding:30px 12px;text-align:center;color:#b7cbb7;font-size:14px}
.dropdown-empty[hidden] {display:none}
.mobile-tools {grid-column:1/-1;border:1px solid #48664e;border-radius:10px;padding:6px 11px}
.mobile-tools>summary {cursor:pointer;font-weight:730;font-size:15px;color:#ccf5b7;padding:10px}
.mobile-tools-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:9px 0 12px}
.mobile-tools-grid>a {font-size:14px;padding:11px 8px;border-radius:7px;color:#d5e8d4}
.mobile-tools-grid>a:hover {background:#23432a}
/* Use body-size text for actual content; small microcopy is only for decorative elements. */
.home-v4 .v4-hero-lead {font-size:18px;line-height:1.75;color:#c0cfbf}
.home-v4 .v4-spot-desc,.home-v4 .v4-tool-desc,.home-v4 .v4-value-left>p,.home-v4 .v4-value-list small,.home-v4 .v4-info-steps p {font-size:14px;line-height:1.7;color:#b4c9b4}
.home-v4 .v4-tool-title {font-size:21px}
.home-v4 .v4-tool-category,.home-v4 .v4-spot-link,.home-v4 .v4-tool-open,.home-v4 .v4-value-index,.home-v4 .v4-tools-bottom {font-size:12px}
.home-v4 .v4-search-wrap input {font-size:15px}
.home-v4 .v4-filters .filter-btn {font-size:13px;min-height:38px}
.home-v4 .v4-faq .faq-item summary {font-size:16px}
.home-v4 .v4-faq .faq-item p {font-size:15px;line-height:1.7}
.home-v4 .v4-info-steps strong {font-size:16px}
.home-v4 .v4-privacy-note {font-size:14px}
.simple-hero>p,.tool-lead,.simple-body p,.article-text p,.tool-article p,.how-panel p,.tool-hero>p {font-size:16px;line-height:1.75}
.tool-article .faq-item p,.faq-list .faq-item p {font-size:15px;line-height:1.7}
.tool-hero .breadcrumb,.tool-fields label,.tool-fields input,.tool-fields select,.tool-fields textarea,.contact-card label,.contact-card input,.contact-card select,.contact-card textarea {font-size:15px}
.tool-upload .dropzone strong {font-size:19px}
.tool-upload .dropzone span {font-size:15px}
.tool-upload .dropzone small,.safe-copy,.form-hint,.tool-upload .upload-top,.tool-message {font-size:14px;line-height:1.6}
.tool-upload .file-summary {font-size:14px;line-height:1.65;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tool-upload .file-summary.has-files {border:1px solid #527958;border-radius:12px;padding:12px;background:#192d1d}
.upload-ready {background:#315438;color:#d2ffb6;padding:5px 10px;border-radius:20px;font-weight:750;white-space:nowrap}
.uploaded-filename {color:#e9f7e6;overflow-wrap:anywhere;display:inline-block}
.tool-upload .dropzone.has-files {border-color:#a4db85;background:#1d3523}
.tool-message {min-height:1.6em}
.footer-grid>div:not(:first-child)>a,.site-footer .footer-grid p,.site-footer .footer-bottom {font-size:14px;line-height:1.75}
.editor-intro p,.editor-note,.editor-content .three-steps p,.fineprint {font-size:15px;line-height:1.7}
.editor-intro h1 {font-size:32px}
.editor-page>.app {height:min(920px,calc(100vh - 165px));min-height:630px}
/* Do not make the last row of tools unreadable on small screens. */
@media(max-width:1160px){.nav-shell{gap:14px}.logo-mark{width:180px}.primary-nav{gap:13px;font-size:13px}.nav-cta{font-size:13px}}
@media(max-width:920px){.primary-nav,.nav-cta{display:none}.mobile-menu{display:block}.logo-mark{width:clamp(155px,37vw,220px)}.mobile-nav.open{grid-template-columns:repeat(2,minmax(0,1fr));max-height:75vh;overflow-y:auto}.mobile-nav>a{font-size:15px;padding:11px 9px}}
@media(max-width:700px){
 .home-v4 .v4-hero-lead{font-size:16px}.home-v4 .v4-tool-desc,.home-v4 .v4-spot-desc{font-size:14px}
 .home-v4 .v4-filters .filter-btn{font-size:13px;padding:9px 12px}
 .editor-page>.app{height:auto;min-height:780px;overflow:visible}
}
@media(max-width:420px){.mobile-tools-grid{grid-template-columns:1fr 1fr}.home-v4 .v4-filters .filter-btn{font-size:12px}}
/* Editor workspace: accessible controls, explicit applied/saved states */
.editor-page>.app{font-size:15px;min-height:700px;background:#0d1810;color:#edf8ec}
.app .header{min-height:78px;height:auto!important;padding:13px 20px;gap:14px;flex-wrap:wrap}
.app .brand{min-width:175px}.app .brand strong{font-size:17px;letter-spacing:0}.app .brand small{font-size:12px;line-height:1.5}
.app .header-actions{gap:9px;flex-wrap:wrap}
.app .header-actions button{font-size:14px;min-height:43px;padding:10px 16px}
.app .save-button{background:#b5ef84!important;color:#142815!important;font-weight:780;box-shadow:0 6px 20px #b8ef8540}
.app .save-button:disabled{opacity:.5;box-shadow:none}
.app .editor-file-badge{min-width:180px;max-width:280px;display:flex;gap:10px;align-items:center;padding:9px 12px;background:#1c3221;border:1px solid #355a3b;border-radius:10px}
.app .editor-file-badge strong{font-size:14px;display:block;color:#ecf8e9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app .editor-file-badge small{font-size:12px;display:block;color:#acc3ab}
.app .editor-badge-icon{font-weight:900;color:#b5ef84;font-size:21px}
.app .editor-progress{background:#142418;border-bottom:1px solid #35583c;display:flex;align-items:center;gap:20px;padding:10px 20px;flex-wrap:wrap}
.app .progress-step{display:flex;gap:7px;align-items:center;color:#9db49f;font-weight:650;font-size:13px}
.app .progress-step>span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #496b4b;border-radius:50%;color:#a5baa2}
.app .progress-step.active{color:#e4fbd8}.app .progress-step.active>span,.app .progress-step.done>span{background:#b8ef85;color:#152817;border-color:#b8ef85}
.app .progress-step.done{color:#cceebc}
.app .progress-count{margin-left:auto;font-size:13px;color:#c0e9b2;font-weight:700}
.app .workspace{grid-template-columns:230px minmax(320px,1fr) 335px}
.app .left,.app .right{padding:22px 15px}
.app .left .section-head{font-size:12px;color:#b5c3b2;letter-spacing:1.1px;margin:5px 8px 10px}
.app .tool{font-size:14px;font-weight:600;min-height:45px;padding:10px 12px;line-height:1.35}
.app .page-item{font-size:14px;min-height:43px}.app .hint{font-size:13px;line-height:1.6;padding:10px}
.app .stagebar{min-height:50px;height:auto;padding:8px 14px;font-size:14px}
.app .compact-btn{min-width:36px;height:36px;font-size:17px}.app .page-select{font-size:14px}
.app .editor-feedback{background:#203e28;color:#d0f0c4;border-bottom:1px solid #3b6443;padding:10px 16px;font-size:14px;line-height:1.5}
.app .editor-feedback.is-success{background:#24522f;color:#e5ffda}
.app .editor-feedback.is-error{background:#633b2e;color:#ffe4d4}
.app .right{display:flex;flex-direction:column;gap:22px}.app #inspector{flex:1}
.app .right h3{font-size:19px;margin:0 0 12px}
.app .right .help{font-size:14px;line-height:1.65;color:#bdd1ba!important;margin-bottom:18px}
.app .right .field-label{font-size:14px;color:#e4f1de;margin:16px 0 7px}
.app .right .field,.app .right .textbox{font-size:15px;min-height:43px;line-height:1.6;padding:10px 12px}
.app .right textarea.textbox{min-height:110px}
.app .right .pair{gap:12px}.app .right .pair>div{min-width:0}
.app .right .meta-row{font-size:13px;line-height:1.4;padding:10px}
.app .right .small-note,.app .right .bottom-note,.app .right .font-upload{font-size:13px;line-height:1.65}
.app .right .flag{font-size:12px;padding:7px 10px}
.app .right .primary.wide,.app .right .secondary.wide{font-size:15px;min-height:46px;margin-top:12px}
.app .inspector-save{border-top:1px solid #446449;margin-top:auto;padding:17px 0 0;position:sticky;bottom:0;background:#121d16;z-index:2}
.app .inspector-save p{font-size:13px;line-height:1.55;color:#b4cbb3;margin:0}
.app .inspector-save button{width:100%}
.app .editor-applied{display:block;font-size:14px;border-radius:9px;padding:10px 12px;margin-top:12px;background:#214a28;color:#dffcd0;border:1px solid #517c55}
.app .empty-card h2{font-size:25px}.app .empty-card p{font-size:15px;line-height:1.7}
.app .empty-card button{font-size:15px;min-height:46px}
.app .toast{font-size:14px;line-height:1.6}
.app .font-upload input{font-size:13px;max-width:100%}
@media(max-width:1130px){.app .workspace{grid-template-columns:185px minmax(300px,1fr) 275px}.app .header{gap:10px}.app .editor-file-badge{max-width:240px}}
@media(max-width:850px){
 .app .workspace{grid-template-columns:80px minmax(0,1fr);grid-template-rows:minmax(350px,auto) auto}
 .app .left .section-head,.app .left .tool .toolname,.app .left .divider,.app .left .page-list,.app .left .hint{display:none}
 .app .left{padding:12px 8px}.app .left .tool{justify-content:center}
 .app .center{min-width:0}
 .app .right{grid-column:2;grid-row:2;max-height:none;border-left:0;border-top:1px solid #425944;padding:22px}
 .app .inspector-save{position:static}
 .app .scroll-area{min-height:370px;justify-content:flex-start}
 .app .header{padding:12px;align-items:stretch}
 .app .editor-file-badge{max-width:none;flex:1 1 170px}
 .app .header-actions{justify-content:flex-end;flex:1 1 230px}
 .app .editor-progress{gap:9px;padding:8px 12px}
 .app .progress-step{font-size:12px}
 .app .progress-count{width:100%;margin-left:0}
}
@media(max-width:570px){
 .editor-page>.app{width:calc(100% - 14px);height:auto;min-height:750px}
 .app .workspace{grid-template-columns:60px minmax(0,1fr)}
 .app .header-actions{justify-content:space-between;flex-basis:100%}
 .app .header-actions button{flex:1;font-size:13px;padding:9px}
 .app .editor-progress{gap:8px}
 .app .progress-step{font-size:11px}
 .app .progress-step>span{width:21px;height:21px}
 .app .editor-file-badge{min-width:0}
 .app .right{padding:16px}
 .app .editor-feedback{font-size:13px}
 .app .scroll-area{min-height:350px;padding:15px}
 .app .stagebar{padding:8px}
}
.app .editor-draft{display:block;color:#ffe4a1;border:1px solid #9b7136;background:#4b3520;padding:9px 11px;margin-top:10px;border-radius:9px;font-size:13px}
.app .scroll-area.editor-drop-active{outline:3px dashed #b5ef84;outline-offset:-11px;background:#24402c!important}
.app .scroll-area.editor-drop-active:after{content:'Drop your PDF here to open';position:sticky;top:20px;z-index:10;padding:13px 20px;background:#1f4027;border:1px solid #b5ef84;color:#eaffdc;font-size:16px;font-weight:750;border-radius:10px;align-self:flex-start;pointer-events:none}

.app .brand-mark {flex-shrink:0;overflow:hidden;padding:0;background:#12201a!important;border:1px solid #446e49;border-radius:10px}.app .brand-mark img {height:100%;width:100%;object-fit:cover}
/* Readable native font stack: no third-party font download required. */
body,button,input,select,textarea,.app {font-family:"Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,Arial,sans-serif}
h1,h2,h3,h4,.home-v4 .v4-hero h1 {font-family:"Segoe UI Variable Display","Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,Arial,sans-serif}

/* V8 — the document editor must not be cut off by a fixed viewport-height wrapper. */
.editor-page>.app {
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  width:min(1480px,calc(100% - 36px));
}
.app .workspace {
  flex:none;
  min-height:760px;
  grid-template-columns:220px minmax(0,1fr) minmax(330px,370px);
  align-items:stretch;
  overflow:visible;
}
.app .left,.app .right{overflow:visible!important;height:auto;min-height:0;max-height:none!important}
.app .center{min-width:0;min-height:760px;overflow:hidden}
.app .scroll-area {
  flex:none;
  height:min(78vh,900px);
  min-height:550px;
  max-height:none;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  justify-content:safe center;
}
.app .page-list{max-height:none;overflow:visible}
.app .inspector-save {position:sticky;bottom:0;z-index:5;padding:16px 0;background:#121d16;box-shadow:0 -8px 16px #0b1b12a0}
.app .editor-font-warning {
  font-size:14px;line-height:1.55;padding:12px 16px;background:#463c20;
  color:#fff1c0;border-bottom:1px solid #866c30;
}
.app .editor-font-warning[hidden]{display:none!important}
.app .editor-font-warning strong{color:#ffec9a}
.app .editor-font-warning a,.app .editor-font-warning b{color:#fff2a5}
.app .right .font-mode-row {
  display:flex;align-items:flex-start;gap:10px;padding:12px;
  background:#1c3221;border:1px solid #507650;border-radius:10px;
  margin:14px 0;color:#e8f6df;font-size:14px;line-height:1.5;
}
.app .right .font-mode-row input{accent-color:#b5ef84;margin-top:4px;flex-shrink:0}
.app .right .font-mode-note{margin:8px 0 10px;color:#c0d7bb;font-size:13px;line-height:1.55}
.app .header-actions #expandEditorBtn{background:#203c28;color:#e3f8db;border:1px solid #517251}
/* Page scroll is the default, with optional dedicated full-screen editing. */
body.editor-focus-open{overflow:hidden!important}
.editor-page>.app.editor-focus {
  position:fixed!important;inset:0!important;z-index:9999!important;
  width:100vw!important;height:100dvh!important;min-height:0!important;
  margin:0!important;border-radius:0!important;
  overflow:hidden!important;
}
.app.editor-focus .workspace{flex:1;min-height:0;overflow:hidden}
.app.editor-focus .left,.app.editor-focus .right{overflow-y:auto!important;max-height:none!important}
.app.editor-focus .center{min-height:0;overflow:hidden}
.app.editor-focus .scroll-area{height:auto;min-height:0;flex:1;overflow:auto}
.app.editor-focus .page-list{max-height:280px;overflow-y:auto}
@media(max-width:1120px){
  .app .workspace{grid-template-columns:180px minmax(0,1fr) 310px}
}
@media(max-width:850px){
  .app .workspace{grid-template-columns:75px minmax(0,1fr);grid-template-rows:auto auto;min-height:0}
  .app .center{min-height:0}
  .app .scroll-area{height:540px;min-height:380px;justify-content:safe center}
  .app .right{grid-column:2;grid-row:2;min-height:0}
  .app .inspector-save{position:static;box-shadow:none}
  .app.editor-focus .workspace{overflow-y:auto;display:block}
  .app.editor-focus .left{display:flex;flex-direction:row;gap:5px;overflow-x:auto!important}
  .app.editor-focus .left .tool{width:auto}
  .app.editor-focus .center{min-height:470px}
  .app.editor-focus .scroll-area{height:420px;min-height:0}
  .app.editor-focus .right{overflow-y:visible!important}
}
@media(max-width:570px){
  .editor-page>.app{width:calc(100% - 14px)}
  .app .workspace{grid-template-columns:60px minmax(0,1fr)}
  .app .header-actions #expandEditorBtn{flex-basis:100%}
  .app .scroll-area{height:420px;min-height:380px}
}
/* Keep the bottom action in normal document flow; it must never cover inspector fields. */
.app .inspector-save{position:static;box-shadow:none;margin-top:18px}
.app.editor-focus .inspector-save{position:sticky;bottom:0;box-shadow:0 -8px 18px #0b1b12a0}