:root{
  --bg:#F3F5F4;--panel:#FFFFFF;--ink:#1B2A2E;--muted:#5C6B70;--line:#D8DEDC;--line-strong:#B9C2BF;
  --accent:#F2C230;--accent-hover:#E5B420;--accent-ink:#7A5A00;--accent-soft:#FBEDB8;
  --ctl:#7A8886; /* control borders: at least 3:1 against both backgrounds */
  --danger:#B3261E;--ok:#1F7A4D;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 "Trebuchet MS","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
a{color:inherit}
h1,h2{line-height:1.15;letter-spacing:-.015em;margin:0}
.muted{color:var(--muted)}
.hidden{display:none!important}
.err{color:var(--danger)}
.ok{color:var(--ok)}

/* header + footer */
.top{display:flex;justify-content:space-between;align-items:center;max-width:960px;margin:0 auto;padding:22px 24px 8px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:20px;text-decoration:none}
.mark{width:28px;height:15px;background:var(--accent);border-left:5px solid var(--ink);border-radius:0 3px 3px 0}
.top nav a{font-size:15px;color:var(--muted);text-decoration:none}
.top nav a:hover{color:var(--ink);text-decoration:underline}
.foot{max-width:960px;margin:0 auto;padding:22px 24px 40px;border-top:1px solid var(--line);color:var(--muted);font-size:14px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px}

/* layout */
.wrap{max-width:960px;margin:0 auto;padding:24px 24px 72px}
.wrap.narrow{max-width:760px}
.hero h1{font-size:clamp(30px,5vw,42px);max-width:14ch}
.lead{font-size:18px;color:var(--muted);max-width:52ch;margin:14px 0 0}
.search{display:block;width:100%;max-width:360px;margin:34px 0 0}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:14px}
.tile{position:relative;display:block;background:var(--panel);padding:20px 70px 24px 22px;text-decoration:none;border-left:5px solid transparent;transition:border-color .12s}
.tile:hover,.tile:focus-visible{border-left-color:var(--accent);outline:none}
.ico{display:flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:8px;background:var(--accent-soft);color:var(--ink);transition:background .12s}
.ico svg{display:block;width:20px;height:20px}
.tile .ico{position:absolute;top:16px;right:16px;display:flex;font-size:0;line-height:0}
.tile:hover .ico,.tile:focus-visible .ico{background:var(--accent)}
.toolhead{display:flex;align-items:center;gap:12px;margin-top:16px}
.toolhead .ico{width:42px;height:42px;border-radius:10px}
.toolhead .ico svg{width:24px;height:24px}
.toolhead h1{margin:0}
.tile strong{display:block;font-size:19px;margin-bottom:6px}
.tile .blurb{display:block;color:var(--muted);font-size:15px;line-height:1.45}
.tiles .empty{grid-column:1/-1;background:var(--panel);margin:0;padding:22px;color:var(--muted)}
.back{font-size:15px;color:var(--muted);text-decoration:none}
.back:hover{color:var(--ink);text-decoration:underline}
.wrap.narrow h1{font-size:clamp(26px,4vw,34px)}
.tool{margin-top:26px}

/* drop zone: the one loud element on each tool page */
.drop{position:relative;border:2px dashed var(--ctl);background:var(--panel);padding:44px 24px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop:hover{border-color:var(--ink)}
.drop:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.drop.over{border-color:var(--accent-ink);background:var(--accent-soft)}
.drop strong{display:block;font-size:19px}
.drop span{color:var(--muted)}
.drop::before,.drop::after{content:"";position:absolute;width:20px;height:20px;border:4px solid var(--accent)}
.drop::before{top:-2px;left:-2px;border-right:0;border-bottom:0}
.drop::after{bottom:-2px;right:-2px;border-left:0;border-top:0}

/* form controls */
.controls{display:flex;flex-wrap:wrap;gap:16px 26px;margin:22px 0;align-items:flex-end}
.f{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.f.full{width:100%;margin-top:4px}
input[type=text],input[type=number],input[type=date],input[type=search],select,textarea{font:inherit;color:var(--ink);border:1px solid var(--ctl);background:var(--panel);padding:8px 10px;border-radius:4px;min-width:0;max-width:100%}
textarea{width:100%;resize:vertical}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:8px;top:-60px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:4px;z-index:10;text-decoration:none}
.skip:focus{top:8px}
h1[tabindex="-1"]:focus{outline:none}
input[type=range]{width:220px;max-width:100%;accent-color:var(--accent-ink)}
.qv{font-weight:700;color:var(--ink)}
.btn{font:inherit;font-weight:700;border:1px solid var(--ink);background:var(--panel);color:var(--ink);padding:10px 16px;border-radius:4px;cursor:pointer}
.btn:hover{background:#EEF1F0}
.btn.primary{background:var(--accent);border-color:var(--accent)}
.btn.primary:hover{background:var(--accent-hover)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.small{font-weight:400;padding:4px 10px;font-size:14px}
.status{min-height:1.5em;font-size:15px;color:var(--muted);margin:8px 0 0}
.status.err{color:var(--danger)}
.status.ok{color:var(--ok)}

/* image compressor */
.result{background:var(--panel);border:1px solid var(--line);padding:20px;display:grid;grid-template-columns:170px 1fr;gap:22px;align-items:center}
.result img{width:100%;height:auto;border:1px solid var(--line);background:#fff}
.stats{font-size:17px}
.stats strong{font-size:24px}
.stats .saved{display:block;font-size:15px}
.dims{margin:6px 0 14px;font-size:14px}
@media (max-width:560px){.result{grid-template-columns:1fr}}

/* pdf merge */
.flist{list-style:none;padding:0;margin:18px 0 0;border:1px solid var(--line);background:var(--panel)}
.flist li{display:flex;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid var(--line)}
.flist li:first-child{border-top:0}
.flist .n{width:22px;color:var(--muted);font-variant-numeric:tabular-nums}
.fname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsize{color:var(--muted);font-size:14px;white-space:nowrap}
.rowbtns{display:flex;gap:6px}
@media (max-width:560px){.flist li{flex-wrap:wrap}.rowbtns{width:100%;justify-content:flex-end}}

/* qr */
.qr-out img{display:none!important}
.qr-out canvas{display:block;width:min(100%,280px);height:auto;border:1px solid var(--line);background:#fff;padding:12px}

/* invoice */
.inv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px;align-items:start}
@media (max-width:820px){.inv{grid-template-columns:1fr}}
.form{display:flex;flex-direction:column;gap:14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.items{border:1px solid var(--line);background:var(--panel)}
.it{display:grid;grid-template-columns:minmax(0,1fr) 62px 96px 34px;gap:8px;padding:8px;border-top:1px solid var(--line);align-items:center}
.it:first-child{border-top:0}
.it.head{font-size:13px;color:var(--muted);padding:8px 8px 4px}
.it.foot{display:block}
.it input{width:100%;padding:6px 8px}
.paper{background:#fff;border:1px solid var(--line);padding:32px;font-size:14px;line-height:1.45}
.paper h2{font-size:28px;margin-bottom:2px}
.ph{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pdates{text-align:right}
.pparties{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px}
.plabel{font-size:12px;color:var(--muted);margin-bottom:2px}
.paper table{width:100%;border-collapse:collapse;margin-top:22px}
.paper th,.paper td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line);vertical-align:top}
.paper th{font-size:12px;color:var(--muted);font-weight:400}
.paper th:not(:first-child),.paper td:not(:first-child){text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tot{display:flex;justify-content:flex-end;margin-top:8px}
.tot table{width:auto;min-width:260px;margin-top:0}
.tot td{border-bottom:0;padding:5px 6px}
.tot tr.grand td{font-weight:700;font-size:16px;border-top:2px solid var(--ink);padding-top:9px}
.pnotes{margin-top:26px;color:var(--muted)}

/* word counter */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:18px}
.stat{background:var(--panel);padding:14px 16px}
.stat b{display:block;font-size:26px;font-variant-numeric:tabular-nums}
.stat span{color:var(--muted);font-size:14px}

/* home sections + related links */
.cat{margin-top:36px}
.cat h2{font-size:20px;margin:0 0 10px}
.cat .tiles{margin-top:0}
.cats .empty{margin:24px 0 0;color:var(--muted)}
.related{margin:34px 0 0;font-size:15px;color:var(--muted);line-height:1.9}
.related a{margin-right:14px;white-space:nowrap}

/* pdf tools */
.fileinfo{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:14px 0 0;font-size:15px}
.fileinfo strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.hint{font-size:14px;color:var(--muted);margin:14px 0 0}
.f.chk{flex-direction:row;align-items:center;gap:8px;padding-bottom:9px}
.f.chk input{width:18px;height:18px;margin:0}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:16px}
.thumb{position:relative;background:var(--panel);border:2px solid var(--ctl);padding:6px;cursor:pointer;text-align:center;font-size:12px;color:var(--muted);user-select:none}
.thumb.sel{border-color:var(--accent-ink);background:var(--accent-soft)}
.thumb .pg{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);margin-bottom:4px;overflow:hidden}
.thumb .pg canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;transition:transform .15s}
.thumb .ph{width:78%;height:100%;background:#fff}
.thumb .tb{display:flex;gap:4px;justify-content:center;margin-top:4px}
.thumb .tb .btn.small{padding:2px 8px;line-height:1.3}
.thumb.dragging{opacity:.35}
.thumb[draggable=true]{cursor:grab}
.thumb:hover{border-color:var(--ink)}
.thumb:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.thumb.del{border-color:var(--danger);background:#FBE9E7}
.thumb.del .pg{opacity:.3}
.thumb.del::after{content:"Deleted";position:absolute;top:10px;left:10px;right:10px;background:var(--danger);color:#fff;font-size:11px;padding:2px 0}

/* password generator */
.pw-out{background:var(--panel);border:1px solid var(--line);padding:18px 20px;margin-top:4px;overflow-wrap:anywhere}
.pw{display:block;font-size:22px;line-height:1.4}
.strength{font-size:14px;color:var(--muted);align-self:center}
.strength b.ok{color:var(--ok)}.strength b.err{color:var(--danger)}

/* unit converter */
.conv{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:end;margin-top:4px}
.conv .f input,.conv .f select,.conv .res{width:100%}
.conv .res{display:block;font-size:22px;line-height:1.3;padding:6px 10px;background:var(--panel);border:1px solid var(--line);border-radius:4px;min-height:44px;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.conv .swap{align-self:end;margin-bottom:46px}
@media (max-width:560px){.conv{grid-template-columns:1fr}.conv .swap{margin:0;justify-self:start}}
.formula{margin:14px 0 0;font-size:15px}
.all{list-style:none;padding:0;margin:12px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px 18px;font-size:14px;color:var(--muted)}
.all b{color:var(--ink);font-variant-numeric:tabular-nums}

/* sign */
.sigpad{display:block;width:100%;max-width:600px;aspect-ratio:3/1;height:auto;background:#fff;border:2px dashed var(--ctl);touch-action:none;cursor:crosshair;margin-top:4px}
.sig-stage{position:relative;display:inline-block;max-width:100%;border:1px solid var(--line);background:#fff;line-height:0}
.sig-stage .preview{display:block;max-width:100%;height:auto}
.sig-overlay{position:absolute;top:0;left:0;cursor:move;touch-action:none;user-select:none;outline:1px dashed var(--accent-ink);outline-offset:2px;background:rgba(255,255,255,.01)}
.sig-date{position:absolute;pointer-events:none;color:#1a1a1a;line-height:1.2;font-family:Helvetica,Arial,sans-serif}

/* collate */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:14px}
@media (max-width:600px){.pair{grid-template-columns:1fr}}
.pair h3{font-size:15px;margin:0 0 8px;color:var(--muted);font-weight:400}
.pair .drop{padding:26px 16px}

/* metadata */
.meta{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin-top:8px}
@media (max-width:600px){.meta{grid-template-columns:1fr}}
.meta .f input{width:100%}
.dates{margin:12px 0 0;font-size:14px}

/* completion panel, warnings, about page */
.done{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:14px;padding:14px 16px;background:var(--panel);border:1px solid var(--ctl);border-left:5px solid var(--accent)}
.done strong{overflow-wrap:anywhere}
.done .muted{font-size:14px}
.warn{color:var(--danger);font-size:14px}
.fileinfo .warn{width:100%}
.about h2{font-size:20px;margin:28px 0 8px}
.about p,.about li{max-width:68ch}
.about ul{padding-left:20px}

/* crop, extracted images, text */
.crop-stage{position:relative;display:inline-block;max-width:100%;border:1px solid var(--ctl);background:#fff;line-height:0;overflow:hidden;touch-action:none;cursor:crosshair;margin-top:6px}
.crop-stage .preview{display:block;max-width:100%;height:auto}
.crop-box{position:absolute;border:2px solid var(--accent-ink);box-shadow:0 0 0 9999px rgba(27,42,46,.35);pointer-events:none}
.imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:14px}
.imgcell{background:var(--panel);border:1px solid var(--line);padding:8px;text-align:center;font-size:12px;color:var(--muted)}
.imgcell img{display:block;width:100%;height:120px;object-fit:contain;background:#fff;margin-bottom:6px}
.imgcell span{display:block;margin-bottom:6px}
.counts{margin:10px 0 0;font-size:14px}
textarea[hidden]{display:none}


@media print{
  @page{margin:18mm}
  body{background:#fff}
  body *{visibility:hidden}
  .paper,.paper *{visibility:visible}
  .paper{position:absolute;left:0;top:0;width:100%;border:0;padding:0;font-size:13px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* static site: page copy under each tool, loading placeholder */
.seo{padding-top:8px}
.seo h2{font-size:20px;margin:30px 0 8px}
.seo p,.seo li,.seo dd{max-width:68ch}
.seo ol{padding-left:22px}
.seo dt{font-weight:700;margin-top:14px}
.seo dd{margin:4px 0 0;color:var(--muted)}
.tool .loading{color:var(--muted);margin:0}
.foot .build{flex-basis:100%;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
/* language switcher in the header */
.top nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:flex-end}
.langs{display:flex;gap:10px;font-size:14px}
.langs a{color:var(--muted);text-decoration:none}
.langs a:hover{color:var(--ink);text-decoration:underline}
.langs span[aria-current]{color:var(--ink);font-weight:700}

/* word to pdf: the rendered document, kept at true size so its layout can be measured */
.docx-wrap{margin-top:14px;max-height:520px;overflow:auto;border:1px solid var(--ctl);background:#DCE0DE;padding:16px}
.docx-stage section.docx{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.2);margin:0 auto 16px}
@media print{
  body.print-docx *{visibility:hidden}
  body.print-docx .docx-stage,body.print-docx .docx-stage *{visibility:visible}
  body.print-docx .docx-wrap{position:absolute;left:0;top:0;max-height:none;overflow:visible;border:0;padding:0;background:#fff}
  body.print-docx .docx-stage section.docx{box-shadow:none;margin:0;page-break-after:always}
}

/* suggestion dialog */
dialog.suggest{border:1px solid var(--ctl);border-radius:8px;padding:22px 24px;max-width:520px;width:calc(100% - 32px);background:var(--panel);color:var(--ink);font:inherit}
dialog.suggest::backdrop{background:rgba(27,42,46,.45)}
dialog.suggest h2{font-size:20px;margin:0 0 6px}
dialog.suggest textarea{width:100%;margin-top:10px}
dialog.suggest .controls{margin:14px 0 6px}
dialog.suggest .hint.small{font-size:13px;margin:0}

/* was this tool useful? */
.feedback{display:none;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:22px;padding:12px 14px;background:var(--panel);border:1px solid var(--line);font-size:14px;color:var(--muted)}
.feedback .fb-up,.feedback .fb-down{padding:4px 9px;line-height:0}
.feedback .fb-up svg,.feedback .fb-down svg{width:20px;height:20px;display:block}
.feedback button.chosen{background:var(--accent);border-color:var(--accent)}
.feedback button:disabled{opacity:.6;cursor:default}
.feedback .fb-msg{min-height:1em}
.feedback .fb-msg.ok{color:var(--ok)}
.feedback .fb-msg.err{color:var(--danger)}
.feedback .fb-more{flex-basis:100%;display:flex;gap:8px;align-items:flex-start}
.feedback .fb-more textarea{flex:1}
.feedback.ready{display:flex}
html[lang="es"] .thumb.del::after{content:"Eliminada"}
html[lang="pt-BR"] .thumb.del::after{content:"Excluída"}

/* JiffyKit 0.2: shared visual system. Screen-only rules preserve print output. */
@media screen {
  :root{--bg:#F7F8FA;--panel:#FFFFFF;--ink:#182632;--muted:#566574;--line:#E1E6ED;--line-strong:#C3CDD8;--ctl:#8494A5;--accent:#F2C230;--accent-hover:#E4B31C;--accent-soft:#FFF6D8;--accent-ink:#775400;--danger:#B3261E;--ok:#166849;--category:#315EC3;--category-soft:#EDF2FF}
  body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.55}
  h1,h2,h3{letter-spacing:-.025em}
  button,input,select,textarea{font-family:inherit}
  a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}
  button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #315EC3;outline-offset:4px}
  .top{max-width:none;margin:0;padding:18px max(24px,calc((100% - 1120px)/2));background:var(--panel);border-bottom:1px solid var(--line);gap:22px}
  .brand{font-size:24px;letter-spacing:-1px;gap:10px;font-weight:700;flex:none}
  .mark{width:36px;height:36px;border:0;border-radius:11px;background:var(--accent);display:grid;place-items:center;color:var(--ink)}
  .mark svg{width:23px;height:23px}
  .top .header-right{display:flex;align-items:center;gap:30px;min-width:0}
  .top .primary-nav{gap:24px;flex-wrap:nowrap}
  .top nav a{font-size:14px;min-height:36px;display:inline-flex;align-items:center;white-space:nowrap}
  .top nav a:hover{text-decoration:none;color:var(--ink)}
  .top .primary-nav a[aria-current]{color:var(--ink);box-shadow:0 2px 0 var(--accent)}
  .top .langs{gap:12px;padding-left:22px;border-left:1px solid var(--line);flex-wrap:nowrap;font-size:13px}
  .top .langs a{font-size:13px}
  .wrap{max-width:1168px;padding:36px 24px 64px}
  .wrap.narrow{max-width:1168px}
  .home-wrap{padding-top:44px}
  .hero{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(240px,1fr);align-items:center;gap:64px}
  .hero h1{font-size:clamp(36px,4.7vw,54px);line-height:1.09;letter-spacing:-.045em;max-width:17ch;font-weight:700}
  .hero-highlight{box-shadow:inset 0 -.19em 0 var(--accent)}
  .eyebrow{font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin:0 0 13px}
  .hero .lead{font-size:17px;max-width:49ch;line-height:1.7;margin-top:18px}
  .hero-art{position:relative;display:flex;align-items:center;justify-content:center;gap:18px;min-height:215px;padding:28px;border-radius:28px;background:var(--accent-soft);color:var(--ink)}
  .hero-art .paper-icon{display:flex;flex-direction:column;gap:10px;width:104px;min-height:138px;padding:17px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:0 10px 24px #1826320a}
  .paper-icon:first-child{transform:rotate(-8deg)}
  .paper-icon:last-child{transform:rotate(7deg);margin-top:24px}
  .paper-icon .ico{background:none;padding:0;width:26px;height:27px;color:#315EC3;border-radius:0}
  .paper-icon .ico svg{width:25px;height:25px}
  .paper-icon b{font-size:12px;font-weight:600;color:var(--muted)}
  .paper-icon .paper-line{height:5px;background:var(--line);border-radius:3px;width:100%}
  .paper-icon .paper-line:last-child{width:65%}
  .hero-arrow{font-size:25px}
  .search-box{display:flex;align-items:center;gap:13px;border:1px solid var(--line-strong);border-radius:14px;padding:13px 19px;background:var(--panel);box-shadow:0 4px 20px #18263205;margin-top:34px}
  .search-box svg{flex:none;width:22px;height:22px;color:var(--muted)}
  .search-box .search{border:0;border-radius:0;background:none;padding:8px 0;margin:0;max-width:none;width:100%;min-width:0;font-size:16px}
  .search::placeholder{color:var(--muted);opacity:1}
  .trust-row{display:flex;flex-wrap:wrap;gap:14px 25px;margin:16px 0 28px;color:var(--muted);font-size:13px}
  .trust-row span{display:flex;gap:7px;align-items:center}
  .trust-row svg{width:16px;height:16px;flex:none}
  .discovery-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:30px 0 16px;scroll-margin-top:24px}
  .discovery-head h2{font-size:23px}
  .filter-bar{display:flex;gap:6px;flex-wrap:wrap}
  .filter-bar button{font:inherit;font-size:14px;border:1px solid transparent;border-radius:9px;padding:8px 13px;background:transparent;color:var(--muted);cursor:pointer;min-height:40px}
  .filter-bar button:hover{color:var(--ink);background:#EEF1F5}
  .filter-bar button[aria-pressed=true]{color:var(--ink);background:var(--panel);border-color:var(--line-strong);box-shadow:0 2px 5px #18263204}
  .result-count{font-size:13px;color:var(--muted);margin:0 0 14px}
  .result-count:empty{display:none}
  .featured{margin-top:20px}
  .featured h2{font-size:22px;margin-bottom:16px}
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;background:none;border:0;margin-top:16px}
  .tile{border:1px solid var(--line);border-radius:15px;padding:22px;min-width:0;min-height:186px;transition:transform .16s,box-shadow .16s,border-color .16s}
  .tile:hover{transform:translateY(-3px);box-shadow:0 10px 24px #1826320b;border-color:var(--line-strong)}
  .tile:focus-visible{border-color:var(--category);outline:3px solid #315EC3;outline-offset:4px}
  .tile .ico{position:static;top:auto;right:auto;width:42px;height:42px;border-radius:11px;margin-bottom:18px;background:var(--category-soft);color:var(--category)}
  .tile .ico svg{width:24px;height:24px}
  .tile:hover .ico,.tile:focus-visible .ico{background:var(--category-soft)}
  .tile::after{content:'↗';position:absolute;right:22px;top:23px;font-size:19px;color:var(--muted)}
  .tile strong{font-size:18px;font-weight:650;margin-bottom:7px;line-height:1.3;letter-spacing:-.02em}
  .tile .blurb{font-size:14px;line-height:1.6;color:var(--muted)}
  [data-category=pdf],[data-cat=pdf],[data-cat=scan]{--category:#315EC3;--category-soft:#EDF2FF}
  [data-category=img],[data-cat=img]{--category:#7541AD;--category-soft:#F3EDFC}
  [data-category=text],[data-cat=text]{--category:#16766B;--category-soft:#E9F7F2}
  [data-category=dev],[data-cat=dev]{--category:#3D647D;--category-soft:#EAF2F7}
  [data-category=everyday],[data-cat=calc],[data-cat=gen]{--category:#805513;--category-soft:#FFF5DC}
  .cat{margin-top:30px}
  .cat h2{font-size:20px;margin:0 0 15px}
  .cats .empty{padding:28px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
  .empty a{text-decoration:underline;text-underline-offset:3px}
  .back{display:inline-flex;align-items:center;gap:7px;font-size:14px}
  .back::before{content:'←'}
  .toolhead{margin-top:24px;gap:14px}
  .toolhead .ico{width:48px;height:48px;border-radius:13px;background:var(--category-soft);color:var(--category)}
  .wrap.narrow .toolhead h1{font-size:clamp(28px,3.3vw,38px);letter-spacing:-.035em}
  .wrap.narrow > .lead{max-width:65ch;font-size:17px;line-height:1.65;margin-top:16px}
  .tool-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;align-items:start;gap:26px;margin-top:28px}
  .tool-layout .tool{margin:0;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:0 4px 20px #18263203}
  .tool-layout.workspace-wide{grid-template-columns:minmax(0,1fr)}
  .tool-layout.workspace-wide .tool-note{display:none}
  .tool-note{padding:16px 0;font-size:14px;color:var(--muted)}
  .tool-note h2{font-size:16px;color:var(--ink);margin:0 0 10px;display:flex;align-items:center;gap:8px}
  .tool-note h2 svg{width:20px;height:20px;flex:none;color:var(--ok)}
  .tool-note p{line-height:1.7;margin:0 0 23px}
  .tool-note .note-links{list-style:none;margin:0;padding:0}
  .tool-note .note-links li{border-top:1px solid var(--line)}
  .tool-note .note-links a{display:block;padding:12px 0;text-decoration:none;color:var(--ink);line-height:1.45}
  .tool-note .note-links a:hover{text-decoration:underline}
  .drop{border:1.5px dashed var(--ctl);border-radius:15px;padding:34px 20px;background:#FAFBFD;line-height:1.6}
  .drop::before,.drop::after{display:none}
  .drop:hover{border-color:var(--category);background:var(--category-soft)}
  .drop:focus-visible{outline-color:#315EC3}
  .drop strong{font-size:20px;letter-spacing:-.02em}
  .drop > span:not(.upload-icon):not(.pick-label){display:block;font-size:14px;margin:7px auto 0;max-width:48ch;color:var(--muted)}
  .drop .upload-icon{display:grid;place-items:center;color:var(--category);background:var(--category-soft);width:56px;height:56px;border-radius:15px;margin:0 auto 17px}
  .drop .upload-icon svg{width:29px;height:29px}
  .drop .pick-label{display:inline-block;margin:20px auto 0;background:var(--accent);color:var(--ink);padding:11px 24px;border-radius:10px;font-size:15px;font-weight:650}
  .drop:has(input:disabled){opacity:.6;cursor:wait}
  .btn{border-radius:9px;border-color:var(--line-strong);padding:10px 16px;min-height:42px;font-size:14px;font-weight:600;transition:background .14s,box-shadow .14s}
  .btn:hover{background:#F0F3F7;border-color:var(--ctl)}
  .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--ink);font-size:15px;font-weight:650;box-shadow:0 2px 3px #18263207}
  .btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
  .btn.small{min-height:32px;padding:5px 10px;font-size:13px}
  .btn:disabled{opacity:.5}
  .controls{gap:18px 22px;margin:24px 0}
  .f{font-size:13px;gap:7px;color:var(--muted);max-width:100%}
  input[type=text],input[type=number],input[type=date],input[type=search],select,textarea{border-radius:8px;border-color:var(--ctl);padding:10px 12px;min-height:42px;font-size:16px;background:var(--panel)}
  input[type=range]{accent-color:var(--category);max-width:100%}
  textarea{line-height:1.6}
  .hint{font-size:13px;line-height:1.65}
  .status{margin-top:14px;font-size:14px;overflow-wrap:anywhere}
  .status[data-state=busy]::before{content:'';display:inline-block;vertical-align:-2px;width:14px;height:14px;margin-right:8px;border:2px solid var(--line-strong);border-top-color:var(--category);border-radius:50%;animation:jk-spin .8s linear infinite}
  .status[data-state=ok]{padding:11px 14px;border-radius:9px;background:#ECF7F1;color:var(--ok)}
  .status[data-state=err]{padding:11px 14px;border-radius:9px;background:#FFF0EE;color:var(--danger)}
  .fileinfo{gap:5px 12px;font-size:14px;margin:20px 0 0;overflow-wrap:anywhere}
  .fileinfo strong{max-width:100%}
  .flist,.items,.pw-out,.stat-grid,.feedback{border-radius:12px;overflow:hidden;border-color:var(--line)}
  .flist li{padding:12px 14px;gap:10px}
  .flist .fname{font-size:14px}
  .flist .fsize{font-size:12px}
  .result{border-radius:14px;padding:22px;grid-template-columns:minmax(140px,200px) minmax(0,1fr);background:#F8FAFC}
  .result img{border-radius:8px;max-height:300px;object-fit:contain}
  .result .stats{font-size:15px}
  .result .stats strong{font-size:26px;color:var(--ink)}
  .result .stats .saved{font-size:14px;margin-top:5px}
  .comparison{gap:18px!important}
  .comparison figure{padding:16px;border:1px solid var(--line);border-radius:12px;background:#F8FAFC;min-width:0}
  .comparison figcaption{font-size:14px;font-weight:600;margin-bottom:12px}
  .comparison img{border-radius:6px}
  .comparison ~ .dl{margin-top:6px}
  .thumb{border-radius:9px;padding:8px}
  .thumb .pg{border-radius:4px}
  .thumb canvas{max-width:100%}
  .thumb .tb{flex-wrap:wrap}
  .sigpad,.sig-stage,.crop-stage,.docx-wrap{border-radius:10px}
  .docx-stage section.docx{border-radius:0}
  .done{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid #B5DCCB;border-radius:13px;background:#F3FBF7;margin-top:22px}
  .done-file{flex:1 1 220px;min-width:0}
  .done-file .done-kicker{display:block;font-size:12px;font-weight:650;text-transform:uppercase;letter-spacing:.07em;color:var(--ok);margin-bottom:7px}
  .done-file strong{display:block;line-height:1.5;font-size:16px}
  .done-file .muted{display:block;margin-top:4px}
  .done-actions{display:flex;gap:9px;flex-wrap:wrap}
  .related{display:flex;gap:9px 15px;align-items:center;flex-wrap:wrap;margin-top:26px;font-size:14px}
  .related a{margin:0;white-space:normal;text-decoration:none;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 11px;color:var(--ink);line-height:1.45}
  .related a:hover{border-color:var(--ctl)}
  .feedback{margin-top:22px;padding:15px;font-size:13px}
  .feedback .fb-more{flex-wrap:wrap}
  .feedback .fb-more textarea{min-width:200px}
  .seo{max-width:940px!important;padding-top:8px;color:var(--muted);line-height:1.75;font-size:15px}
  .seo h2{color:var(--ink);font-size:21px}
  .seo dt{color:var(--ink);font-weight:600}
  .seo dd{margin-top:7px}
  .seo dd,.seo p,.seo li{max-width:75ch}
  .about{max-width:900px!important}
  .about h2{margin-top:32px}
  .foot{max-width:1168px;padding:25px 24px 35px;gap:12px 28px;line-height:1.65;font-size:13px}
  .foot > span:first-child{max-width:67ch}
  .foot a{text-underline-offset:3px}
  .foot .build{font-size:11px;margin-top:7px}
  dialog.suggest{border-radius:16px;border-color:var(--line);box-shadow:0 25px 80px #18263230;padding:27px}
  .qr-out canvas{border-radius:10px}
  .stat b{font-size:29px;line-height:1.4}
  .conv .res{min-height:46px;border-radius:8px;padding:9px 12px;background:#F7F9FC}
  .pair .drop{padding:24px 16px}
  .pair .drop .upload-icon{width:42px;height:42px;margin-bottom:12px}
  .pair .drop .pick-label{padding:9px 15px}
}
@keyframes jk-spin{to{transform:rotate(360deg)}}
@media screen and (max-width:1000px){
  .top{padding:16px 24px;flex-wrap:wrap;gap:14px}.top .header-right{gap:20px}.top .langs{padding-left:17px}
  .hero{gap:28px;grid-template-columns:minmax(0,1.6fr) minmax(210px,1fr)}
  .hero-art{padding:20px;gap:13px}.hero-art .paper-icon{width:90px;padding:14px}
  .tool-layout{grid-template-columns:minmax(0,1fr) 190px;gap:22px}.tool-layout .tool{padding:22px}
}
@media screen and (max-width:820px){
  .top .header-right{justify-content:space-between;flex:1}.top .primary-nav{gap:16px}.top .langs{padding-left:0;border:0;gap:10px}
  .home-wrap{padding-top:32px}.hero{grid-template-columns:1fr}.hero-art{display:none}.hero h1{max-width:20ch;font-size:42px}.hero .lead{max-width:55ch}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-layout{grid-template-columns:minmax(0,1fr)}.tool-note{display:none}
  .wrap.narrow > .lead{max-width:58ch}.inv{grid-template-columns:1fr}.result{grid-template-columns:160px minmax(0,1fr)}
}
@media screen and (max-width:560px){
  .top{padding:16px 18px;gap:15px}.brand{font-size:22px}.mark{width:33px;height:33px}.top .header-right{flex-basis:100%;gap:12px;flex-wrap:wrap}.top .primary-nav{gap:21px}.top nav a{min-height:40px}
  .top .langs{gap:14px}.wrap,.wrap.narrow{padding:27px 18px 42px}.hero h1{font-size:36px}.hero .lead{font-size:16px;line-height:1.65}.eyebrow{font-size:11px}
  .search-box{margin-top:26px;padding:9px 13px;gap:10px}.trust-row{gap:10px 18px;font-size:12px;margin-bottom:26px}
  .discovery-head{gap:12px;margin-top:29px}.filter-bar{gap:5px}.filter-bar button{font-size:13px;padding:7px 11px;min-height:42px}
  .tiles{grid-template-columns:1fr;gap:12px}.tile{padding:18px 48px 18px 77px;min-height:112px;border-radius:12px}.tile .ico{position:absolute;left:18px;top:18px;width:41px;height:41px;margin:0}.tile::after{right:17px;top:20px}.tile strong{font-size:17px}.tile .blurb{font-size:13px;line-height:1.6}
  .cat{margin-top:27px}.cat h2{font-size:19px}.featured h2{font-size:20px}.toolhead{gap:11px;margin-top:22px}.toolhead .ico{width:43px;height:43px;flex:none}.wrap.narrow .toolhead h1{font-size:29px}.wrap.narrow > .lead{font-size:16px}
  .tool-layout{margin-top:23px}.tool-layout .tool{padding:18px;border-radius:14px}.drop{padding:27px 13px}.drop strong{font-size:19px}.drop > span:not(.upload-icon):not(.pick-label){font-size:13px}.drop .pick-label{padding:11px 22px}
  .controls{gap:15px 17px}.btn{min-height:44px}.btn.small{min-height:38px}.f{max-width:100%}input[type=range]{width:100%;min-width:130px}.qwrap{min-width:160px}
  .flist li{padding:11px;flex-wrap:wrap}.flist .rowbtns{gap:7px}.flist .rowbtns .btn{flex:1}.result{grid-template-columns:1fr;padding:17px;gap:18px}.result img{width:auto;max-width:100%;margin:0 auto;max-height:260px}
  .done{padding:17px;gap:14px}.done-actions{width:100%}.done-actions .btn{flex:1}.related{gap:8px;font-size:13px}.related a{min-height:40px;display:inline-flex;align-items:center}
  .feedback .fb-more textarea{min-width:0;width:100%;flex-basis:100%}.feedback .fb-more .btn{width:100%}.seo{font-size:14px}.foot{padding:23px 18px 30px;font-size:12px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat b{font-size:25px}.stat span{font-size:13px}.paper{padding:22px}.it{grid-template-columns:minmax(65px,1fr) 48px 70px 32px;gap:5px;padding:7px}.it input{padding:6px;min-height:38px;font-size:14px}.conv{grid-template-columns:1fr}.conv .swap{margin:0}.pair,.meta,.row2{grid-template-columns:1fr}.qr-out canvas{max-width:100%}
}
@media (prefers-reduced-motion:reduce){.tile{transition:none!important}.tile:hover{transform:none!important}.status[data-state=busy]::before{animation:none}}

/* Background removal: scoped to this tool and screen display. */
@media screen {
  .bg-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:14px 0; }
  .bg-fileinfo { overflow-wrap:anywhere; }
  .bg-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:24px 0; }
  .bg-comparison figure { min-width:0; margin:0; }
  .bg-comparison figcaption { color:#182632; font-weight:700; margin-bottom:9px; }
  .bg-preview { position:relative; display:flex; align-items:center; justify-content:center; aspect-ratio:1; background:#f7f8fa; border:1px solid #dfe4e8; border-radius:14px; overflow:hidden; }
  .bg-preview img { display:block; width:100%; height:100%; object-fit:contain; }
  .bg-checker { background-color:#fff; background-image:linear-gradient(45deg,#e6e9ed 25%,transparent 25%),linear-gradient(-45deg,#e6e9ed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e6e9ed 75%),linear-gradient(-45deg,transparent 75%,#e6e9ed 75%); background-size:24px 24px; background-position:0 0,0 12px,12px -12px,-12px 0; }
  .bg-placeholder { padding:12px 16px; border-radius:10px; background:#fff; color:#53616e; text-align:center; margin:20px; }
  .bg-settings { border-top:1px solid #dfe4e8; padding-top:20px; }
  .bg-adjust-label { max-width:420px; }
  .bg-adjust-label input { width:100%; }
  .bg-range-labels { display:flex; justify-content:space-between; max-width:420px; font-size:.82rem; color:#53616e; margin-top:-6px; }
  .bg-color { width:70px; height:44px; padding:4px; cursor:pointer; }
  .bg-progress progress { width:100%; accent-color:#6e46ab; height:9px; }
  .bg-progress { padding:10px 0; }
  .bg-output { overflow-wrap:anywhere; }
  @media (max-width:560px) {
    .bg-comparison { grid-template-columns:1fr; gap:20px; }
    .bg-actions .btn { flex:1 1 auto; }
    .bg-download { width:100%; }
  }
}