/* Self-hosted fonts (SIL Open Font License 1.1, see src/fonts/LICENSE.txt), copied to /assets/fonts by the build. */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}




@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/noto-sans-arabic-arabic-variable.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC}

:root{--header-h:74px;--ink:#12213d;--muted:#5b6982;--bg:#f6f8fc;--paper:#fff;--line:#dfe7f4;--blue:#2563eb;--blue2:#1d4ed8;--soft:#eaf1ff;--soft2:#f1f5ff;--accent:#bfdbfe;--shadow:0 18px 60px rgba(24,54,105,.10);--radius:22px}
/* Weight scale: 400 body, 500 UI labels and nav, 600 headings and emphasis, 700 the brand wordmark only.
   Headings and <strong> are set explicitly because the UA default (bold/700) is heavier than this scale allows.
   Only these four faces are loaded; do not introduce 800 or 900 without adding the woff2 files back. */
*{box-sizing:border-box}:focus-visible{outline:2px solid var(--blue);outline-offset:2px}html{scroll-behavior:smooth}body{margin:0;font-family:'Poppins',system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.58}a{color:inherit;text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:600}b,strong{font-weight:600}button,input,select,textarea{font:inherit}.container{width:min(1240px,calc(100% - 32px));margin:auto}.header{position:sticky;top:0;z-index:50;background:rgba(246,248,252,.95);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.header-row{height:var(--header-h);display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;white-space:nowrap}.brand-mark{width:40px;height:40px;border-radius:13px;background:linear-gradient(145deg,#2563eb,#60a5fa);display:grid;place-items:center;color:#fff;font-weight:700}.nav{height:100%;display:flex;align-items:center;gap:3px;flex:1}.nav-item{position:relative;height:100%;display:flex;align-items:center}.nav-trigger{border:0;background:transparent;white-space:nowrap;padding:10px 13px;border-radius:11px;font-size:14px;font-weight:500;letter-spacing:-.01em;color:#1c2e4d;cursor:pointer}.nav-trigger:hover,.nav-item.open>.nav-trigger{background:#fff}.nav-trigger:focus-visible{background:#fff;outline:2px solid var(--blue);outline-offset:2px}.nav-chev{width:16px;height:16px;vertical-align:-3px;margin-inline-start:3px;transition:transform .18s ease}.nav-item.open .nav-chev,html:not(.js) .nav-item:hover .nav-chev,html:not(.js) .nav-item:focus-within .nav-chev{transform:rotate(180deg)}.mega{display:none;position:fixed;top:var(--header-h);left:50%;transform:translateX(-50%);width:min(1180px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:var(--shadow);z-index:80;max-height:calc(100vh - 96px);overflow:auto}.nav-item.open .mega,html:not(.js) .nav-item:hover .mega,html:not(.js) .nav-item:focus-within .mega{display:block}.mega-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;margin-bottom:9px;border-bottom:1px solid var(--line)}.mega-head b{font-size:14px}.mega-head a{font-size:12px;color:var(--blue);font-weight:600;white-space:nowrap;flex:0 0 auto;padding:7px 10px;border-radius:9px}.mega-head a:hover{background:var(--soft2)}.mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.mega-link{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;font-size:13px;font-weight:500;min-height:64px}.mega-link:hover{background:var(--soft2)}.mini-icon,.tool-icon{display:grid;place-items:center;border-radius:11px;background:var(--soft);color:var(--blue2);flex:0 0 auto}.mini-icon{width:46px;height:46px;border-radius:14px}.mini-icon svg{width:28px;height:28px}.tool-icon{width:52px;height:52px;border-radius:15px}.tool-icon svg{width:30px;height:30px}.header-actions{display:flex;align-items:center;gap:8px;margin-inline-start:auto}.lang-wrap{position:relative}.lang-btn,.menu-btn{height:42px;border:1px solid var(--line);background:#fff;border-radius:13px;padding:0 13px;display:flex;align-items:center;gap:8px;font-weight:500;cursor:pointer}.lang-btn svg{width:18px;height:18px}.lang-menu{display:none;position:absolute;inset-inline-end:0;top:51px;width:min(320px,calc(100vw - 24px));z-index:85;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;box-shadow:var(--shadow)}.lang-menu.open{display:grid;grid-template-columns:1fr 1fr;gap:5px}.lang-menu button,.lang-menu a{display:block;border:0;background:transparent;text-align:start;padding:9px;border-radius:10px;cursor:pointer}.lang-menu button:hover,.lang-menu a:hover{background:var(--soft2)}.lang-menu a[aria-current="true"]{background:var(--soft);color:var(--blue2);font-weight:600}.menu-btn{display:none}.mobile-nav{display:none}.hero{padding:76px 0 48px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.eyebrow{display:inline-flex;padding:7px 11px;border-radius:999px;background:var(--soft);color:var(--blue2);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.hero h1,.page-hero h1{font-size:clamp(44px,6vw,72px);line-height:.99;letter-spacing:-.05em;margin:18px 0}.hero h1 em{font-style:normal;background:linear-gradient(90deg,#2563eb,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy,.page-hero p{font-size:17px;color:var(--muted);max-width:760px}.hero-points{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}.hero-point{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:500}.check{width:22px;height:22px;flex:0 0 auto;border-radius:50%;background:#dbeafe;color:var(--blue2);display:grid;place-items:center}.upload-card,.workspace{background:#fff;border:1px solid var(--line);border-radius:28px;padding:18px;box-shadow:var(--shadow)}.upload-top{display:flex;justify-content:space-between;align-items:center;padding:6px 4px 16px}.privacy-pill{font-size:11px;font-weight:600;background:var(--soft2);padding:6px 9px;border-radius:999px;color:var(--blue2)}.dropzone{min-height:315px;border:2px dashed #bfd0ef;border-radius:24px;background:linear-gradient(180deg,#fbfdff,#f3f7ff);display:grid;place-items:center;text-align:center;padding:28px;transition:.2s}#dropzone{cursor:pointer}#dropzone:hover,.dropzone.drag{border-color:var(--blue);transform:translateY(-2px)}.drop-icon{width:72px;height:72px;border-radius:23px;margin:auto;background:#142442;color:#fff;display:grid;place-items:center}.drop-icon svg{width:30px;height:30px}.dropzone h3{margin:16px 0 6px}.dropzone p{margin:0;color:var(--muted);font-size:13px}.primary,.secondary{border-radius:14px;padding:12px 17px;font-weight:600;cursor:pointer}.primary{border:0;background:var(--blue);color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.2)}.primary:hover{background:var(--blue2)}.secondary{border:1px solid var(--line);background:#fff}.section{padding:62px 0}.section.alt{background:#eef4ff}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:22px}.section-head h2{font-size:36px;line-height:1.08;letter-spacing:-.035em;margin:0}.section-head p{margin:8px 0 0;color:var(--muted);max-width:720px}.text-link{font-size:13px;color:var(--blue);font-weight:600}.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.tool-card{display:flex;flex-direction:column;min-height:180px;background:#fff;border:1px solid var(--line);border-radius:19px;padding:16px;transition:.2s}.tool-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(23,48,92,.08)}.tool-card-top{display:flex;justify-content:space-between;align-items:start}.tool-arrow{width:31px;height:31px;border-radius:10px;background:#f3f6fb;display:grid;place-items:center;color:#71829e}.tool-card h3{font-size:16px;margin:15px 0 5px}.tool-card p{font-size:12.5px;color:var(--muted);margin:0}.tool-card .tag{font-size:10px;color:#5c6b82;text-transform:uppercase;letter-spacing:.07em;font-weight:600;margin-top:auto;padding-top:13px}.banner{border-radius:30px;background:#0f1f3a;color:#fff;padding:35px;display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center}.banner h2{font-size:36px;line-height:1.05;letter-spacing:-.035em;margin:0 0 12px}.banner p{color:#c8d3e4}.format-cloud{display:flex;flex-wrap:wrap;gap:8px}.format-cloud span{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);padding:9px 11px;border-radius:12px;font-size:12px;font-weight:500}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.step{background:#fff;border:1px solid var(--line);border-radius:19px;padding:20px}.step-num{width:32px;height:32px;border-radius:10px;background:#dbeafe;color:var(--blue2);display:grid;place-items:center;font-weight:600;margin-bottom:12px}.page-hero{padding:58px 0 30px}.breadcrumb{font-size:12px;color:#5a6a83;margin-bottom:14px}.breadcrumb a{color:var(--blue2);font-weight:500}.breadcrumb a:hover{text-decoration:underline}.page-hero h1{font-size:50px;margin:10px 0 12px}.tool-layout{display:grid;grid-template-columns:1fr 330px;gap:22px;align-items:start}.tool-layout>*{min-width:0}.workspace .dropzone{min-height:370px}.options{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;position:sticky;top:96px}.options h3{margin:0 0 13px}.field{margin:14px 0}.field label{display:block;font-size:12px;font-weight:600;margin-bottom:6px}.field input,.field select{width:100%;border:1px solid var(--line);border-radius:11px;background:#fbfcfe;padding:11px}.file-list{display:none;margin-top:14px}.file-list.show{display:block}.file-row{display:flex;justify-content:space-between;gap:12px;align-items:center;min-width:0;padding:11px 12px;background:#f7f9fe;border:1px solid var(--line);border-radius:12px;margin-top:8px;font-size:12px}.file-row>span:first-child{min-width:0;overflow-wrap:anywhere}.page-picker{display:none;margin-top:18px}.page-picker.show{display:block}.page-picker-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}.page-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.page-tile{aspect-ratio:.74;background:#fff;border:2px solid var(--line);border-radius:12px;display:flex;flex-direction:column;justify-content:space-between;padding:8px;cursor:pointer;transition:.15s;position:relative}.page-tile:before{content:'';position:absolute;inset:10px;background:linear-gradient(#d8e2f4 0 0) 0 0/70% 4px no-repeat,linear-gradient(#e4ebf6 0 0) 0 14px/82% 3px no-repeat,linear-gradient(#e4ebf6 0 0) 0 25px/62% 3px no-repeat}.page-tile span{position:relative;z-index:2;margin-top:auto;font-size:11px;font-weight:600;color:#4f5e78}.page-tile.selected{border-color:var(--blue);background:#eef4ff;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.page-tile.selected:after{content:'✓';position:absolute;inset-inline-end:6px;top:6px;width:20px;height:20px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:600}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.content-wrap{display:grid;grid-template-columns:1fr 320px;gap:28px}.prose{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px}.prose h2{font-size:28px;margin-top:0}.prose h3{margin-top:28px}.prose p,.prose li{color:#53647e}.prose a{color:var(--blue2);text-decoration:underline;text-underline-offset:2px}.prose a:hover{color:var(--blue)}.quick-panel{background:linear-gradient(160deg,#eef4ff,#fff);border:1px solid var(--line);border-radius:22px;padding:20px}.quick-panel h3{margin-top:0}.quick-list{display:grid;gap:10px}.quick-item{display:flex;gap:10px;align-items:start}.quick-item i{width:28px;height:28px;flex:0 0 auto;border-radius:9px;background:#dbeafe;color:var(--blue2);display:grid;place-items:center;font-style:normal;font-weight:600;font-size:12px}.quick-item b{display:block;font-size:13px}.quick-item span{display:block;color:var(--muted);font-size:11px;margin-top:2px}.faq details{border-top:1px solid var(--line);padding:14px 0}.faq summary{font-weight:600;cursor:pointer}.all-layout{display:grid;grid-template-columns:230px 1fr;gap:28px}.side-nav{position:sticky;top:92px;align-self:start}.side-nav a{display:block;padding:9px 11px;border-radius:10px;font-size:13px;font-weight:500;color:#556780}.side-nav a:hover{background:#fff}.category-block{margin-bottom:40px}.category-block h2{font-size:28px}.search-box{display:flex;gap:9px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:15px;padding:9px 12px;max-width:470px}.search-box input{border:0;background:transparent;width:100%}.search-box input:focus{outline:0}.search-box:focus-within{outline:2px solid var(--blue);outline-offset:2px}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.guide-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;min-height:190px}.guide-card small{color:var(--blue);font-weight:600}.guide-card h3{margin:9px 0}.guide-card p{font-size:13px;color:var(--muted)}.form-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px}.form-card input,.form-card textarea,.form-card select{width:100%;border:1px solid var(--line);border-radius:11px;padding:11px;margin:6px 0 13px}.form-card textarea{min-height:130px}.footer{margin-top:60px;padding:54px 0 30px;background:#0f1f3a;color:#fff}.footer-grid{display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:34px}.footer p{color:#a8b5c9;font-size:13px}.footer h4{margin:0 0 12px}.footer a{display:block;color:#bac4d5;font-size:13px;margin:8px 0}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;margin-top:38px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;color:#91a0b7}.toast{position:fixed;inset-inline-end:18px;bottom:18px;background:#12213d;color:#fff;border-radius:14px;padding:12px 15px;font-size:13px;font-weight:500;box-shadow:var(--shadow);transform:translateY(120px);opacity:0;visibility:hidden;transition:.25s;z-index:90}.toast.show{transform:translateY(0);opacity:1;visibility:visible}.rtl{direction:rtl}
@media(max-width:1060px){.nav{display:none}.menu-btn{display:flex}.hero-grid,.banner,.tool-layout,.content-wrap{grid-template-columns:1fr}.tools-grid{grid-template-columns:repeat(3,1fr)}.options{position:static}.footer-grid{grid-template-columns:1fr 1fr 1fr}.all-layout{grid-template-columns:1fr}.side-nav{position:static;display:flex;overflow:auto}.side-nav a{white-space:nowrap}.mobile-nav.open{display:block;position:fixed;inset:calc(var(--header-h) + 1px) 0 0;background:var(--bg);z-index:45;padding:18px;overflow:auto}.mobile-nav details{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:8px}.mobile-nav summary{padding:13px;font-weight:600}.mobile-nav details a,.mobile-nav>a{display:block;padding:10px 13px;font-size:13px}.page-grid{grid-template-columns:repeat(5,1fr)}}@media(max-width:1320px){.nav{gap:1px}.nav-trigger{padding:10px 9px;font-size:13.5px}.lang-btn .label{display:none}}@media(max-width:1120px){.nav{display:none}.menu-btn{display:flex}.mobile-nav.open{display:block;position:fixed;inset:calc(var(--header-h) + 1px) 0 0;background:var(--bg);z-index:45;padding:18px;overflow:auto}.mobile-nav details{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:8px}.mobile-nav summary{padding:13px;font-weight:600}.mobile-nav details a,.mobile-nav>a{display:block;padding:10px 13px;font-size:13px}}
@media(max-width:740px){.container{width:min(100% - 22px,1240px)}:root{--header-h:66px}.brand{font-size:19px}.lang-btn .label{display:none}.hero{padding:44px 0 28px}.hero h1{font-size:43px}.tools-grid,.guide-grid,.related-grid,.steps{grid-template-columns:1fr 1fr}.section{padding:46px 0}.section-head{align-items:start;flex-direction:column}.section-head h2{font-size:30px}.page-hero h1{font-size:39px}.page-grid{grid-template-columns:repeat(4,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column;align-items:start}}
@media(max-width:480px){.tools-grid,.guide-grid,.related-grid,.steps{grid-template-columns:1fr}.hero h1{font-size:38px}.page-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}}
.process-status{margin-top:12px;min-height:20px;font-size:12px;color:var(--muted)}.process-status.working{color:#1d4ed8}.process-status.ok{color:#087443}.process-status.error{color:#b42318}.process-status.warn{color:#b54708}.redaction-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-bottom:8px}.redaction-grid input:first-child{grid-column:1/-1}.redaction-list{display:grid;gap:6px;margin-top:8px}.redaction-row{display:flex;justify-content:space-between;gap:8px;align-items:center;border:1px solid var(--line);background:#f8faff;border-radius:10px;padding:8px 9px;font-size:11px}.redaction-row button{border:0;background:#fee2e2;color:#b42318;width:24px;height:24px;border-radius:8px;cursor:pointer}.options button:disabled{opacity:.65;cursor:wait}.muted{color:var(--muted)}


.file-remove{width:28px;height:28px;border:0;border-radius:9px;background:#eef3ff;color:#315fae;font-size:18px;line-height:1;cursor:pointer}.file-row[draggable="true"]{cursor:grab}.file-row[draggable="true"]:active{cursor:grabbing}

@media(max-width:740px){.lang-menu{position:fixed;left:12px;right:12px;width:auto;top:calc(var(--header-h) + 6px)}.mini-icon{width:44px;height:44px}.tool-icon{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Additions: accessibility utilities, icon sprite, footer headings and topic-content blocks.
   Appended after style.css by src/build.js. Uses only tokens defined in style.css :root. */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;inset-inline-start:12px;top:-64px;z-index:200;background:#fff;color:var(--ink);border:2px solid var(--blue);border-radius:12px;padding:10px 14px;font-weight:600;transition:top .15s}
.skip-link:focus{top:12px}
main:focus{outline:0}
.footer .footer-h{margin:0 0 12px;font-size:15px;line-height:1.3;color:#fff}
.field-hint{font-size:11px;color:var(--muted);margin:6px 0 0}
.redaction-set{border:0;padding:0;margin:14px 0;min-width:0}
.redaction-set legend{font-size:12px;font-weight:600;margin-bottom:6px;padding:0}
.redaction-grid label{display:grid;gap:3px;font-size:11px;font-weight:500;color:var(--muted)}
.redaction-grid label:first-child{grid-column:1/-1}
.dropzone h2{margin:16px 0 6px;font-size:1.17em}
.options h2{margin:0 0 13px;font-size:1.17em}

/* All tools search */
.search-status{min-height:20px;margin:10px 0 0;font-size:13px;color:var(--muted)}
.empty-state{background:#fff;border:1px dashed #c9d6ec;border-radius:18px;padding:22px;text-align:center;color:var(--muted);margin-bottom:24px}
.empty-state a{color:var(--blue2);font-weight:600}
.all-main{min-width:0}

/* Article content on tool, category, guide and about pages */
.content-wrap>*{min-width:0}
/* The brand icon brings its own rounded tile, so the old text badge's gradient and radius go. */
img.brand-mark{display:block;flex:0 0 auto;background:none;border-radius:0;object-fit:contain}
.prose>h2:not(:first-child){margin-top:34px}
.prose-lead{font-size:17px;line-height:1.65;margin-top:0}
.prose p.prose-lead{color:#3f4f69}
.steps-list{padding-inline-start:22px}
.steps-list li{margin:7px 0;padding-inline-start:4px}
.use-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0 6px}
.use-case{background:var(--soft2);border:1px solid var(--line);border-radius:16px;padding:16px}
.use-case h3{margin:0 0 6px;font-size:15px}
.prose .use-case p{margin:0;font-size:13.5px}
.limits-note{margin:28px 0 8px;border:1px solid #f1dfb4;background:#fffaf0;border-radius:16px;padding:16px 18px}
.prose .limits-note h2{margin:0 0 6px;font-size:17px}
.prose .limits-note p{margin:0;color:#5b4a26}
.cluster-links{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.cluster-link{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 13px;font-size:13px;font-weight:500;color:var(--blue2)}
.cluster-link:hover{border-color:var(--blue);background:var(--soft2)}
.prose .cluster-link{text-decoration:none}
.toc{margin-top:18px}
.toc-h{font-size:15px;margin:0 0 8px}
.toc ol{margin:0;padding-inline-start:18px}
.toc li{margin:6px 0;font-size:13px;color:var(--muted)}
.toc a{color:var(--blue2)}
.toc a:hover{text-decoration:underline}
.quick-panel .toc:first-child{margin-top:0}
.workflow-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0}
.workflow-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}
.workflow-card h3{margin:0 0 6px;font-size:16px}
.prose .workflow-card p{margin:0 0 10px;font-size:13.5px}
.workflow-tools{display:flex;flex-wrap:wrap;gap:6px}
.prose .workflow-tools a{font-size:12px;font-weight:600;color:var(--blue2);background:var(--soft2);border-radius:999px;padding:5px 10px;text-decoration:none}
.guide-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--muted);margin-top:8px}
.entity-box{background:linear-gradient(160deg,#eef4ff,#fff);border:1px solid var(--line);border-radius:22px;padding:22px}
.entity-box h2{margin:0 0 8px;font-size:22px}
.entity-box p{margin:0;color:#53647e}
.trust-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}
.trust-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}
.trust-card h3{margin:0 0 6px;font-size:15px}
.trust-card p{margin:0;font-size:13.5px;color:#53647e}
.hub-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.hub-link{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;transition:.2s}
.hub-link:hover{border-color:var(--blue);transform:translateY(-2px)}
.hub-link b{display:block;font-size:15px}
.hub-link span{display:block;font-size:13px;color:var(--muted);margin-top:4px}

@media(max-width:1060px) and (min-width:741px){.use-cases,.hub-links{grid-template-columns:1fr 1fr}}
@media(max-width:740px){.use-cases,.workflow-grid,.trust-grid,.hub-links{grid-template-columns:1fr}.prose{padding:20px}.prose h2{font-size:24px}}

/* Homepage tool finder */
.finder{display:flex;flex-direction:column;gap:14px;padding:24px}
.finder-form{position:relative;margin:0}
.finder-label{display:block;font-size:22px;font-weight:600;line-height:1.25;letter-spacing:-.02em;margin:0 0 12px}
.search-box.finder-box{max-width:none;padding-block:6px;padding-inline:14px 6px}
.finder-box input{min-width:0;font-size:15px;padding:8px 0}
.finder-submit{flex:0 0 auto;padding:10px 16px;box-shadow:none}
.finder-results{position:absolute;inset-inline:0;top:calc(100% + 6px);z-index:30;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);max-height:340px;overflow:auto}
.finder-results [role="option"]{display:grid;gap:2px;padding:10px 12px;border-radius:11px;cursor:pointer}
.finder-results [role="option"] b{font-size:14px}
.finder-results [role="option"] span{font-size:12px;line-height:1.45;color:var(--muted)}
.finder-results [aria-selected="true"]{background:var(--soft2);box-shadow:inset 0 0 0 2px var(--accent)}
.finder-hint{padding:10px 12px;font-size:13px;color:var(--muted)}
.finder-examples{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.finder-examples>span{font-weight:600;margin-inline-end:2px}
.chip{display:inline-flex;align-items:center;padding:6px 11px;border-radius:999px;background:var(--soft2);border:1px solid var(--line);color:var(--blue2);font-size:12px;font-weight:500}
.chip:hover{border-color:var(--blue);background:#fff}
.finder-all{align-self:flex-start}

/* Tool workspace: uploader facts, limitation note, fixed target, common sizes */
.upload-meta{display:flex;flex-wrap:wrap;row-gap:4px;margin:12px 4px 0;font-size:12px;color:var(--muted)}
.upload-meta span:not(:last-child)::after{content:'\00B7';margin-inline:8px;color:#9aa8bd}
.tool-note{display:flex;gap:9px;margin:10px 0 0;padding:10px 12px;border:1px solid #f1dfb4;background:#fffaf0;color:#5b4a26;border-radius:12px;font-size:12.5px;line-height:1.5}
.tool-note::before{content:'i';flex:0 0 auto;width:18px;height:18px;margin-top:1px;border-radius:50%;background:#f5d58a;color:#5b4a26;display:grid;place-items:center;font-size:11px;font-weight:600;font-style:italic}
.upload-trust{font-size:11px;margin:10px 0 0}
.preset-target{margin:14px 0;padding:11px 12px;border-radius:11px;background:var(--soft2);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--blue2)}
.size-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0 0}
.size-links-label{font-size:13px;font-weight:600;margin-inline-end:4px}
.size-link{display:inline-flex;padding:7px 13px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--blue2)}
.size-link:hover{border-color:var(--blue)}
.size-link[aria-current="page"]{background:var(--blue);border-color:var(--blue);color:#fff}

/* Homepage: why VelloDoc, FAQ */
.why-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 18px;margin:16px 0 0;padding:0}
.why-facts li{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500}
.entity-box .why-link{margin-top:14px}
.home-faq .container>h2{font-size:36px;line-height:1.08;letter-spacing:-.035em;margin:0 0 16px}
.home-faq .faq{max-width:860px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:6px 24px}
.home-faq .faq details:first-child{border-top:0}
.home-faq .faq p{color:#53647e;margin:10px 0 0}
.home-faq .faq a{color:var(--blue2);text-decoration:underline;text-underline-offset:2px}

/* Policy pages */
.prose.legal ul{padding-inline-start:22px}
.prose.legal li{margin:6px 0}
.prose .legal-updated{font-size:13px;color:var(--muted);margin-top:0}

/* Status page */
.status-board{list-style:none;margin:0;padding:0;max-width:860px;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden}
.status-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;border-top:1px solid var(--line)}
.status-row:first-child{border-top:0}
.status-name{font-weight:500;min-width:0}
.status-state{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;white-space:nowrap;color:var(--muted)}
.status-state::before{content:'';width:10px;height:10px;border-radius:50%;background:#9aa8bd}
.status-state[data-state="ok"]{color:#087443}.status-state[data-state="ok"]::before{background:#12b76a}
.status-state[data-state="degraded"]{color:#93370d}.status-state[data-state="degraded"]::before{background:#f79009}
.status-state[data-state="down"]{color:#b42318}.status-state[data-state="down"]::before{background:#f04438}
.status-updated{min-height:20px;margin:12px 0 4px;font-size:13px;color:var(--muted)}

/* Arabic-script pages (Arabic, Urdu): no letter-spacing (it breaks joined letters), room for marks, matching font */
html[lang="ar"] body,html[lang="ur"] body{font-family:'Poppins','Noto Sans Arabic',system-ui,sans-serif}
html[lang="ur"] body{line-height:1.8}
:is(html[lang="ar"],html[lang="ur"]) :is(.nav-trigger,.eyebrow,.hero h1,.page-hero h1,.section-head h2,.banner h2,.tool-card .tag,.finder-label,.home-faq .container>h2){letter-spacing:0}
:is(html[lang="ar"],html[lang="ur"]) :is(.hero h1,.page-hero h1){line-height:1.3}
:is(html[lang="ar"],html[lang="ur"]) :is(.section-head h2,.banner h2,.home-faq .container>h2,.finder-label){line-height:1.4}
[dir="rtl"] .page-tile:before{transform:scaleX(-1)}

@media(max-width:740px){.finder{padding:18px}.finder-label{font-size:19px}.home-faq .container>h2{font-size:30px}.home-faq .faq{padding:4px 16px}.status-row{padding:14px 16px}}
@media(max-width:480px){.finder-submit{padding:10px 12px}}
/* Short labels that mix scripts, such as "1 MB" or "PDF/A", keep their own direction on right-to-left pages */
.chip,.size-link,.format-cloud span,.tool-card .tag{unicode-bidi:plaintext}

/* Advanced tools (src/app.tools.js): sanitizer report, bookmark editor, visual compare, share links, AI workspace */
.field textarea{width:100%;border:1px solid var(--line);border-radius:11px;background:#fbfcfe;padding:11px;resize:vertical;min-height:84px}
.check-set{border:0;padding:0;margin:0 0 12px;min-width:0}.check-set legend{font-size:12px;font-weight:600;margin-bottom:6px;padding:0}
.check-row{display:flex;gap:9px;align-items:flex-start;padding:7px 0;font-size:13px;line-height:1.45;cursor:pointer}.check-row input{margin-top:3px;flex:0 0 auto;width:16px;height:16px;accent-color:var(--blue)}
.check-row small{display:block;color:var(--muted);font-size:11.5px;font-weight:400;margin-top:2px}
.field label.check-row,label.check-row{display:flex;font-size:13px;font-weight:500;margin:0}
.check-inline{display:inline-flex;gap:7px;align-items:center;font-size:13px;cursor:pointer;white-space:nowrap}.check-inline input{accent-color:var(--blue)}.check-inline[hidden]{display:none}
.ext-panel{margin-top:22px}.ext-panel[hidden]{display:none}
.ext-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:var(--shadow);min-width:0}
.ext-card h2{margin:0 0 8px;font-size:1.3em}.ext-card h3{margin:22px 0 8px;font-size:1.08em}.ext-card>p{margin:0 0 10px}
.ext-card hr{border:0;border-top:1px solid var(--line);margin:22px 0}
.ext-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 6px}
.ext-actions .primary,.ext-actions .secondary{border-radius:14px;padding:11px 16px;font-weight:600;cursor:pointer}
.ext-actions button:disabled{opacity:.6;cursor:wait}
.button-link{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink)}
.text-btn{border:0;background:none;color:var(--blue2);font-weight:500;padding:4px 0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.icon-btn{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font-size:15px;line-height:1;cursor:pointer;padding:0}
.icon-btn:hover:not(:disabled){border-color:var(--blue);color:var(--blue2)}.icon-btn:disabled{opacity:.35;cursor:default}
.danger{border:1px solid #fecdca;background:#fef3f2;color:#b42318;border-radius:14px;padding:11px 16px;font-weight:600;cursor:pointer}.danger:hover{background:#fee4e2}
.table-wrap{overflow-x:auto;margin:12px 0;border:1px solid var(--line);border-radius:14px}
.ext-table{width:100%;border-collapse:collapse;font-size:13px}.ext-table th,.ext-table td{padding:9px 12px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top}
.ext-table thead th{background:var(--soft2);font-size:12px;white-space:nowrap}.ext-table tbody tr:last-child>*{border-bottom:0}.ext-table tbody th{font-weight:500}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--soft);color:var(--blue2);font-size:11.5px;font-weight:600;white-space:nowrap}
.badge-removed,.badge-active{background:#dcfae6;color:#067647}.badge-partly{background:#fef0c7;color:#93370d}.badge-revoked{background:#fee4e2;color:#b42318}.badge-kept{background:#eef2f8;color:#344054}.badge-none,.badge-expired{background:#f2f4f7;color:#475467}
.scan-list{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:6px}
.scan-list li{display:flex;justify-content:space-between;gap:10px;padding:8px 11px;border:1px solid var(--line);border-radius:11px;font-size:13px;background:#fbfcfe}
.scan-list li b{font-weight:500;color:var(--muted);white-space:nowrap}.scan-list li.is-found{border-color:#fedf89;background:#fffcf5}.scan-list li.is-found b{color:#93370d}
.status-state[data-state="off"]{color:#475467}.status-state[data-state="off"]::before{background:#98a2b3}

.bm-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:6px}
.bm-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:8px 10px;margin-inline-start:calc(var(--lvl,0) * 22px);border:1px solid var(--line);border-radius:12px;background:#fbfcfe}
.bm-level{font-size:11px;color:var(--muted);white-space:nowrap}
.bm-title,.bm-page input{border:1px solid var(--line);border-radius:9px;background:#fff;padding:8px 10px;min-width:0;width:100%}
.bm-page{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.bm-page input{width:72px}
.bm-actions{display:flex;gap:4px}

.cmp-stats{list-style:none;padding:0;margin:10px 0;display:flex;flex-wrap:wrap;gap:8px}.cmp-stats li{padding:5px 11px;border-radius:999px;background:var(--soft2);border:1px solid var(--line);font-size:12.5px}
.cmp-stats .is-added{border-color:#abefc6}.cmp-stats .is-removed{border-color:#fecdca}.cmp-stats .is-moved{border-color:#b2ddff}
.cmp-toolbar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:14px 0 8px}
.seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.seg-btn{border:0;background:#fff;padding:8px 13px;font-size:13px;font-weight:500;cursor:pointer;color:var(--ink)}.seg-btn+.seg-btn{border-inline-start:1px solid var(--line)}
.seg-btn[aria-pressed="true"]{background:var(--blue);color:#fff}
.cmp-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--muted);margin:4px 0 10px}
.key{display:inline-flex;align-items:center;gap:6px}.key::before{content:'';width:14px;height:10px;border:2px solid;border-radius:3px}
.key-region::before{border-color:#f04438;background:rgba(240,68,56,.12)}.key-removed::before{border-color:#b42318;border-style:dashed}.key-added::before{border-color:#12b76a}.key-moved::before{border-color:#2e90fa;border-style:dotted}
.cmp-panes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cmp-label{margin:0 0 6px;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cmp-label span{color:var(--muted)}
.cmp-scroll{position:relative;max-height:75vh;overflow:auto;border:1px solid var(--line);border-radius:14px;background:#eef2f8;padding:12px;overscroll-behavior:contain}
.cmp-single{max-width:760px;margin:0 auto}
.cmp-page{margin:0 0 14px}.cmp-page figcaption{font-size:12px;color:var(--muted);text-align:center;margin-top:5px}
.cmp-img{position:relative;background:#fff;box-shadow:0 2px 10px rgba(24,54,105,.12);line-height:0}.cmp-img img{display:block;width:100%;height:auto}
.cmp-stack img.cmp-top{position:absolute;inset:0}.cmp-stack.is-diff{background:#000}.cmp-stack.is-diff img.cmp-top{mix-blend-mode:difference;opacity:1}
.cmp-region,.cmp-removed,.cmp-added,.cmp-moved{position:absolute;pointer-events:none;border-radius:2px}
.cmp-region{border:2px solid #f04438;background:rgba(240,68,56,.1)}.cmp-removed{border:2px dashed #b42318}.cmp-added{border:2px solid #12b76a}.cmp-moved{border:2px dotted #2e90fa}
.cmp-missing{display:grid;place-items:center;min-height:240px;border:2px dashed var(--line);border-radius:6px;color:var(--muted);font-size:13px;text-align:center;padding:12px;line-height:1.4}
.cmp-changes{margin-top:18px}.cmp-change{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:8px;background:#fbfcfe}
.cmp-change summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cmp-list h4{margin:10px 0 4px;font-size:13px}.cmp-list ul{margin:0;padding-inline-start:20px;font-size:13px}.cmp-list li{margin:2px 0;overflow-wrap:anywhere}
.cmp-list.is-added h4{color:#067647}.cmp-list.is-removed h4{color:#b42318}.cmp-list.is-moved h4{color:#175cd3}

.copy-field{margin:12px 0}.copy-row{display:flex;gap:8px}.copy-row .copy-input{flex:1 1 auto;min-width:0;font-size:13px}.copy-row .secondary{flex:0 0 auto;white-space:nowrap;border-radius:11px;padding:10px 14px;font-weight:600;cursor:pointer}
.share-facts{list-style:none;padding:0;margin:10px 0;display:flex;flex-wrap:wrap;gap:8px}.share-facts li{padding:5px 11px;border-radius:999px;background:var(--soft2);border:1px solid var(--line);font-size:12.5px}
.share-section{padding-top:28px;min-height:60vh}.share-app{max-width:980px;margin:0 auto}
.share-message h1,.share-password h1,.share-manage h1,.share-head h1{font-size:1.5em;margin:0 0 8px;line-height:1.3;overflow-wrap:anywhere}
.share-message.is-expired,.share-message.is-revoked,.share-message.is-missing{border-color:#fedf89}
.share-password{max-width:460px;margin:0 auto}.share-password .primary{border-radius:14px;padding:12px 18px;font-weight:600;cursor:pointer;margin-top:8px}
.share-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 20px;align-items:center;position:sticky;top:calc(var(--header-h) + 8px);z-index:5;padding:14px 18px}
.share-head p{margin:0}.share-tools{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.share-tools .process-status{margin:0;min-height:0}
.share-head .primary{border-radius:14px;padding:11px 16px;font-weight:600;cursor:pointer}
.share-pages{display:grid;gap:18px;margin:18px auto 0;max-width:900px}
.share-page{margin:0}.share-page figcaption{font-size:12px;color:var(--muted);text-align:center;margin-top:6px}
.share-page-img{background:#fff;min-height:320px;display:grid;place-items:center;box-shadow:var(--shadow);border-radius:4px;overflow:hidden}
.share-page-img.is-loaded{min-height:0;display:block}.share-page-img img{display:block;width:100%;height:auto}
.share-pages.is-view-only img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.share-foot{text-align:center;margin:18px 0 0}
.share-name{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.share-dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:4px 10px;margin:14px 0}
.share-dl>div{min-width:0}.share-dl dt{font-size:11.5px;color:var(--muted);font-weight:500;margin:0}.share-dl dd{font-size:14px;font-weight:500;margin:0}

.ai-docs{list-style:none;padding:0;margin:10px 0;display:grid;gap:6px}
.ai-docs li{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:11px;background:#fbfcfe;font-size:13px}.ai-docs b{overflow-wrap:anywhere}
.ai-section{border-top:1px solid var(--line);margin-top:18px;padding-top:4px}
.ai-section input[type="search"]{width:100%;border:1px solid var(--line);border-radius:11px;background:#fbfcfe;padding:11px}
.ai-hits{list-style:none;padding:0;margin:6px 0;display:grid;gap:6px;max-height:420px;overflow:auto}
.ai-hit{display:block;width:100%;text-align:start;border:1px solid var(--line);border-radius:11px;background:#fff;padding:9px 12px;cursor:pointer;font-size:13px;color:var(--ink)}
.ai-hit:hover{border-color:var(--blue)}.ai-hit b{display:block;margin-bottom:2px}.ai-hit span{display:block;color:var(--muted);overflow-wrap:anywhere}
.ai-ws mark{all:unset;background:#fef08a;color:inherit;border-radius:3px;padding:0 1px}
.ai-form .seg{margin-bottom:12px}.ai-form>.primary{border-radius:14px;padding:12px 22px;font-weight:600;cursor:pointer;margin-top:6px}.ai-form>.primary:disabled{opacity:.65;cursor:wait}
.ai-answers{display:grid;gap:12px;margin-top:14px}
.ai-answer{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#fbfcfe}.ai-answer h4{margin:0 0 8px;font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
.ai-answer-body p{margin:0 0 10px}.ai-answer-body ul{margin:0 0 10px;padding-inline-start:20px}.ai-answer-body li{margin:3px 0}
.ai-cite{display:inline;border:0;background:var(--soft);color:var(--blue2);border-radius:6px;padding:0 5px;font-size:.88em;font-weight:500;cursor:pointer;unicode-bidi:plaintext}
.ai-page{margin-top:16px;border:1px solid var(--accent);border-radius:14px;background:#fff;padding:12px 14px}.ai-page[hidden]{display:none}
.ai-page-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}.ai-page-head b{overflow-wrap:anywhere}
/* File names and document text keep their own direction inside right-to-left pages */
.ai-docs b,.ai-hit b,.ai-hit span,.ai-page-head b,.ai-answer-body,.cmp-label span,.cmp-list li,.share-name,.share-manage .share-name b,.ext-table tbody td:first-child{unicode-bidi:plaintext}
.ai-page-text{white-space:pre-wrap;font-size:13px;line-height:1.6;max-height:420px;overflow:auto;overflow-wrap:anywhere;unicode-bidi:plaintext}

@media(max-width:740px){
  .ext-card{padding:16px;border-radius:18px}
  .bm-row{grid-template-columns:minmax(0,1fr) auto;margin-inline-start:calc(var(--lvl,0) * 12px)}.bm-level{grid-column:1/-1}.bm-actions{grid-column:1/-1;justify-content:flex-end}
  .cmp-panes{gap:6px}.cmp-scroll{padding:6px;max-height:65vh}
  .share-head{position:static}.share-tools{align-items:flex-start}
  .copy-row{flex-direction:column}
}

/* Key points: a section's substance as scannable bullets, each opening with the term it explains.
   Logical properties keep the marker on the correct side in the Arabic and Urdu builds. */
.key-points{list-style:none;margin:15px 0 0;padding:0;display:grid;gap:14px}
.key-points>li{position:relative;padding-inline-start:27px}
.key-points>li::before{content:'';position:absolute;inset-inline-start:9px;top:.7em;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.key-points>li>b:first-child{color:var(--ink);font-weight:600}
.prose p+.key-points{margin-top:14px}
.prose .key-points+h2,.prose .key-points+h3{margin-top:30px}
@media(max-width:740px){.key-points{gap:13px}.key-points>li{padding-inline-start:23px}.key-points>li::before{inset-inline-start:6px}}
/* =========================================================
   BLOG
   One column, so the badge, title, headings, bullets and cards share a left edge.
   A post reads as a quick answer first, then short sections that each open with a
   direct answer in bold and follow with bullets.
   ========================================================= */
.blog-col{max-width:880px}
.blog-hero{padding-bottom:22px}
.blog-hero h1{font-size:clamp(30px,4.4vw,44px);line-height:1.12;letter-spacing:-.03em;margin:14px 0 10px}
.blog-hero>.container>p{max-width:760px;margin:0}
.blog-hero p.post-meta{font-size:13px;margin-top:10px}
.post-meta{color:var(--muted);font-size:13px}
.blog-post{padding:30px 32px}
.blog-post>section+section{margin-top:30px}
.blog-post h2{font-size:22px;line-height:1.3;letter-spacing:-.01em;margin:0 0 8px}
.blog-post p{margin:0}
.blog-post .blog-answer{color:var(--ink);font-weight:500;line-height:1.6}
.blog-post .lead-list{margin:12px 0 0;padding-inline-start:20px;display:grid;gap:8px}
.blog-post .lead-list li{color:#44536d;line-height:1.6;padding-inline-start:2px}
.blog-post .lead-list li::marker{color:var(--blue)}
.blog-post .lead-list strong{color:var(--ink);font-weight:600}
.blog-post a{color:var(--blue2);font-weight:600;text-decoration:none}
.blog-post a:hover{text-decoration:underline;text-underline-offset:2px}
.quick-answer{background:var(--soft2);border-inline-start:3px solid var(--blue);border-radius:0 14px 14px 0;padding:16px 20px}
[dir=rtl] .quick-answer{border-radius:14px 0 0 14px}
.quick-answer h2{font-size:17px;margin:0}
.quick-answer .lead-list{margin-top:10px}
.quick-answer .lead-list li{color:var(--ink)}
.blog-post #tools>p{color:var(--muted)}
.post-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.blog-post a.post-tool{display:flex;align-items:center;gap:12px;min-width:0;border:1px solid var(--line);border-radius:16px;background:#fff;padding:12px 14px;color:var(--ink);font-weight:400;text-decoration:none;transition:.2s}
.blog-post a.post-tool:hover{border-color:var(--accent);box-shadow:var(--shadow);text-decoration:none}
.post-tool .tool-icon{width:40px;height:40px;border-radius:12px}
.post-tool-copy{display:flex;flex-direction:column;min-width:0;flex:1}
.post-tool-copy b{font-size:14px;line-height:1.3;overflow-wrap:anywhere}
.post-tool-copy small{color:var(--muted);font-size:12px;margin-top:2px}
.post-tool-arrow{color:var(--blue);flex:0 0 auto}
[dir=rtl] .post-tool-arrow{transform:scaleX(-1)}
.post-faq details{background:#fff;border:1px solid var(--line);border-radius:14px;margin:0 0 8px;padding:0}
.post-faq summary{padding:13px 16px;font-weight:600;color:var(--ink)}
.post-faq details p{padding:0 16px 14px;color:#44536d;line-height:1.6}
.blog-post .post-note{font-size:13px;color:var(--muted);margin-top:28px;padding-top:16px;border-top:1px solid var(--line)}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.post-card{display:flex;flex-direction:column;gap:6px;min-width:0;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;color:var(--ink);transition:.2s}
.post-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--accent)}
.post-card h2,.post-card h3{font-size:17px;line-height:1.3;letter-spacing:-.01em;margin:2px 0 0;overflow-wrap:anywhere}
.post-card p{font-size:13px;color:var(--muted);margin:0;flex:1}
.post-card .text-link{margin-top:6px}
.post-card .post-meta{font-size:12px}
.post-meta>span,.post-meta>time{white-space:nowrap}
.post-more{margin-top:34px}
.post-more-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.post-more-head h2{font-size:24px;margin:0}
@media(max-width:980px){.post-tools,.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.post-tools,.post-grid{grid-template-columns:minmax(0,1fr)}.blog-post{padding:20px}.quick-answer{padding:14px 16px}.blog-post h2{font-size:20px}}

/* "Get the app": the install offer in the first footer column. The button carries its own colours
   because the footer is dark and .primary/.secondary are drawn for the light page behind it. */
/* "Powered by", a link inside the bottom line rather than one of the footer's stacked links. */
.footer .footer-powered{display:inline;margin:0;font-size:inherit;color:#dbe3ef;font-weight:600;text-decoration:underline;text-decoration-color:rgba(219,227,239,.35);text-underline-offset:3px}
.footer .footer-powered:hover{color:#fff;text-decoration-color:currentColor}
/* The bottom line in three parts, with "Powered by" in the true middle whatever the other two hold. */
.footer-bottom{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.footer-credit{text-align:center}
.footer-promise{text-align:end}
@media(max-width:740px){
  .footer-bottom{grid-template-columns:1fr;justify-items:center;gap:8px;text-align:center}
  .footer-promise{text-align:center}
}
.footer-install{margin-top:26px}
.footer-install p{margin:0}
.app-badges{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:15px}
/* Google's own badge artwork, shown at the height of ours; Google asks that it is not redrawn. */
.play-badge{display:inline-flex;border-radius:8px;flex:0 0 auto}
.play-badge img{display:block;width:auto;height:48px}
.play-badge:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.install-note{margin-top:10px!important;max-width:42ch;font-size:11px!important;color:#7f8ea6!important}

/* The card that offers the app to a first-time visitor: a window on a dimmed page on a computer,
   and on a phone a sheet at the bottom that leaves the page usable above it. */
.app-promo{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(10,20,40,.5);animation:app-promo-fade .25s ease}
.app-promo-card{position:relative;display:grid;grid-template-columns:260px 1fr;width:min(760px,100%);max-height:calc(100vh - 40px);overflow:auto;
  background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(10,25,55,.35);outline:0;animation:app-promo-rise .35s cubic-bezier(.2,.8,.2,1)}
.app-promo-x{position:absolute;top:12px;inset-inline-end:12px;z-index:1;width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--ink);cursor:pointer;box-shadow:0 2px 8px rgba(10,25,55,.12)}
.app-promo-x:hover{background:#fff}
.app-promo-x:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.app-promo-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.app-promo-art{display:grid;place-items:center;overflow:hidden;padding:34px 24px;border-start-start-radius:22px;border-end-start-radius:22px;
  background:radial-gradient(circle at 25% 15%,rgba(120,165,255,.75),transparent 55%),linear-gradient(160deg,#2563eb,#15307a)}
.app-promo-phone{width:150px;aspect-ratio:9/18.5;padding:9px;border-radius:28px;background:#0b1630;transform:rotate(-6deg);
  box-shadow:0 18px 40px rgba(5,15,40,.45),inset 0 0 0 2px rgba(255,255,255,.08)}
.app-promo-screen{height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:10px;padding:22px 11px;border-radius:20px;background:linear-gradient(#eaf1ff,#fff)}
.app-promo-tile{aspect-ratio:1;border-radius:9px;background:#d6e2fb}
.app-promo-tile:nth-child(3n+2){background:#e4ebfa}
.app-promo-me{grid-column:2;display:grid;justify-items:center;gap:5px;margin-top:4px;font-size:9px;color:var(--ink)}
.app-promo-me img{width:40px;height:40px;border-radius:10px;box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(37,99,235,.55);animation:app-promo-pulse 1.8s ease-in-out infinite}
.app-promo-body{display:grid;align-content:start;gap:14px;padding:34px 34px 28px}
.app-promo-eyebrow{justify-self:start;padding:5px 11px;border-radius:999px;background:var(--soft);color:var(--blue2);font-size:12px;font-weight:700;letter-spacing:.02em}
.app-promo-body h2{margin:0;padding-inline-end:28px;color:var(--ink);font-size:clamp(22px,3vw,28px);line-height:1.15}
.app-promo-lead{margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.app-promo-perks{display:grid;gap:12px;margin:2px 0 0;padding:0;list-style:none}
.app-promo-perks li{display:flex;align-items:flex-start;gap:12px;color:var(--muted);font-size:14px;line-height:1.45}
.app-promo-perks svg{flex:0 0 auto;width:34px;height:34px;padding:7px;border-radius:10px;background:var(--soft);
  fill:none;stroke:var(--blue);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.app-promo-perks b{display:block;color:var(--ink);font-size:14.5px}
.app-promo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:6px}
.app-promo-later{padding:6px 2px;border:0;background:none;color:var(--muted);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.app-promo-later:hover{color:var(--ink)}
.app-promo-note{margin:0;color:var(--muted);font-size:12.5px}
@keyframes app-promo-fade{from{opacity:0}}
@keyframes app-promo-rise{from{opacity:0;transform:translateY(24px) scale(.98)}}
@keyframes app-promo-pulse{50%{box-shadow:0 0 0 3px #fff,0 0 0 10px rgba(37,99,235,.22)}}
@media(max-width:700px){
  .app-promo{place-items:end stretch;padding:0;background:none;pointer-events:none}
  .app-promo-card{grid-template-columns:1fr;width:100%;max-height:85vh;border-radius:22px 22px 0 0;box-shadow:0 -12px 40px rgba(10,25,55,.28);pointer-events:auto}
  .app-promo-art{padding:16px;border-radius:22px 22px 0 0}
  .app-promo-phone{width:74px;border-radius:16px;padding:5px}
  .app-promo-screen{gap:5px;padding:10px 6px;border-radius:12px}
  .app-promo-tile{border-radius:5px}
  .app-promo-me{font-size:0;gap:0}
  .app-promo-me img{width:22px;height:22px;border-radius:6px}
  .app-promo-body{gap:12px;padding:18px 18px 22px}
  .app-promo-lead{font-size:14px}
}

/* Preview: a drawing of the page before the download, with draggable handles for anything the tool
   places on it. The handles are positioned with `left`/`top` rather than logical properties because
   they sit over a page image whose coordinates do not flip in a right-to-left language. */
.preview-panel{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px}
.preview-panel[hidden]{display:none}
.preview-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.preview-pager{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.preview-pager[hidden]{display:none}
.preview-pager button{padding:4px 11px;border-radius:9px;line-height:1.2}
.preview-stage{display:flex;justify-content:center;border-radius:14px;background:var(--soft2);min-height:60px}
/* Hugs the drawing so a handle's percentage position lines up with the page, not the panel. */
.preview-page{position:relative;line-height:0;max-width:100%}
.preview-page img{display:block;width:auto;height:auto;max-width:100%;max-height:min(68vh,600px);border-radius:14px}
.preview-note{margin:10px 0 0;font-size:12px;color:var(--muted)}
.preview-note.working{color:var(--blue2)}
.preview-note.ok{color:#15803d}
.preview-note.error{color:#b42318}
.preview-run{margin-top:12px}
.place-handle{position:absolute;transform:translateY(-100%);max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  border:1px solid var(--blue);background:rgba(37,99,235,.14);color:var(--blue2);border-radius:9px;
  padding:3px 8px;font-size:12px;font-weight:600;cursor:grab;touch-action:none;backdrop-filter:blur(2px)}
.place-handle.centre{transform:translate(-50%,-50%)}
.place-handle:hover{background:rgba(37,99,235,.22)}
.place-handle.dragging{cursor:grabbing;background:rgba(37,99,235,.3);box-shadow:0 4px 14px rgba(37,99,235,.3)}
.place-handle:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* Intensity: a slider reads as a strength in a way a number box does not. */
.field input[type="range"]{width:100%;accent-color:var(--blue);padding:0;background:transparent;border:0}
.range-value{display:inline-block;margin-top:4px;font-size:11px;font-weight:600;color:var(--blue2)}

/* Page editor. Objects are positioned as a share of the page so they hold their place on the sheet
   whatever size the drawing is shown at, and `left`/`top` stay physical rather than logical because
   a page's coordinates do not flip in a right-to-left language. */
.ed-root{display:grid;gap:14px;
  --ed-edge:#6ea8ea;--ed-ink:#24466f;--ed-icon:#2b78d4;--ed-on:#d9eafd;--ed-hover:#eff6ff;--ed-band:#e8eaee}
/* The tools and the page in view, as one grey band of joined buttons. */
.ed-bar{display:grid;justify-items:center;gap:12px;padding:14px 12px;background:var(--ed-band);border-radius:14px}
.ed-tools{display:flex;flex-wrap:wrap;justify-content:center;row-gap:6px}
.ed-tool{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;margin-inline-start:-1px;
  border:1px solid var(--ed-edge);border-radius:0;background:#fbfdff;color:var(--ed-ink);
  font-size:12.5px;font-weight:500;line-height:1;white-space:nowrap;cursor:pointer}
.ed-tool .ed-ico,.ed-tool .ed-svg{color:var(--ed-icon);flex:0 0 auto}
.ed-tool:hover{background:var(--ed-hover)}
.ed-tool.on{background:var(--ed-on)}
.ed-tool:hover,.ed-tool.on,.ed-tool:focus-visible{position:relative;z-index:1}
.ed-tool:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.ed-tool:disabled{opacity:.45;cursor:default;background:#fbfdff}
.ed-tool[hidden]{display:none}
/* Rounded only at the two ends of a run of joined buttons. */
.ed-tools>:first-child>.ed-tool:first-child,.ed-seg>.ed-tool:first-child{border-start-start-radius:4px;border-end-start-radius:4px}
.ed-tools>.ed-tool:last-child,.ed-tools>[data-ed-undo]:has(+[data-ed-redo][hidden]),.ed-seg>.ed-tool:last-child{border-start-end-radius:4px;border-end-end-radius:4px}
.ed-group-wrap{display:flex}
.ed-split{padding:0 7px}
.ed-svg{display:block;width:15px;height:15px}
.ed-svg svg{display:block}
.ed-pagebar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}
.ed-pageno{min-width:1.4em;font-size:20px;line-height:1;color:#5f9ee3;text-align:center}
.ed-seg{display:flex}
.ed-seg .ed-tool{padding:0 8px}
.ed-insert{margin-inline-start:0;border-radius:4px}
.ed-zoomlabel{font-size:12px;color:var(--muted)}
.ed-zoomlabel[hidden]{display:none}
@media (max-width:740px){
  .ed-tools{gap:5px}
  .ed-tool{margin-inline-start:0;border-radius:4px;padding:0 9px;font-size:12px}
  .ed-group-wrap>.ed-tool:has(+.ed-split){border-start-end-radius:0;border-end-end-radius:0}
  .ed-group-wrap>.ed-split{margin-inline-start:-1px;border-start-start-radius:0;border-end-start-radius:0}
  .ed-seg .ed-tool{border-radius:0;margin-inline-start:-1px}
}
/* What is in hand or selected: its settings, and taking things off the page. */
.ed-opts{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:10px 12px;background:var(--soft2);border:1px solid var(--line);border-radius:14px}
.ed-opts[hidden]{display:none}
.ed-styles{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ed-styles>[hidden]{display:none}
.ed-swatches{display:flex;gap:4px}
.ed-swatch{width:22px;height:22px;border-radius:7px;border:1px solid rgba(15,31,58,.25);cursor:pointer;padding:0}
.ed-swatch:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ed-num{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#42506b}
.ed-num input{width:72px;border:1px solid var(--line);border-radius:9px;padding:6px 8px;background:#fff}
.ed-check{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#42506b}
.ed-actions{display:flex;gap:8px;margin-inline-start:auto}
.ed-actions button{padding:8px 13px;border-radius:11px;font-size:13px}
.ed-stage{display:flex;justify-content:center;background:var(--soft2);border-radius:16px;padding:16px;min-height:120px}
.ed-stage.loading{opacity:.55}
.ed-page{position:relative;max-width:100%;width:min(100%,860px);background:#fff;box-shadow:0 8px 26px rgba(23,48,92,.13);line-height:0;touch-action:none}
.ed-page[data-tool="select"]{cursor:default}
.ed-page:not([data-tool="select"]){cursor:crosshair}
.ed-page[data-tool="retype"]{cursor:text}
.ed-img{display:block;width:100%;height:auto}
.ed-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.ed-pager{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.ed-pager button{padding:4px 11px;border-radius:9px;line-height:1.2}
.ed-hint{margin:0;font-size:12px;color:var(--muted)}

/* Objects drawn on the page. */
.ed-obj{position:absolute;box-sizing:border-box;line-height:1.35;cursor:move}
.ed-obj.selected{outline:1px dashed var(--blue);outline-offset:2px}
.ed-obj.editing{cursor:text;outline:2px solid var(--blue);background:rgba(255,255,255,.92)}
.ed-text{white-space:pre-wrap;word-break:break-word;font-family:Helvetica,Arial,sans-serif;overflow:visible}
/* A retyped paragraph: shown in the document's own fonts, spaced letter for letter as the saved file
   spaces it (no kerning, no ligatures), and with no patch of its own while typing, since the page's
   colour already sits behind it. */
.ed-text.ed-runs{font-kerning:none;font-variant-ligatures:none;font-feature-settings:"kern" 0,"liga" 0;hyphens:manual;overflow-wrap:break-word;word-break:normal}
.ed-obj.ed-text.ed-runs.editing{background:transparent;outline-offset:2px}
.ed-image img{width:100%;height:100%;object-fit:contain;display:block}
.ed-underline:after,.ed-strike:after{content:'';position:absolute;left:0;right:0;border-top:var(--ed-mark-w,1px) solid var(--ed-mark,#000)}
.ed-underline:after{bottom:0}
.ed-strike:after{top:50%}
.ed-link{border:1px dashed var(--blue);background:rgba(37,99,235,.08)}
.ed-line svg,.ed-arrow svg,.ed-draw svg{width:100%;height:100%;overflow:visible;display:block}
.ed-draw{pointer-events:none}
.ed-draw.selected{pointer-events:auto}
.ed-grip{position:absolute;right:-6px;bottom:-6px;width:12px;height:12px;border-radius:4px;background:var(--blue);border:2px solid #fff;cursor:nwse-resize}
/* The existing lines of text, offered for retyping. */
/* Retyping is where the editor starts, so the lines stay unmarked until the pointer is over one. */
.ed-span{position:absolute;padding:0;border:1px solid transparent;background:transparent;border-radius:3px;cursor:text}
.ed-span:hover{background:rgba(37,99,235,.12);border-color:var(--blue)}
.ed-span:focus-visible{outline:2px solid var(--blue);outline-offset:1px}

/* Toolbar glyphs, drawn with borders so the editor carries no extra sprite. */
.ed-ico{width:17px;height:17px;display:block;position:relative}
.ed-ico-select{border:1.6px solid currentColor;border-radius:0 3px 3px 3px;transform:rotate(-10deg);border-right-width:0;border-bottom-width:0;height:13px;width:11px}
.ed-ico-text:before{content:'T';font:700 15px/1 Helvetica,Arial,sans-serif;position:absolute;inset:0;display:grid;place-items:center}
.ed-ico-retype:before{content:'T';font:700 13px/1 Helvetica,Arial,sans-serif;position:absolute;inset:0;display:grid;place-items:center}
.ed-ico-retype:after{content:'';position:absolute;left:1px;right:1px;bottom:0;border-top:2px solid currentColor}
.ed-ico-highlight{background:currentColor;opacity:.35;height:9px;margin-top:4px;border-radius:2px}
.ed-ico-underline:before{content:'A';font:600 11px/1 Helvetica,Arial,sans-serif;position:absolute;top:1px;left:0;right:0;text-align:center}
.ed-ico-underline:after{content:'';position:absolute;left:2px;right:2px;bottom:1px;border-top:2px solid currentColor}
.ed-ico-strike:before{content:'A';font:600 11px/1 Helvetica,Arial,sans-serif;position:absolute;top:2px;left:0;right:0;text-align:center}
.ed-ico-strike:after{content:'';position:absolute;left:1px;right:1px;top:50%;border-top:2px solid currentColor}
.ed-ico-whiteout{border:1.6px solid currentColor;background:repeating-linear-gradient(45deg,transparent,transparent 3px,currentColor 3px,currentColor 4px);border-radius:3px}
.ed-ico-rect{border:1.8px solid currentColor;border-radius:3px}
.ed-ico-ellipse{border:1.8px solid currentColor;border-radius:50%}
.ed-ico-line:before{content:'';position:absolute;left:0;right:0;top:50%;border-top:1.8px solid currentColor;transform:rotate(-35deg)}
.ed-ico-arrow:before{content:'';position:absolute;left:0;right:0;top:50%;border-top:1.8px solid currentColor;transform:rotate(-35deg)}
.ed-ico-arrow:after{content:'';position:absolute;right:1px;top:3px;width:6px;height:6px;border-top:1.8px solid currentColor;border-right:1.8px solid currentColor;transform:rotate(10deg)}
.ed-ico-draw:before{content:'';position:absolute;inset:2px;border-bottom:1.8px solid currentColor;border-right:1.8px solid currentColor;border-radius:0 0 60% 0;transform:rotate(-20deg)}
.ed-ico-image{border:1.6px solid currentColor;border-radius:3px}
.ed-ico-image:after{content:'';position:absolute;left:2px;right:2px;bottom:2px;border-bottom:1.6px solid currentColor;border-radius:50%;height:5px}
.ed-ico-link:before,.ed-ico-link:after{content:'';position:absolute;top:5px;width:9px;height:7px;border:1.6px solid currentColor;border-radius:4px}
.ed-ico-link:before{left:0;border-right-color:transparent}
.ed-ico-link:after{right:0;border-left-color:transparent}

@media(max-width:740px){
  .ed-bar{gap:10px;padding:10px}
  .ed-actions{margin-inline-start:0;width:100%}
  .ed-stage{padding:8px}
}
.ed-url{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#42506b}
.ed-url input{width:190px;border:1px solid var(--line);border-radius:9px;padding:6px 8px;background:#fff;font-weight:400}

/* Form fields, stamps and the document-wide strip. */
.ed-prop{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#42506b}
.ed-prop input{width:130px;border:1px solid var(--line);border-radius:9px;padding:6px 8px;background:#fff;font-weight:400}
.ed-doc{display:flex;flex-wrap:wrap;gap:18px;padding:12px;background:var(--soft2);border:1px solid var(--line);border-radius:16px}
.ed-doc-group{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;color:#42506b}
.ed-doc-group>b{font-size:12px}
.ed-files{display:flex;flex-wrap:wrap;gap:6px}
.ed-file{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:9px;padding:4px 8px;font-size:11px;font-weight:500}
.ed-file button{border:0;background:transparent;cursor:pointer;font-size:14px;line-height:1;color:#7a8699;padding:0}
.ed-file button:hover{color:#b42318}

.ed-stamp{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:2px solid currentColor;border-radius:7px;overflow:hidden;text-align:center;font-size:9px;line-height:1.25;padding:3px}
.ed-stamp-word{font-size:15px;font-weight:700;letter-spacing:.02em;line-height:1.1}

.ed-obj[data-shape]{display:flex;align-items:center;gap:5px;border:1px solid #8b96ab;background:rgba(246,248,252,.92);border-radius:4px;padding:0 5px;font-size:10px;color:#42506b;overflow:hidden}
.ed-obj[data-shape="checkbox"]{justify-content:center;padding:0;border-radius:3px}
.ed-obj[data-shape="radio"]{justify-content:center;padding:0;border-radius:50%}
.ed-obj[data-shape="multiline"]{align-items:flex-start;padding-top:3px}
.ed-obj[data-shape="signature"]{align-items:flex-end;padding-bottom:3px;border-bottom:2px solid #8b96ab}
.ed-obj[data-shape="dropdown"]{justify-content:space-between;flex-direction:row-reverse}
.ed-field-mark{flex:0 0 auto;font-size:10px;color:#5b6a85}
.ed-field-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Glyphs for the stamp and the form fields, drawn the same way as the rest of the toolbar. */
.ed-ico-stamp{border:1.6px solid currentColor;border-radius:3px;height:12px;margin-top:3px}
.ed-ico-stamp:before{content:'';position:absolute;left:3px;right:3px;top:-3px;border-top:1.6px solid currentColor;border-radius:2px}
.ed-ico-field-text{border:1.5px solid currentColor;border-radius:3px;height:11px;margin-top:3px}
.ed-ico-field-text:before{content:'';position:absolute;left:2px;top:3px;bottom:3px;border-left:1.5px solid currentColor}
.ed-ico-field-multiline{border:1.5px solid currentColor;border-radius:3px}
.ed-ico-field-multiline:before{content:'';position:absolute;left:3px;right:5px;top:4px;border-top:1.3px solid currentColor;box-shadow:0 4px 0 -0.2px currentColor}
.ed-ico-field-checkbox{border:1.6px solid currentColor;border-radius:3px;width:14px;height:14px;margin:2px auto}
.ed-ico-field-checkbox:before{content:'✓';position:absolute;inset:0;display:grid;place-items:center;font-size:10px;line-height:1}
.ed-ico-field-radio{border:1.6px solid currentColor;border-radius:50%;width:14px;height:14px;margin:2px auto}
.ed-ico-field-radio:before{content:'';position:absolute;inset:3px;border-radius:50%;background:currentColor}
.ed-ico-field-dropdown{border:1.5px solid currentColor;border-radius:3px;height:11px;margin-top:3px}
.ed-ico-field-dropdown:before{content:'▾';position:absolute;right:1px;top:-2px;font-size:9px;line-height:1}
.ed-ico-field-signature:before{content:'';position:absolute;left:1px;right:1px;top:3px;height:7px;border-bottom:1.6px solid currentColor;border-radius:0 0 70% 30%;transform:rotate(-6deg)}
.ed-ico-field-signature:after{content:'';position:absolute;left:0;right:0;bottom:1px;border-top:1.6px solid currentColor}

/* The toolbar reads as named buttons rather than bare pictures, with related tools on a menu. */
.ed-group-wrap{position:relative}
.ed-tool-label{line-height:1}
.ed-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.7;margin-inline-start:1px}
.ed-menu{display:none;position:absolute;inset-inline-start:0;top:calc(100% + 6px);z-index:60;min-width:200px;
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:var(--shadow)}
.ed-group-wrap.open .ed-menu{display:block}
.ed-menu-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;border-radius:10px;
  padding:8px 10px;font-size:13px;font-weight:500;color:#2a3a55;cursor:pointer;text-align:start}
.ed-menu-item:hover{background:var(--soft2)}
.ed-menu-item.on{background:var(--soft);color:var(--blue2);font-weight:600}
.ed-menu-item:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}

/* The button that finishes the job, under the pages the work was done on. */
.ed-apply{display:inline-flex;align-items:center;gap:8px;margin-inline-start:auto;padding:11px 20px;border-radius:13px;font-size:14px}
.ed-apply-arrow{font-size:17px;line-height:1}

/* Signatures: the menu of saved ones, and the window for making another. */
.ed-sign-menu{min-width:230px}
.ed-sign-row{display:flex;align-items:center;gap:6px}
.ed-sign-pick{flex:1;min-width:0;border:1px solid transparent;background:transparent;border-radius:10px;padding:6px;cursor:pointer}
.ed-sign-pick:hover{background:var(--soft2);border-color:var(--line)}
.ed-sign-pick img{display:block;max-width:100%;max-height:44px;margin:auto}
.ed-sign-drop{border:0;background:transparent;color:#7a8699;font-size:16px;line-height:1;cursor:pointer;padding:4px 6px}
.ed-sign-drop:hover{color:#b42318}
.ed-sign-empty{margin:6px 8px;font-size:12px;color:var(--muted)}
.ed-sign-new{width:100%;margin-top:6px;padding:9px;border-radius:10px;font-size:13px}

.ed-modal{position:fixed;inset:0;z-index:120;background:rgba(15,31,58,.45);display:grid;place-items:center;padding:18px;overflow:auto}
.ed-modal-card{width:min(760px,100%);background:#fff;border-radius:20px;box-shadow:0 24px 60px rgba(15,31,58,.3);overflow:hidden}
.ed-modal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.ed-modal-x{border:0;background:transparent;font-size:22px;line-height:1;color:#7a8699;cursor:pointer;padding:0 4px}
.ed-modal-x:hover{color:var(--ink)}
.ed-modal-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 18px;border-top:1px solid var(--line);background:var(--soft2)}
.ed-modal-foot .primary{margin-inline-start:auto;padding:11px 26px}
.ed-sign-note{margin:0;flex:1 1 220px;min-width:0}
.ed-sign-tabs{display:flex;gap:4px;padding:12px 18px 0;flex-wrap:wrap}
.ed-sign-tab{border:1px solid transparent;background:transparent;border-radius:10px 10px 0 0;padding:9px 14px;font-size:13px;font-weight:600;color:#5b6a85;cursor:pointer}
.ed-sign-tab:hover{background:var(--soft2)}
.ed-sign-tab.on{background:#fff;border-color:var(--line);border-bottom-color:#fff;color:var(--blue2)}
.ed-sign-body{padding:18px;min-height:240px}
.ed-sign-pane{display:grid;gap:14px;justify-items:center}
.ed-sign-input{width:min(420px,100%);border:1px solid var(--line);border-radius:12px;padding:11px 13px;font-size:15px;text-align:center}
.ed-sign-faces{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.ed-sign-face{display:grid;place-items:center;min-height:62px;padding:6px;border:1px solid var(--line);background:#fff;border-radius:12px;cursor:pointer}
.ed-sign-face:hover{border-color:var(--blue)}
.ed-sign-face.on{border-color:var(--blue);background:var(--soft);box-shadow:0 0 0 2px rgba(37,99,235,.14)}
.ed-sign-face img{max-width:100%;max-height:48px}
.ed-sign-canvas{width:100%;max-width:640px;height:auto;aspect-ratio:3/1;border:1px dashed #b9c4d6;border-radius:14px;background:#fbfcfe;touch-action:none;cursor:crosshair}
.ed-sign-row-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ed-sign-shot img{max-width:100%;max-height:200px;border-radius:12px}
.ed-sign-video{width:100%;max-width:520px;border-radius:14px;background:#0f1f3a}

@media(max-width:740px){
  .ed-sign-faces{grid-template-columns:repeat(2,1fr)}
  .ed-apply{width:100%;margin-inline-start:0;justify-content:center}
}

/* Group buttons reuse the glyph of the tool they stand for. */
.ed-ico-links{border:1.6px solid currentColor;border-radius:4px;width:15px;height:9px;margin-top:4px}
.ed-ico-links:before{content:'';position:absolute;left:3px;right:3px;top:3px;border-top:1.6px solid currentColor}
.ed-ico-images{border:1.6px solid currentColor;border-radius:3px}
.ed-ico-images:after{content:'';position:absolute;left:2px;right:2px;bottom:2px;border-bottom:1.6px solid currentColor;border-radius:50%;height:5px}
.ed-ico-forms{border:1.5px solid currentColor;border-radius:3px}
.ed-ico-forms:before{content:'';position:absolute;left:3px;right:6px;top:4px;border-top:1.3px solid currentColor;box-shadow:0 4px 0 -0.2px currentColor}
.ed-ico-sign:before{content:'';position:absolute;left:1px;right:1px;top:2px;height:8px;border-bottom:1.7px solid currentColor;border-radius:0 0 70% 30%;transform:rotate(-8deg)}
.ed-ico-sign:after{content:'';position:absolute;left:0;right:0;bottom:1px;border-top:1.6px solid currentColor}
.ed-ico-annotate{background:currentColor;opacity:.35;height:9px;margin-top:4px;border-radius:2px}
.ed-ico-shapes{border:1.8px solid currentColor;border-radius:3px;width:12px;height:12px;margin:2px 0 0 0}
.ed-ico-shapes:after{content:'';position:absolute;right:-4px;bottom:-4px;width:9px;height:9px;border:1.6px solid currentColor;border-radius:50%;background:#fff}

/* Page picker extras: odd / even / invert and a typed page list, as Sejda offers on every page tool */
.picker-extras{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin:-2px 0 12px}
.picker-quick{display:flex;flex-wrap:wrap;gap:6px}
.picker-quick .secondary{padding:7px 12px;border-radius:10px;font-size:12px}
.picker-range{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);flex:1 1 220px;min-width:0}
.picker-range input{flex:1 1 auto;min-width:0;padding:7px 10px;border:1px solid var(--line);border-radius:10px;font:inherit;color:inherit;background:#fff}
@media(max-width:560px){.picker-range{flex-basis:100%}}

/* Per-file settings in the file list (merge, alternate & mix) and the sort menu above it */
.file-sort{display:flex;justify-content:flex-end;margin:0 0 8px}
.file-sort label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.file-sort select{padding:6px 8px;border:1px solid var(--line);border-radius:10px;font:inherit;color:inherit;background:#fff;max-width:100%}
.file-row{flex-wrap:wrap}
.file-opts{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:8px;font-size:12px;color:var(--muted)}
.file-opts label{display:flex;align-items:center;gap:6px;min-width:0}
.file-opts input[type="text"]{width:150px;max-width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:9px;font:inherit;color:inherit;background:#fff}
.file-opts input[type="number"]{width:64px;padding:6px 8px;border:1px solid var(--line);border-radius:9px;font:inherit;color:inherit;background:#fff}

/* Crop box drawn over the preview: everything outside it is dimmed, edges and corners can be dragged */
/* only while a crop box is shown, so other tools' placement handles near an edge are never clipped */
.preview-page:has(.crop-box){overflow:hidden}
.crop-box{position:absolute;box-sizing:border-box;border:2px solid #2563eb;box-shadow:0 0 0 100vmax rgba(15,23,42,.42);cursor:move;touch-action:none;z-index:2}
.crop-box:focus-visible{outline:3px solid #93c5fd;outline-offset:2px}
.crop-grip{position:absolute;width:14px;height:14px;background:#fff;border:2px solid #2563eb;border-radius:3px;box-sizing:border-box}
.crop-n,.crop-s{left:50%;margin-left:-7px;cursor:ns-resize}.crop-n{top:-8px}.crop-s{bottom:-8px}
.crop-e,.crop-w{top:50%;margin-top:-7px;cursor:ew-resize}.crop-e{right:-8px}.crop-w{left:-8px}
.crop-nw{top:-8px;left:-8px;cursor:nwse-resize}.crop-se{bottom:-8px;right:-8px;cursor:nwse-resize}
.crop-ne{top:-8px;right:-8px;cursor:nesw-resize}.crop-sw{bottom:-8px;left:-8px;cursor:nesw-resize}
@media(pointer:coarse){.crop-grip{width:22px;height:22px}.crop-n,.crop-s{margin-left:-11px}.crop-e,.crop-w{margin-top:-11px}}

/* Six header and footer boxes: three across on wide screens, one column on phones */
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
@media(max-width:560px){.grid-3{grid-template-columns:1fr}}

/* Checkbox groups (annotation kinds, permissions): two columns, one on phones */
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;font-size:13px}
@media(max-width:560px){.check-grid{grid-template-columns:1fr}}
/* Custom metadata rows */
.meta-custom{display:grid;gap:6px;margin-bottom:8px}
.meta-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;gap:6px;align-items:center}
.meta-row input{min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:10px;font:inherit;color:inherit;background:#fff}
/* Rotate one page at a time: turn buttons on each tile, the label turned to show the result */
.page-tile{position:relative}
.tile-turn{display:none;position:absolute;left:4px;right:4px;bottom:4px;justify-content:space-between}
.rotate-each .tile-turn{display:flex}
.tile-turn button{width:28px;height:28px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--blue);font-size:16px;line-height:1;cursor:pointer}
.page-tile.turned:before{transform:rotate(var(--turn,0deg));transition:transform .15s}
.page-tile.turned{overflow:hidden}
[dir="rtl"] .page-tile.turned:before{transform:scaleX(-1) rotate(var(--turn,0deg))}
.page-tile.turned{outline:2px solid var(--blue);outline-offset:-2px}

/* Deskew, manual mode: the angle for the page on the preview, nudged in small steps. */
.deskew-ctl{display:grid;gap:8px;margin-top:8px}
.deskew-page{font-size:12px;font-weight:600;color:var(--muted)}
.deskew-angle{display:flex;align-items:center;gap:6px;font-weight:600}
.deskew-angle input{flex:1;min-width:0;text-align:center;border:1px solid var(--line);border-radius:11px;padding:9px;background:#fbfcfe;font-size:15px}
.deskew-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.deskew-steps button{padding:7px 0;font-size:12px;border-radius:10px;white-space:nowrap}
.deskew-reset{justify-self:start;font-size:12px;padding:6px 10px}

/* Split in half: the cut, dragged across the page drawing. A wide invisible strip makes it easy to grab. */
.split-line{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed var(--blue);cursor:ew-resize;z-index:3;touch-action:none}
.split-line:before{content:'';position:absolute;top:0;bottom:0;left:-12px;width:24px}
.split-line:after{content:'';position:absolute;top:50%;left:-8px;width:14px;height:30px;margin-top:-15px;border-radius:7px;background:var(--blue);box-shadow:0 2px 8px rgba(15,23,42,.3)}
.split-line.across{left:0;right:0;bottom:auto;width:auto;height:0;border-left:0;border-top:2px dashed var(--blue);cursor:ns-resize}
.split-line.across:before{left:0;right:0;top:-12px;bottom:auto;width:auto;height:24px}
.split-line.across:after{top:-8px;left:50%;width:30px;height:14px;margin:0 0 0 -15px}
.split-line:focus-visible{outline:2px solid var(--blue);outline-offset:4px}

/* Tick boxes in the settings panel sit beside their label. `.field input` makes inputs full width,
   which pushed the box and its text into separate columns. */
.ed-check.field{align-items:flex-start;gap:9px;font-size:13px;font-weight:500;line-height:1.45;cursor:pointer}
.ed-check.field input[type="checkbox"]{width:16px;height:16px;flex:0 0 auto;margin:2px 0 0;padding:0;accent-color:var(--blue)}

/* Organize: actions on the selected pages, above the grid. */
.org-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
.org-tools>button,.org-file{padding:7px 11px;font-size:12px;border-radius:10px;line-height:1.3}
.org-tools>button[data-org^=rot]{font-size:15px;padding:5px 10px}
.org-file{display:inline-flex;align-items:center;font-weight:600;cursor:pointer}
.org-file:focus-within{outline:2px solid var(--blue);outline-offset:2px}
.org-move{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600}
.org-move input{width:64px;border:1px solid var(--line);border-radius:10px;padding:6px 8px;background:#fbfcfe}
.org-move button{padding:7px 11px;font-size:12px;border-radius:10px}
.page-tile.blank:before{background:none}
.page-tile span{overflow-wrap:anywhere}
/* Once a grid holds pages from more than one file, each page carries a dot in its file's colour. */
.page-grid:has(.page-tile:not([data-src="0"])) .page-tile::after{content:'';position:absolute;top:7px;inset-inline-end:7px;width:9px;height:9px;border-radius:50%;
  background:var(--src,#2563eb);box-shadow:0 0 0 2px #fff}
.page-tile[data-src="1"]{--src:#16a34a}
.page-tile[data-src="2"]{--src:#d97706}
.page-tile[data-src="3"]{--src:#9333ea}
.page-tile[data-src="4"]{--src:#dc2626}
.page-tile[data-src="5"]{--src:#0891b2}
.page-tile[data-src="6"]{--src:#db2777}
.page-tile[data-src="7"]{--src:#4d7c0f}

/* Areas of the page whose text is read: split by text, and rename's [TEXT1], [TEXT2]... */
.area-box{position:absolute;box-sizing:border-box;border:2px solid #d97706;background:rgba(245,158,11,.14);cursor:move;touch-action:none;z-index:2}
.area-box:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.area-tag{position:absolute;left:-2px;bottom:100%;display:inline-flex;align-items:center;gap:4px;background:#d97706;color:#fff;font-size:10px;font-weight:700;line-height:18px;padding:0 6px;border-radius:6px 6px 0 0;white-space:nowrap}
.area-x{border:0;background:transparent;color:#fff;font-size:14px;line-height:18px;padding:0 0 0 2px;cursor:pointer}
.area-add{margin-top:8px;font-size:13px;padding:9px 14px}

/* Bookmarks: find text, or click a line on the page, to make a bookmark; drag rows to move them. */
.bm-pick{display:grid;gap:8px;margin:12px 0 16px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--soft2)}
.bm-search-label{font-size:12px;font-weight:600}
.bm-search{width:100%;border:1px solid var(--line);border-radius:11px;padding:10px;background:#fff}
.bm-hits{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:220px;overflow:auto}
.bm-hit{display:flex;justify-content:space-between;gap:10px;width:100%;text-align:start;border:1px solid var(--line);background:#fff;border-radius:9px;padding:7px 10px;font-size:12.5px;cursor:pointer}
.bm-hit:hover{border-color:var(--blue)}
.bm-hit span{min-width:0;overflow-wrap:anywhere}
.bm-hit small{flex:0 0 auto;color:var(--muted)}
.bm-view summary{cursor:pointer;font-weight:600;font-size:13px}
.bm-view-nav{display:flex;align-items:center;gap:8px;margin:6px 0}
.bm-view-nav button{padding:4px 12px}
.bm-view-label{font-size:12px;color:var(--muted)}
.bm-view-stage{min-height:80px}
.bm-view-stage.loading{opacity:.5}
.bm-view-page{position:relative;line-height:0;max-width:100%;display:inline-block}
.bm-view-page img{display:block;max-width:100%;width:auto;height:auto;max-height:min(70vh,620px);border-radius:10px;border:1px solid var(--line)}
.bm-line{position:absolute;border:0;padding:0;background:transparent;border-radius:3px;cursor:pointer}
.bm-line:hover,.bm-line:focus-visible{background:rgba(37,99,235,.18);outline:1px solid var(--blue)}
.bm-grip{cursor:grab;color:var(--muted);font-size:14px;padding:0 4px;user-select:none}
.bm-row.bm-drop{box-shadow:0 -2px 0 var(--blue)}
/* The drag handle takes the row's first column. */
.bm-row{grid-template-columns:auto auto minmax(0,1fr) auto auto}
@media(max-width:740px){
  .bm-row{grid-template-columns:auto minmax(0,1fr) auto}
  .bm-grip{grid-column:1}.bm-level{grid-column:2/-1}
  .bm-title{grid-column:1/3}.bm-page{grid-column:3}
  .bm-actions{grid-column:1/-1;flex-wrap:wrap}
}

/* Editor: undo and redo, zoom, existing annotations, pictures already in the file, a blank start. */
.ed-actions button:disabled{opacity:.45;cursor:default}
.ed-annots{font-size:12px}
/* The text box's own bar, on the page just above it. */
.ed-float{position:absolute;z-index:30;display:flex;flex-wrap:wrap;max-width:100%;line-height:normal;background:#fff;
  border:1px solid var(--ed-edge);border-radius:4px;box-shadow:0 4px 14px rgba(23,48,92,.16);cursor:default}
.ed-float[hidden]{display:none}
.ed-fwrap{display:flex}
.ed-fbtn{display:inline-flex;align-items:center;justify-content:center;gap:3px;min-width:30px;height:28px;padding:0 7px;
  border:0;border-inline-end:1px solid #d3e3f6;background:transparent;color:var(--ed-ink);font:500 13px/1 Helvetica,Arial,sans-serif;cursor:pointer}
.ed-float>:last-child,.ed-float>:last-child>.ed-fbtn{border-inline-end:0}
.ed-fbtn .ed-svg{color:var(--ed-icon)}
.ed-fbtn:hover{background:var(--ed-hover)}
.ed-fbtn.on{background:var(--ed-on)}
.ed-fbtn:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.ed-fbtn b{font-weight:700}
.ed-fmove{cursor:move;touch-action:none}
.ed-faa{font-size:12px}
.ed-fmenu{min-width:160px;max-height:280px;overflow:auto}
.ed-fsize{width:100%;box-sizing:border-box;margin-bottom:4px;border:1px solid var(--line);border-radius:8px;padding:6px 8px}
.ed-fcolours{display:flex;flex-wrap:wrap;gap:6px;width:176px;padding:4px}
.ed-menu-item[hidden]{display:none}
.ed-stage.zoomed{justify-content:flex-start;overflow:auto;max-height:80vh}
.ed-stage.zoomed .ed-page{max-width:none;flex:0 0 auto}
.ed-pimg{position:absolute;padding:0;border:2px dashed #dc2626;background:rgba(220,38,38,.06);border-radius:3px;cursor:pointer}
.ed-pimg:hover,.ed-pimg:focus-visible{background:rgba(220,38,38,.2)}
.ed-imgdel{background:repeating-linear-gradient(45deg,rgba(220,38,38,.16) 0 6px,rgba(255,255,255,.7) 6px 12px);outline:2px solid #dc2626;outline-offset:-2px}
.ed-imgdel-label{position:absolute;left:4px;top:4px;background:#dc2626;color:#fff;font-size:11px;font-weight:600;line-height:1.3;padding:2px 6px;border-radius:5px}
.ed-ico-freehl{background:currentColor;opacity:.4;height:6px;margin-top:6px;border-radius:4px;transform:rotate(-18deg)}
.ed-ico-imgedit{border:1.6px dashed currentColor;border-radius:3px}
.ed-ico-imgedit:after{content:'\00d7';position:absolute;inset:0;display:grid;place-items:center;font-size:13px;font-weight:700;line-height:1}
.ed-url{flex-wrap:wrap}
.ed-prop select{border:1px solid var(--line);border-radius:9px;padding:6px 8px;background:#fff;font-weight:400;max-width:210px}
.ed-url input{min-width:0}
.ed-url input[data-ed-linkpage]{width:84px}
.ed-blank{margin-top:10px}
.ed-blank-row{display:flex;flex-wrap:wrap;gap:6px}
.ed-blank-row button{padding:8px 12px;font-size:12.5px}

/* Editor text faces, drawn with the same fonts the server embeds. Loaded only when used. */
@font-face{font-family:"VD Roboto";src:url(fonts/ed-roboto-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Roboto";src:url(fonts/ed-roboto-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Roboto";src:url(fonts/ed-roboto-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Roboto";src:url(fonts/ed-roboto-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Open Sans";src:url(fonts/ed-opensans-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Open Sans";src:url(fonts/ed-opensans-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Open Sans";src:url(fonts/ed-opensans-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Open Sans";src:url(fonts/ed-opensans-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Lato";src:url(fonts/ed-lato-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Lato";src:url(fonts/ed-lato-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Lato";src:url(fonts/ed-lato-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Lato";src:url(fonts/ed-lato-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Montserrat";src:url(fonts/ed-montserrat-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Montserrat";src:url(fonts/ed-montserrat-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Montserrat";src:url(fonts/ed-montserrat-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Montserrat";src:url(fonts/ed-montserrat-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Poppins";src:url(fonts/ed-poppins-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Poppins";src:url(fonts/ed-poppins-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Poppins";src:url(fonts/ed-poppins-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Poppins";src:url(fonts/ed-poppins-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Merriweather";src:url(fonts/ed-merriweather-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Merriweather";src:url(fonts/ed-merriweather-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Merriweather";src:url(fonts/ed-merriweather-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Merriweather";src:url(fonts/ed-merriweather-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD EB Garamond";src:url(fonts/ed-ebgaramond-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD EB Garamond";src:url(fonts/ed-ebgaramond-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD EB Garamond";src:url(fonts/ed-ebgaramond-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD EB Garamond";src:url(fonts/ed-ebgaramond-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"VD Playfair Display";src:url(fonts/ed-playfairdisplay-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VD Playfair Display";src:url(fonts/ed-playfairdisplay-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"VD Playfair Display";src:url(fonts/ed-playfairdisplay-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"VD Playfair Display";src:url(fonts/ed-playfairdisplay-700i.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
.ed-colorpick{width:30px;height:26px;padding:0;border:1px solid var(--line);border-radius:7px;background:#fff;cursor:pointer}
.ed-hex{width:78px;border:1px solid var(--line);border-radius:8px;padding:5px 7px;font:12px ui-monospace,Consolas,monospace;background:#fff}
.ed-dropper{display:grid;place-items:center;width:30px;height:28px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#42506b;cursor:pointer;padding:0}
.ed-dropper:hover{border-color:var(--blue);color:var(--blue)}
.ed-page.picking,.ed-page.picking *{cursor:crosshair!important}
.ed-swatches{flex-wrap:wrap;align-items:center}

/* Editor forms: filling fields already in the file, and the two form actions' icons. */
.ed-wfill{position:absolute;display:flex;align-items:stretch;z-index:3}
.ed-wfill input[type=text],.ed-wfill textarea,.ed-wfill select{width:100%;height:100%;box-sizing:border-box;border:1.5px solid #2563eb;border-radius:3px;background:rgba(239,246,255,.92);padding:0 4px;line-height:1.2;font-family:Helvetica,Arial,sans-serif;resize:none}
.ed-wfill input[type=checkbox],.ed-wfill input[type=radio]{width:100%;height:100%;margin:0;accent-color:#2563eb;cursor:pointer}
.ed-ico-field-fill{border:1.5px solid currentColor;border-radius:3px;height:11px;margin-top:3px}
.ed-ico-field-fill:after{content:'';position:absolute;left:3px;top:4px;width:6px;height:1.5px;background:currentColor}
.ed-ico-field-detect{border:1.5px dashed currentColor;border-radius:3px}
.ed-ico-field-detect:after{content:'';position:absolute;right:-2px;bottom:-2px;width:6px;height:6px;border:1.5px solid currentColor;border-radius:50%;background:var(--paper,#fff)}
.ed-taborder{border:1px solid var(--line);border-radius:9px;padding:6px 8px;background:#fff;font-size:12px}
.ed-prop input[type=color]{width:34px;height:28px;padding:2px;cursor:pointer}
.ed-prop input[type=number]{width:76px}

/* Editor page strip: every page as a thumbnail, turned, removed, added to and dragged into order. */
.ed-strip{display:grid;gap:8px;margin:0 0 12px}
.ed-strip-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px}
.ed-strip-head b{margin-inline-end:auto}
.ed-strip-head .secondary{padding:6px 12px;font-size:12px;border-radius:10px}
.ed-strip-pages{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x proximity}
.ed-thumb{position:relative;flex:0 0 auto;width:92px;display:grid;gap:4px;justify-items:center;padding:6px;border:2px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;scroll-snap-align:start}
.ed-thumb.on{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.ed-thumb.drop{box-shadow:-4px 0 0 var(--blue)}
.ed-thumb:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ed-thumb-pic{display:grid;place-items:center;width:78px;height:96px;overflow:hidden}
.ed-thumb-pic img{max-width:78px;max-height:96px;box-shadow:0 1px 4px rgba(15,23,42,.18);transition:transform .15s}
.ed-thumb-blank{display:block;width:62px;height:88px;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.18);transition:transform .15s}
.ed-thumb-no{font-size:11px;font-weight:600;color:var(--muted)}
.ed-thumb-acts{display:flex;gap:3px}
.ed-thumb-act{width:24px;height:22px;padding:0;border:1px solid var(--line);border-radius:7px;background:#fff;font-size:13px;line-height:1;cursor:pointer;color:#42506b}
.ed-thumb-act:hover{border-color:var(--blue);color:var(--blue)}
.ed-turned{font-size:12px;color:#b45309;font-weight:600}

/* Handwriting faces for typed signatures, loaded only when the signature window opens. */
@font-face{font-family:"VD Sig Dancing Script";src:url(fonts/sig-dancingscript.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Great Vibes";src:url(fonts/sig-greatvibes.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Allura";src:url(fonts/sig-allura.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Alex Brush";src:url(fonts/sig-alexbrush.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Parisienne";src:url(fonts/sig-parisienne.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Sacramento";src:url(fonts/sig-sacramento.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Mr Dafoe";src:url(fonts/sig-mrdafoe.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Pacifico";src:url(fonts/sig-pacifico.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Kaushan Script";src:url(fonts/sig-kaushanscript.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Caveat";src:url(fonts/sig-caveat.woff2) format("woff2");font-display:swap}
@font-face{font-family:"VD Sig Cedarville Cursive";src:url(fonts/sig-cedarvillecursive.woff2) format("woff2");font-display:swap}
.ed-sign-head{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:6px 2px 2px}
.ed-sign-modes{display:flex;flex-wrap:wrap;gap:6px}
.ed-sign-mode{padding:6px 10px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:12px;cursor:pointer}
.ed-sign-mode.on{border-color:var(--blue);background:var(--soft);color:var(--blue2);font-weight:600}
.ed-sign-shot{background:repeating-conic-gradient(#eef2f8 0% 25%,#fff 0% 50%) 50%/16px 16px;border-radius:10px}
.ed-check svg,.ed-cross svg,.ed-dot svg{width:100%;height:100%;display:block;overflow:visible}
.ed-obj.ed-check,.ed-obj.ed-cross,.ed-obj.ed-dot{background:transparent}
.ed-ico-check:before{content:"\2713";position:absolute;inset:0;display:grid;place-items:center;font-size:15px;font-weight:700;line-height:1}
.ed-ico-cross:before{content:"\2715";position:absolute;inset:0;display:grid;place-items:center;font-size:14px;font-weight:700;line-height:1}
.ed-ico-dot:before{content:"";position:absolute;left:5px;top:5px;width:7px;height:7px;border-radius:50%;background:currentColor}
.ed-ico-date{border:1.5px solid currentColor;border-radius:3px;height:13px;margin-top:3px}
.ed-ico-date:before{content:"";position:absolute;left:0;right:0;top:3px;border-top:1.5px solid currentColor}
.ed-ico-marks:before{content:"\2713";position:absolute;inset:0;display:grid;place-items:center;font-size:15px;font-weight:700;line-height:1}
.ed-ico-fillform{border:1.5px solid currentColor;border-radius:3px;height:11px;margin-top:3px}
.ed-ico-fillform:after{content:"";position:absolute;left:3px;top:4px;width:6px;height:1.5px;background:currentColor}
.ed-ico-initials:before{content:"AB";position:absolute;inset:0;display:grid;place-items:center;font:italic 700 9px Georgia,serif}

/* Add a file from a web address, under the drop area. */
.url-upload{margin:8px 0 0}
.url-upload-toggle{border:0;background:none;padding:2px 0;color:var(--blue2);font-size:13px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.url-upload-form{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.url-upload-form input{flex:1 1 240px;min-width:0;border:1px solid var(--line);border-radius:11px;padding:10px 12px;background:#fff}
.url-upload-form button{padding:10px 16px}

/* After a result: continue with another tool, save the steps; saved workflows and settings. */
.next-steps{display:grid;gap:8px;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--soft2)}
.next-steps:empty{display:none}
.next-steps b{font-size:13px}
.next-quick{display:flex;flex-wrap:wrap;gap:6px}
.next-quick button{padding:7px 10px;font-size:12px;border-radius:10px}
.next-pick,.next-save,.preset-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.next-pick select,.next-save input,.preset-row select,.preset-row input{flex:1 1 150px;min-width:0;border:1px solid var(--line);border-radius:10px;padding:8px;background:#fff;font-size:12.5px}
.next-pick button,.next-save button,.preset-row button.secondary{padding:8px 12px;font-size:12px;border-radius:10px}
.next-save p{flex:1 1 100%;margin:0;font-size:12px}
.workflows,.saved-settings{margin-top:10px;font-size:13px}
.workflows:empty,.saved-settings:empty{display:none}
.workflows summary,.saved-settings summary{cursor:pointer;font-weight:600;color:#42506b}
.saved-settings{margin:0 0 10px}
.saved-settings details[open],.workflows details[open]{display:grid;gap:8px}
.wf-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.wf-list li{display:flex;align-items:center;gap:6px;padding:8px;border:1px solid var(--line);border-radius:10px;background:#fff}
.wf-list li>div{flex:1;min-width:0;display:grid}
.wf-list li span{font-size:11.5px;overflow-wrap:anywhere}
.wf-list button.secondary{padding:6px 10px;font-size:12px;border-radius:9px}
.wf-drop{border:0;background:none;font-size:18px;line-height:1;color:var(--muted);cursor:pointer;padding:0 4px}
.next-carried{margin:0;font-size:12.5px}
