:root{--ink:#14213b;--text:#526078;--muted:#68768b;--blue:#2764ed;--pale:#edf4ff;--line:#e3e9f2;--bg:#f7f9fd;--radius:20px;--shadow:0 18px 55px -30px #334c822e;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);font-synthesis:none}
.nav-cta,.all-menu summary{white-space:nowrap}.navigation{flex-shrink:0}@media(max-width:380px){.topbar .logo{font-size:12px;gap:6px}.topbar .logo-mark{width:28px;height:28px}.topbar .nav-cta svg{display:none}.topbar .navigation{gap:10px}}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:white;font-size:15px;line-height:1.65}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #79a9ff;outline-offset:4px}[hidden]{display:none!important}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.2;letter-spacing:-.035em}p{color:var(--text)}svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.container{width:min(1160px,calc(100% - 48px));margin:auto}.skip-link{position:absolute;left:16px;top:-60px;z-index:99;background:#fff;padding:12px}.skip-link:focus{top:12px}
.topbar{position:sticky;top:0;z-index:30;background:#fffffff2;backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:750;letter-spacing:-.6px;white-space:nowrap}.logo-mark{display:grid;place-items:center;background:linear-gradient(135deg,#2869f2,#1649b9);color:white;width:36px;height:36px;border-radius:11px}.logo-mark svg{width:22px}.navigation{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:600;color:#526078}.navigation>a:hover,.foot-links a:hover{color:var(--blue)}.nav-cta,.btn-primary{display:inline-flex;justify-content:center;align-items:center;gap:9px;background:var(--blue);border:1px solid var(--blue);border-radius:11px;color:white;padding:12px 21px;font-weight:650;font-size:14px;line-height:1.4;box-shadow:0 5px 14px -8px #1547c2}.nav-cta:hover,.btn-primary:hover{background:#1852d3}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:11px;padding:12px 18px;font-size:14px;font-weight:600;line-height:1.4}.btn-secondary:hover{border-color:#acc4f2;background:#f8faff}.all-menu{position:relative}.all-menu summary{cursor:pointer;list-style:none;display:flex;gap:6px;align-items:center}.all-menu summary::-webkit-details-marker{display:none}.all-menu summary svg{width:14px;height:14px}.menu-panel{position:absolute;top:39px;right:-130px;width:620px;max-height:70vh;overflow:auto;background:#fff;box-shadow:0 15px 60px #152c5129;border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;z-index:50}.menu-panel h3{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#8190a5;margin-bottom:12px}.menu-panel a{font-size:12px;font-weight:500;display:block;padding:6px 0}.menu-panel a:hover{color:var(--blue)}
.hero{position:relative;padding:47px 0 28px;text-align:center;background:radial-gradient(ellipse at 50% 0,#e9f2ff99,transparent 68%)}.breadcrumb{display:flex;justify-content:center;gap:8px;font-size:11px;color:#6e7c92;margin-bottom:24px}.breadcrumb a:hover{color:var(--blue)}.eyebrow{display:inline-flex;align-items:center;gap:7px;border:1px solid #dce8fc;background:#f5f9ff;border-radius:30px;padding:5px 12px;color:#3166be;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}.eyebrow i{height:5px;width:5px;background:#367aec;border-radius:50%}h1{font-size:clamp(32px,4.2vw,51px);font-weight:760;max-width:850px;margin:0 auto 17px;line-height:1.14}h1 em{font-style:normal;color:var(--blue)}.hero .lead{font-size:16px;max-width:650px;margin:auto;line-height:1.75}.trust-row{display:flex;justify-content:center;flex-wrap:wrap;gap:22px;margin-top:21px;font-size:11px;color:#63738b}.trust-row span{display:flex;align-items:center;gap:6px}.trust-row svg{color:#3c8d78;width:14px;height:14px}
.workspace{width:min(950px,calc(100% - 48px));margin:10px auto 0;position:relative;scroll-margin-top:100px}.work-card{border:1px solid var(--line);border-radius:22px;padding:24px;background:white;box-shadow:var(--shadow)}.dropzone{position:relative;text-align:center;border:1.5px dashed #aac7f5;background:#f8fbff;border-radius:15px;padding:36px 20px 28px;transition:.2s;cursor:pointer}.dropzone:hover,.dropzone.over,.dropzone.drag-over{background:#eff5ff;border-color:var(--blue)}.upload-symbol{background:#e9f1ff;border:1px solid #dce8fb;color:var(--blue);height:59px;width:59px;display:grid;place-items:center;margin:0 auto 17px;border-radius:17px}.upload-symbol svg{width:26px;height:26px}.dropzone h2{font-size:20px;letter-spacing:-.5px;font-weight:680}.dropzone p{font-size:12px;margin:7px 0 18px;color:#708099}.dropzone .formats{display:flex;justify-content:center;gap:6px;align-items:center;margin-top:16px;font-size:10px;color:#7a899c}.format-tag{font-size:9px;line-height:1;border:1px solid #dce5f2;border-radius:5px;padding:5px 6px;background:#fff;color:#687b97;letter-spacing:.04em;font-weight:650}.upload-tip{display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;color:#8390a1;padding-top:16px}.upload-tip svg{width:12px;height:12px}.quick-targets{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:20px;font-size:11px;color:#6d7e98}.quick-targets button,.preset{padding:7px 12px;border:1px solid #dce5f0;background:#fff;color:#526078;border-radius:8px;font-size:11px;font-weight:650}.quick-targets button.active,.preset.active{border-color:#abc7fb;background:#eaf2ff;color:#245fcd}.result-panel{display:none}.result-panel.show{display:block}.file-row{display:flex;gap:16px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:22px}.file-row img{width:76px;height:76px;object-fit:contain;background:repeating-conic-gradient(#eef1f5 0 25%,white 0 50%) 0/14px 14px;border-radius:11px;border:1px solid var(--line)}.file-row .file-meta{min-width:0;flex:1}.filename{font-size:13px;font-weight:650;color:var(--ink);overflow-wrap:anywhere}.file-size{font-size:11px;color:var(--muted);margin-top:4px}.controls{background:#f8fafd;padding:18px;border:1px solid #e8edf5;border-radius:12px;margin-bottom:20px}.control-label{display:block;font-size:11px;font-weight:650;color:#526078;margin-bottom:8px}.control-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:5px}.field label{font-size:11px;color:#64748b}.field input,.field select{max-width:100%;height:42px;border:1px solid #d5dfec;border-radius:8px;padding:9px 12px;background:#fff;color:var(--ink);font-size:13px}.field input[type=number]{width:130px}.field input[type=color]{width:80px;padding:4px}.field select{min-width:130px}.wide-input{width:100%}input[type=range]{accent-color:var(--blue);width:100%}.range-row{display:flex;align-items:center;gap:16px}.range-row output{font-size:13px;font-weight:700;min-width:40px;color:var(--blue)}.control-note{font-size:11px;color:#7c889a;margin-top:9px;line-height:1.6}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.status{font-size:12px;margin-top:16px;min-height:20px;overflow-wrap:anywhere}.export-result{margin-top:23px;border:1px solid #cfe5dc;border-radius:14px;padding:19px;background:#f8fcfa}.export-top{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.export-top h3{font-size:15px;letter-spacing:-.3px}.export-stats{font-size:12px;margin:5px 0 14px}.export-result img{max-height:240px;max-width:100%;border-radius:10px;display:block;margin-bottom:16px;background:repeating-conic-gradient(#e5eaf0 0 25%,white 0 50%) 0/18px 18px}.help-line{font-size:11px;color:#7c899c;max-width:850px;margin:16px auto 0;text-align:center;padding:0 18px;line-height:1.7}
.section{padding:70px 0}.section.alt{background:#f8fafd;border-top:1px solid #f0f3f8;border-bottom:1px solid #f0f3f8}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:27px}.kicker{font-size:10px;color:#5482ca;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-bottom:9px}.section h2{font-size:28px;font-weight:720}.section-sub{font-size:13px;margin-top:9px;color:#77849a}.tool-count{font-size:11px;white-space:nowrap;color:#6e7f98;border:1px solid var(--line);border-radius:30px;padding:5px 11px}.filters{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:25px}.filter-buttons{display:flex;gap:5px;flex-wrap:wrap}.filter-buttons button{border:none;border-radius:8px;background:transparent;font-size:12px;padding:8px 13px;font-weight:600;color:#6c7d94}.filter-buttons button.active{background:#eaf1ff;color:#2460d1}.tool-search{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;padding:8px 12px;gap:7px;background:#fff}.tool-search svg{width:15px;height:15px;color:#8796ad}.tool-search input{border:none;outline:none!important;font-size:12px;max-width:165px;color:var(--ink);background:none}.tools-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.tool-card{border:1px solid var(--line);border-radius:15px;padding:21px;display:flex;flex-direction:column;gap:10px;transition:transform .2s,border-color .2s,box-shadow .2s;background:#fff;min-height:188px;position:relative}.tool-card:hover{border-color:#b6cdf7;transform:translateY(-3px);box-shadow:0 10px 24px -18px #234fa5}.tool-icon{height:39px;width:39px;border-radius:11px;background:var(--pale);color:#3170db;display:grid;place-items:center;margin-bottom:3px}.tool-icon.green{background:#edf9f4;color:#369577}.tool-icon.orange{background:#fff3e9;color:#c78439}.tool-icon.purple{background:#f4efff;color:#8c68c5}.tool-icon svg{width:20px;height:20px}.tool-card h3{font-size:13px;letter-spacing:-.2px;font-weight:680}.tool-card p{font-size:11px;line-height:1.65;color:#7c889c}.tool-arrow{margin-top:auto;color:#3372db;font-size:10px;font-weight:650;padding-top:5px}.card-badge{position:absolute;right:15px;top:21px;line-height:1;font-size:8px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;background:#f0f5ff;border:1px solid #e2ebfb;color:#5a80c4;padding:4px 6px;border-radius:5px}.no-results{padding:30px;text-align:center;color:var(--muted);font-size:13px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.step{padding:23px 22px;border:1px solid var(--line);border-radius:15px;background:#fff}.step-num{display:grid;place-items:center;border-radius:8px;width:29px;height:29px;font-size:11px;font-weight:750;background:#edf3ff;color:#3872d6;margin-bottom:17px}.step h3{font-size:15px;margin-bottom:9px}.step p{font-size:12px;line-height:1.8}.article-layout{display:grid;grid-template-columns:1.45fr 1fr;gap:70px;align-items:start}.article-copy h2{font-size:27px;margin-bottom:19px}.article-copy h3{font-size:17px;margin:28px 0 12px}.article-copy p{font-size:13px;line-height:1.95;margin-bottom:15px}.article-copy a,.faq a{color:#2764db;text-decoration:underline;text-underline-offset:3px}.specs{padding:25px;background:#f8fafd;border:1px solid var(--line);border-radius:16px}.specs h3{font-size:15px;margin-bottom:17px}.specs dl{margin:0}.spec-row{padding:11px 0;border-bottom:1px solid #e6ecf4;display:flex;justify-content:space-between;gap:16px;font-size:11px}.spec-row:last-child{border:none}.spec-row dt{color:#7a8698}.spec-row dd{margin:0;color:#394b67;text-align:right;font-weight:550}.spec-note{font-size:11px;line-height:1.8;padding:14px;margin-top:18px;background:white;border-radius:10px;color:#70819b}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:28px}.benefit{display:flex;gap:11px;align-items:start}.benefit>svg{color:#5d8ddd;background:#f0f5ff;border-radius:8px;padding:7px;width:35px;height:35px}.benefit h3{font-size:13px;margin-bottom:6px;letter-spacing:-.2px}.benefit p{font-size:11px;line-height:1.8}.faq-wrap{max-width:820px;margin:auto}.faq-wrap>h2{text-align:center;margin-bottom:30px}.faq details{border-bottom:1px solid var(--line);padding:19px 0}.faq summary{font-size:13px;font-weight:600;cursor:pointer;list-style:none;display:flex;gap:20px;justify-content:space-between}.faq summary:after{content:'+';font-size:17px;font-weight:400;color:#7892b8}.faq details[open] summary:after{content:'−'}.faq details p{font-size:12px;line-height:1.9;margin:13px 30px 0 0}.ready-bar{background:#f1f6ff;border:1px solid #dfebfe;border-radius:17px;padding:26px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.ready-bar h2{font-size:21px}.ready-bar p{font-size:12px;margin-top:7px}
.site-footer{background:#f8fafd;border-top:1px solid var(--line);padding:46px 0 21px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px}.footer-intro p{font-size:11px;line-height:1.9;max-width:250px;margin-top:12px;color:#8590a1}.footer-intro .logo{font-size:15px}.footer-intro .logo-mark{width:29px;height:29px;border-radius:8px}.footer-intro .logo-mark svg{width:18px}.foot-links h3{font-size:10px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px;color:#53657e}.foot-links a{font-size:11px;display:block;color:#7b899e;margin:7px 0}.foot-bottom{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:11px;color:#8b97a7}.foot-brand{font-size:13px;font-weight:700;color:#304764}.foot-legal{display:flex;gap:18px}.foot-legal a:hover{color:var(--blue)}.credits{font-size:10px;color:#8290a7;margin-top:22px}.credits summary{cursor:pointer}.credits p{margin-top:10px;line-height:1.8}.credits a{color:#4e78bc;text-decoration:underline}
.extended-guide{max-width:850px}.extended-guide>h2{margin-bottom:30px}.guide-part+ .guide-part{margin-top:27px}.guide-part h3{font-size:17px;font-weight:680;margin-bottom:11px;letter-spacing:-.25px}.guide-part p{font-size:13px;line-height:1.95;color:var(--text)}.guide-table-wrap{margin-top:32px;width:100%}.guide-table{width:100%;border-collapse:collapse;font-size:12px;text-align:left;table-layout:fixed}.guide-table caption{text-align:left;font-size:12px;font-weight:650;color:#526078;margin-bottom:12px}.guide-table th{background:#f2f6fc;color:#405573;font-weight:650}.guide-table th,.guide-table td{padding:14px 16px;border:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}.guide-table td{color:#65758d;line-height:1.8}.guide-table tbody tr:nth-child(even){background:#fafcff}@media(max-width:760px){.guide-part h3{font-size:16px}.guide-part p{font-size:12px;line-height:1.95}.guide-table{font-size:11px}.guide-table th,.guide-table td{padding:11px 10px}.extended-guide>h2{margin-bottom:25px}}
.crop-preview{margin:16px 0;position:relative;display:inline-block;max-width:100%;touch-action:none}.crop-preview canvas{max-width:100%;max-height:420px;display:block;object-fit:contain;border-radius:10px;border:1px solid var(--line)}.crop-frame{position:absolute;border:2px solid #fff;box-shadow:0 0 0 1px #2469ed,0 0 0 100vmax #0b172b80;pointer-events:none}.crop-viewport{overflow:hidden;border-radius:12px;display:inline-flex;max-width:100%}.bg-wrap{width:100%}.bg-pair{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin:20px 0}.bg-pair figure{margin:0}.bg-pair figcaption{font-size:11px;color:#62768f;font-weight:600;margin-bottom:9px}.bg-picture{height:300px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#f7f9fc;border:1px solid var(--line);border-radius:13px}.bg-picture img{max-width:100%;max-height:100%;object-fit:contain}.bg-picture img:not([src]){display:none}.bg-check{background:white repeating-conic-gradient(#e8edf4 0 25%,white 0 50%) 0/22px 22px}.bg-check span{font-size:11px;text-align:center;max-width:80%;background:#ffffffe0;color:#7c8b9e;padding:12px;border-radius:9px}.bg-actions{display:flex;gap:10px;flex-wrap:wrap}.bg-note{font-size:11px;line-height:1.8;color:#7d8da2;margin-top:16px}#bg-progress{accent-color:var(--blue);width:100%;height:7px;margin-top:20px}.badge-local{font-size:10px;color:#7e8ca2;display:flex;align-items:center;gap:6px;margin-left:auto}.badge-local svg{width:13px;height:13px}.batch-list{font-size:11px;max-height:160px;overflow:auto;margin-top:12px;color:#7e8ba0}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media(max-width:1000px){.tools-grid{grid-template-columns:repeat(3,1fr)}.article-layout{gap:35px}.navigation{gap:20px}.footer-grid{gap:24px}.menu-panel{right:-90px}}
@media(max-width:760px){.container{width:calc(100% - 32px)}.nav-inner{min-height:66px;gap:14px}.logo{font-size:15px;gap:8px}.logo-mark{width:32px;height:32px}.navigation{gap:15px}.navigation>.nav-link{display:none}.nav-cta{padding:9px 13px;font-size:11px}.menu-panel{position:fixed;top:66px;right:12px;left:12px;width:auto;grid-template-columns:repeat(2,1fr);gap:20px;max-height:calc(90vh - 80px);padding:22px}.all-menu summary{font-size:12px}.hero{padding:30px 0 22px}.breadcrumb{margin-bottom:22px;font-size:10px}.eyebrow{font-size:9px;margin-bottom:17px}.hero .lead{font-size:13px;max-width:520px}.trust-row{gap:15px;font-size:10px;margin-top:19px}.workspace{width:calc(100% - 32px);margin-top:5px}.work-card{padding:16px;border-radius:18px}.dropzone{padding:30px 15px 23px}.dropzone h2{font-size:18px}.dropzone p{font-size:11px}.upload-tip{font-size:9px}.tools-grid{grid-template-columns:repeat(2,1fr);gap:12px}.tool-card{padding:18px;min-height:180px}.tool-card h3{font-size:12px}.tool-card p{font-size:10px}.section{padding:47px 0}.section h2{font-size:24px}.section-heading{align-items:start;gap:12px}.section-sub{font-size:12px}.tool-count{font-size:10px}.filters{gap:14px}.tool-search{width:100%}.tool-search input{max-width:none;width:100%}.filter-buttons{gap:1px}.filter-buttons button{font-size:11px;padding:7px 11px}.steps{gap:13px}.step{padding:18px 16px}.step h3{font-size:13px}.step p{font-size:11px}.article-layout{grid-template-columns:1fr;gap:25px}.article-copy h2{font-size:24px}.article-copy p{font-size:12px}.specs{padding:22px}.benefits{grid-template-columns:1fr;gap:20px}.benefit p{font-size:12px}.ready-bar{padding:23px;flex-direction:column;align-items:start}.ready-bar h2{font-size:20px}.footer-grid{grid-template-columns:repeat(2,1fr);gap:30px 22px}.footer-intro{grid-column:1/-1}.footer-intro p{max-width:380px}.foot-bottom{flex-wrap:wrap;font-size:10px}.foot-legal{gap:15px}.bg-picture{height:220px}.bg-actions{gap:8px}.badge-local{margin-left:0}.bg-actions button{flex:1;min-width:120px}.controls{padding:15px}.file-row img{width:64px;height:64px}.filename{font-size:12px}}
@media(max-width:440px){.logo{font-size:13px}.navigation{gap:12px}.nav-cta{padding:8px 10px;font-size:10px}.nav-inner{gap:8px}.all-menu summary{font-size:11px}.trust-row{gap:11px;font-size:9px}.steps{grid-template-columns:1fr}.step{display:grid;grid-template-columns:30px 1fr;column-gap:13px}.step-num{grid-row:1/3;margin:0}.step p{grid-column:2}.step h3{margin-bottom:7px}.tool-card{min-height:178px;padding:16px}.tool-icon{width:35px;height:35px}.card-badge{right:12px;top:18px;font-size:7px}.bg-pair{grid-template-columns:1fr}.bg-picture{height:240px}.quick-targets{gap:5px}.quick-targets button{padding:7px 9px}.field input[type=number]{width:115px}.actions .btn-primary{width:100%}.actions .btn-secondary{width:100%}.foot-legal{font-size:10px}.menu-panel a{font-size:11px}}
