@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/onest-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/onest-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/onest-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/onest-cyrillic-800-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/onest-latin-400-normal.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:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/onest-latin-500-normal.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:"Onest";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/onest-latin-600-normal.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:"Onest";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/onest-latin-800-normal.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}

:root{
  --bg:#EEF1F3; --sheet:#FFFFFF; --ink:#18212B; --muted:#5E6975; --line:#D5DBE0;
  --ok:#15803D; --err:#B91C1C; --warn:#A16207;
  --fmt:#18212B;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
body.tool{--fmt:var(--c)}

*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:"Onest",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:16px;line-height:1.5}
a{color:inherit}
.wrap{max-width:920px;margin:0 auto;padding:22px 18px 56px}
header{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;margin-bottom:26px}
.brand{font-weight:800;font-size:20px;text-decoration:none;display:flex;align-items:center;gap:9px;letter-spacing:-.01em}
.brand-mark{width:22px;height:28px;border:2px solid var(--ink);border-radius:3px 9px 3px 3px;background:linear-gradient(var(--ink),var(--ink)) 4px 10px/10px 2px no-repeat,linear-gradient(#1D4ED8,#1D4ED8) 4px 15px/10px 3px no-repeat,linear-gradient(#C2410C,#C2410C) 4px 20px/7px 3px no-repeat,#fff}
.all-link{font-size:15px;font-weight:500;text-decoration:none;padding:6px 12px;border:1.5px solid var(--line);border-radius:8px;background:var(--sheet)}
.all-link:hover{border-color:var(--ink)}
body.home .all-link{display:none}
.privacy{color:var(--muted);font-size:14px;margin-left:auto}

h1{margin:0 0 8px;font-weight:800;font-size:clamp(34px,7vw,64px);line-height:1;letter-spacing:-.025em;color:var(--ink)}
body.home h1{font-size:clamp(32px,6vw,54px)}
.lead{margin:0 0 6px;color:var(--ink);max-width:62ch;font-size:17px}
.where{margin:0 0 22px;color:var(--muted);font-size:14px;display:flex;align-items:center;gap:8px}
.where::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--fmt);flex:none}

.opts{background:var(--sheet);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:16px;display:flex;flex-wrap:wrap;gap:14px 26px}
.opt{display:flex;flex-direction:column;gap:4px;font-size:14px;min-width:160px;flex:0 1 auto}
.opt label{color:var(--muted)}
.opt select,.opt input[type=text],.opt input[type=number]{font:inherit;font-size:15px;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);max-width:100%}
.opt input[type=range]{accent-color:var(--fmt)}
.opt .hint{font-size:12px;color:var(--muted);max-width:34ch}
[hidden]{display:none!important}

.drop{position:relative;display:block;background:var(--sheet);border:2px dashed #AEB8C2;border-radius:4px 34px 4px 4px;padding:42px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop::after{content:"";position:absolute;top:-2px;right:-2px;width:34px;height:34px;background:linear-gradient(225deg,var(--bg) 50%,#DCE2E7 50%);border-bottom-left-radius:6px}
.drop:hover,.drop.over{border-color:var(--fmt);background:#FBFCFD}
.drop:focus-within{outline:3px solid var(--fmt);outline-offset:3px}
.drop strong{display:block;font-size:20px;font-weight:600;margin-bottom:4px}
.drop span{color:var(--muted);font-size:14px}
.drop input{position:absolute;opacity:0;width:1px;height:1px}

.btn{font:inherit;font-weight:600;border:0;border-radius:8px;padding:10px 18px;background:var(--fmt);color:#fff;cursor:pointer;text-decoration:none;display:inline-block}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn:disabled{opacity:.4;cursor:default}
.btn:focus-visible,.card:focus-visible,.chip:focus-visible,a:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

.list{margin-top:20px;display:flex;flex-direction:column;gap:12px}
.item{background:var(--sheet);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.item-top{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.item-name{flex:1 1 220px;min-width:0;font-weight:500;overflow-wrap:anywhere}
.item-meta{font-size:13px;color:var(--muted)}
.bar{height:4px;background:#E6EAEE;border-radius:4px;margin-top:10px;overflow:hidden;position:relative}
.bar i{display:block;height:100%;width:0;background:var(--fmt);transition:width .2s}
.bar.busy i{width:35%!important;position:absolute;animation:slide 1.2s ease-in-out infinite}
@keyframes slide{from{left:-35%}to{left:100%}}
.status{font-size:13px;margin-top:6px;color:var(--muted)}
.status.ok{color:var(--ok)} .status.err{color:var(--err)} .status.warn{color:var(--warn)}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;margin-top:12px}
.thumbs button{border:1px solid var(--line);background:#fff;padding:4px;border-radius:6px;cursor:pointer;font:inherit;font-size:12px;color:var(--muted)}
.thumbs img{display:block;width:100%;height:auto;border-radius:3px;margin-bottom:3px}
.preview{margin-top:12px;max-height:220px;overflow:auto;white-space:pre-wrap;font-size:13px;background:#F7F9FA;border:1px solid var(--line);border-radius:6px;padding:10px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

.seo{margin-top:44px;max-width:68ch;color:#2F3A45}
.seo h2{font-size:20px;margin:26px 0 8px;font-weight:600}
.seo p{margin:0 0 10px}
footer{margin-top:40px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;max-width:72ch}

@media (max-width:520px){.drop{padding:34px 14px}.lead{font-size:16px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}.bar.busy i{animation:none;left:0;width:100%!important;opacity:.5}}

/* реклама */
.ad{margin:22px 0}
.ad-top{margin:0 0 24px}
.ad-label{font-size:11px;color:var(--muted);margin-bottom:4px}
.ad-body{min-height:90px}
.ad-result .ad-body{min-height:120px}
.house{display:grid;grid-template-columns:1fr auto;gap:4px 18px;align-items:center;text-decoration:none;background:var(--sheet);border:1px solid var(--line);border-left:4px solid var(--fmt);border-radius:8px;padding:14px 16px}
.house b{font-weight:600;font-size:16px;grid-column:1}
.house span{grid-column:1;color:var(--muted);font-size:14px}
.house em{grid-column:2;grid-row:1/3;font-style:normal;font-weight:600;font-size:14px;padding:8px 14px;border:1.5px solid var(--ink);border-radius:8px;white-space:nowrap}
.house:hover em{background:var(--ink);color:#fff}
@media (max-width:520px){.house{grid-template-columns:1fr}.house em{grid-column:1;grid-row:auto;justify-self:start;margin-top:6px}}

/* уведомление о cookies */
.cookie{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:50;max-width:760px;margin:0 auto;display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;box-shadow:0 6px 24px rgba(24,33,43,.12);font-size:14px}
.cookie span{flex:1}
@media (max-width:520px){.cookie{flex-direction:column;align-items:stretch}}

/* отсчёт перед скачиванием */
.btn.wait{opacity:1;background:#E6EAEE;color:var(--ink);font-variant-numeric:tabular-nums;min-width:170px}
.thumbs button:disabled{opacity:.55;cursor:default}

/* шапка инструмента */
.hero{display:flex;gap:18px;align-items:flex-start;margin-bottom:6px}
.hero-ico{flex:none;width:64px;height:64px;border-radius:16px;background:var(--c,var(--ink));color:#fff;display:grid;place-items:center;margin-top:4px}
.hero-ico svg{width:38px;height:38px}
body:not(.tool) .hero-ico{display:none}
@media (max-width:520px){.hero{gap:12px}.hero-ico{width:48px;height:48px;border-radius:12px}.hero-ico svg{width:28px;height:28px}}

/* каталог инструментов */
.catalog{margin-top:40px}
body.home .catalog{margin-top:18px}
.catalog-title{font-size:22px;font-weight:600;margin:0 0 14px}
body.home .catalog-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.finder{display:none;margin-bottom:18px}
body.home .finder{display:block}
.finder input{width:100%;font:inherit;font-size:17px;padding:13px 16px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.finder input:focus{outline:none;border-color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chip{font:inherit;font-size:14px;padding:7px 13px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.group{margin-bottom:22px}
.group h3{font-size:14px;font-weight:600;color:var(--muted);margin:0 0 10px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.card{display:flex;gap:12px;align-items:flex-start;text-decoration:none;background:var(--sheet);border:1.5px solid var(--line);border-radius:12px;padding:13px;transition:border-color .15s,transform .15s}
.card:hover{border-color:var(--c)}
.card[aria-current="page"]{border-color:var(--c);box-shadow:inset 0 0 0 1px var(--c)}
.ico{flex:none;width:42px;height:42px;border-radius:11px;background:var(--c);color:#fff;display:grid;place-items:center}
.ico svg{width:25px;height:25px}
.card-txt b{display:block;font-weight:600;font-size:16px;line-height:1.25}
.card-txt span{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:3px}
.empty{color:var(--muted)}
@media (max-width:860px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cards{grid-template-columns:1fr}.card{padding:11px}}

/* сборка нескольких файлов */
.stage{margin-top:16px;background:var(--sheet);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.stage-list{list-style:none;margin:0;padding:0;counter-reset:n}
.stage-list li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #EDF0F2;counter-increment:n}
.stage-list li:last-child{border-bottom:0}
.stage-list li::before{content:counter(n);width:26px;height:26px;border-radius:50%;background:#EEF1F3;display:grid;place-items:center;font-size:13px;font-weight:600;flex:none}
.stage-list .nm{flex:1;min-width:0;overflow-wrap:anywhere;font-size:15px}
.stage-list .sz{color:var(--muted);font-size:13px;white-space:nowrap}
.stage-list img{width:34px;height:44px;object-fit:cover;border-radius:3px;border:1px solid var(--line);flex:none}
.mini{font:inherit;width:34px;height:34px;border:1px solid var(--line);background:#fff;border-radius:8px;cursor:pointer;color:var(--ink);display:grid;place-items:center;padding:0;flex:none}
.mini:hover{border-color:var(--ink)}
.mini:disabled{opacity:.35;cursor:default}
.mini svg{width:18px;height:18px}

/* упорядочивание страниц */
.organizer{margin-top:16px}
.org-hint{color:var(--muted);font-size:14px;margin:0 0 10px}
.org-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px}
.pg{background:var(--sheet);border:1.5px solid var(--line);border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:6px;cursor:grab;user-select:none}
.pg.drag{opacity:.4}
.pg.over{border-color:var(--fmt)}
.pg .thumb{height:150px;display:grid;place-items:center;background:#F4F6F8;border-radius:6px;overflow:hidden}
.pg .thumb img{max-width:100%;max-height:100%;box-shadow:0 1px 3px rgba(24,33,43,.18);transition:transform .2s}
.pg .num{font-size:12px;color:var(--muted);text-align:center}
.pg .acts{display:flex;justify-content:center;gap:4px}
.pg .acts .mini{width:28px;height:28px;border-radius:6px}
.pg .acts .mini svg{width:15px;height:15px}

/* лимит сессии и платный доступ */
.pro{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;background:#F5F3FF;border:1px solid #DDD6FE;border-radius:12px;padding:12px 16px;margin:14px 0 18px}
.pro-badge{flex:none;font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:#fff;background:#6D28D9;border-radius:999px;padding:4px 10px}
.pro-txt{flex:1 1 260px;min-width:0}
.pro-txt b{display:block;font-weight:600;font-size:15px}
.pro-txt span{display:block;font-size:13px;color:var(--muted)}
.quota{flex:none;font-size:14px;color:var(--ink);background:#fff;border:1px solid #DDD6FE;border-radius:8px;padding:6px 10px;font-variant-numeric:tabular-nums}
.quota.low{border-color:#F59E0B;background:#FFFBEB}
.quota.out{border-color:var(--err);background:#FEF2F2;color:var(--err)}
.pro.hit{animation:hit .9s ease-in-out 2;border-color:#6D28D9}
@keyframes hit{50%{box-shadow:0 0 0 4px rgba(109,40,217,.25)}}
@media (prefers-reduced-motion:reduce){.pro.hit{animation:none;box-shadow:0 0 0 3px rgba(109,40,217,.3)}}

/* пояснения к инструменту */
.notice{flex-basis:100%;font-size:14px;line-height:1.45;background:#FFFBEB;border:1px solid #FDE68A;border-radius:8px;padding:10px 12px;color:#5C4A00}
.notice a,.scan-link{color:#1D4ED8;font-weight:600}