:root{--bg:#f8fafc;--white:#fff;--ink:#17233a;--sub:#65758d;--line:#e5eaf3;--blue:#5669d8;--teal:#18aa98;--shadow:0 20px 50px rgba(35,54,110,.075)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Bengali",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{max-width:100%}[hidden]{display:none!important}input:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9cacff;outline-offset:2px}.container{max-width:1180px;margin:auto;width:calc(100% - 44px)}.icon{width:20px;height:20px;vertical-align:middle;flex-shrink:0}.header{background:#ffffffee;backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.head-inner{min-height:77px;display:flex;align-items:center;gap:25px}.logo{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:850;letter-spacing:-1.1px}.logo b{color:var(--blue)}.logo-icon{height:42px;width:42px;display:grid;place-items:center;background:#172941;color:#8ce6da;border-radius:13px}.logo-icon .icon{width:28px;height:28px}.navigation{display:flex;gap:29px;margin-left:auto;align-items:center}.navigation a{font-size:13px;color:#657287;font-weight:700}.navigation a:hover{color:var(--blue)}.nav-actions{display:flex;align-items:center;gap:9px}.language{border:1px solid var(--line);background:#fff;border-radius:10px;font-size:12px;font-weight:800;padding:9px 12px;color:#475774}.top-button{background:#172941;color:#fff;padding:10px 16px;font-size:12px;font-weight:800;border-radius:11px}.menu{display:none;background:#fff;border:1px solid var(--line);border-radius:9px;padding:7px}.announcement{padding:8px 20px;background:#eaf7f4;text-align:center;font-size:12px;font-weight:700;color:#398b7c}.announcement:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#20bd9b;margin-right:9px}.hero{background:radial-gradient(circle at 8% 12%,#ecf0ff,transparent 40%),radial-gradient(circle at 93% 15%,#e7f9f1,transparent 31%),#fcfdff;padding:78px 0 94px}.hero-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}.eyebrow{display:inline-flex;align-items:center;gap:7px;color:#5366c2;background:#edf0ff;border-radius:90px;padding:8px 12px;font-size:11px;font-weight:850;letter-spacing:.065em;text-transform:uppercase}.hero h1{font-size:clamp(45px,5.3vw,70px);line-height:1.095;letter-spacing:-.063em;margin:22px 0 20px;font-weight:850}.hero h1 span{background:linear-gradient(110deg,#6370e4,#20aa9a);background-clip:text;-webkit-background-clip:text;color:transparent}.lead{max-width:520px;font-size:17px;color:#6f7d95;margin:0 0 31px;line-height:1.8}.buttons{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:14px 20px;font-size:13px;font-weight:800;border:1px solid transparent}.button.primary{background:#5868d7;color:#fff;box-shadow:0 12px 22px #5668d72c}.button.secondary{background:#fff;border-color:#dae2ee;color:#32435d}.button:hover{transform:translateY(-2px)}.checks{display:flex;gap:16px;margin-top:23px;flex-wrap:wrap}.checks span{font-size:12px;font-weight:750;color:#79879c}.checks .icon{width:15px;height:15px;color:#2baf99}.demo{position:relative;padding:13px 8px 22px 18px}.demo:before{content:"";position:absolute;inset:2% 2% 5%;transform:rotate(-5deg);border-radius:35px;background:linear-gradient(135deg,#e3eaff,#d9f5ee)}.demo-window{position:relative;overflow:hidden;background:#fff;border:1px solid #e8edf4;border-radius:22px;box-shadow:0 30px 70px #273c7528}.demo-top{height:56px;padding:0 20px;border-bottom:1px solid #ecf0f6;display:flex;align-items:center;justify-content:space-between}.dots{display:flex;gap:6px}.dots i{height:9px;width:9px;border-radius:50%;background:#d5dce7}.dots i:first-child{background:#e8a1a5}.dots i:nth-child(2){background:#f4ce81}.dots i:nth-child(3){background:#9bd5ba}.demo-top small{color:#8e9aae;font-weight:750;font-size:11px}.demo-content{padding:20px;background:#f7faff}.demo-content h3{margin:0 0 12px;font-size:13px;display:flex;justify-content:space-between}.demo-content h3 span{font-size:10px;color:#1f9d80;background:#e3f8ef;padding:5px 9px;border-radius:14px}.demo-frames{display:grid;grid-template-columns:1fr 1fr;gap:12px}.demo-frame{border:1px solid #e2e9f5;border-radius:13px;height:200px;overflow:hidden;position:relative;background:#dbe4f6}.demo-frame svg{width:100%;height:100%}.demo-frame.checker{background-color:#dfe5ed;background-image:linear-gradient(45deg,#fff 25%,transparent 25%),linear-gradient(-45deg,#fff 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#fff 75%),linear-gradient(-45deg,transparent 75%,#fff 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.demo-frame b{position:absolute;bottom:10px;left:9px;background:#fff;border-radius:6px;padding:4px 8px;color:#64738c;font-size:10px}.demo-bottom{display:flex;justify-content:space-between;margin-top:12px;gap:8px}.demo-bottom small{font-size:11px;color:#93a0b2}.demo-bottom strong{font-size:10px;border-radius:8px;padding:4px 8px;background:#dff7ed;color:#238c76}.floating{position:absolute;bottom:-10px;left:0;display:flex;align-items:center;gap:12px;border:1px solid #e7edf3;border-radius:12px;background:#fff;box-shadow:0 13px 22px #21345322;padding:11px 15px}.floating .icon{color:#22b19b}.floating strong{display:block;font-size:12px}.floating small{display:block;color:#8593ab;font-size:10px}.features-row{margin-top:-18px;position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-box{display:flex;align-items:center;gap:13px;border-radius:15px;background:#fff;border:1px solid var(--line);padding:18px;box-shadow:0 5px 20px #25385d08}.feature-box .icon{color:var(--blue)}.feature-box strong{display:block;font-size:13px}.feature-box small{display:block;font-size:10px;color:#9aa5b7}.section{padding:80px 0 20px;scroll-margin-top:85px}.section-header{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:26px}.kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:850;color:#6578d8}.section h2,.section-header h2{font-size:clamp(30px,3vw,40px);letter-spacing:-.045em;line-height:1.2;margin:10px 0 8px}.section-header p{color:#8592a5;margin:0;font-size:13px}.search-box{display:flex;align-items:center;gap:9px;min-width:290px;background:#fff;border:1px solid #dce4f0;border-radius:12px;padding:12px;color:#96a0b0}.search-box input{border:0;outline:0;width:100%;font-size:13px;color:#253752}.filters{display:flex;overflow:auto;gap:8px;margin:15px 0 19px;padding-bottom:9px}.filter-btn{flex-shrink:0;background:#fff;border:1px solid var(--line);color:#65748d;border-radius:9px;padding:9px 13px;font-size:12px;font-weight:800}.filter-btn.active{background:var(--blue);border-color:var(--blue);color:#fff}.tool-group{margin:26px 0 38px;scroll-margin-top:96px}.group-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}.group-title i{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#edf0ff;color:var(--blue)}.group-title h3{font-size:20px;letter-spacing:-.035em;margin:0}.group-title small{color:#9ba6ba;font-size:12px}.tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.tool-card{display:flex;align-items:flex-start;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 14px;min-height:130px;transition:all .18s}.tool-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#bfc8f9}.tile-icon{display:grid;place-items:center;border-radius:11px;width:40px;height:40px;flex-shrink:0;background:#eef0ff;color:#6070d9}.tool-card:nth-child(4n+2) .tile-icon{background:#e4f9f3;color:#1bab93}.tool-card:nth-child(4n+3) .tile-icon{background:#fff2e8;color:#e29a53}.tool-card:nth-child(4n+4) .tile-icon{background:#f3eafd;color:#a06cce}.tool-card h4{font-size:12.5px;margin:3px 0 6px;line-height:1.25;letter-spacing:-.015em}.tool-card p{font-size:10.5px;line-height:1.6;color:#8191a7;margin:0}.tools-counter{color:#8b98aa;font-size:11px;font-weight:750}.no-results{text-align:center;padding:40px;background:#fff;border-radius:20px;color:#8592a5}.dark-panel{margin:65px auto 75px;padding:45px 48px;border-radius:25px;background:#192b48;display:grid;grid-template-columns:1fr 1fr;gap:40px;color:#fff}.dark-panel h2{font-size:36px;line-height:1.22;letter-spacing:-.045em;margin:15px 0}.dark-panel p{color:#adc0d6;font-size:13px;line-height:1.9}.dark-steps{display:grid;align-content:center;gap:12px}.dark-steps div{padding:17px 19px;border-radius:13px;background:#ffffff0f;border:1px solid #ffffff20;display:flex;gap:12px;align-items:center}.dark-steps .icon{color:#75dacc}.dark-steps strong{display:block;font-size:13px}.dark-steps small{display:block;color:#a9bfd3;font-size:11px}.how{padding:10px 0 85px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.how-grid article{background:#fff;border:1px solid var(--line);border-radius:17px;padding:27px}.how-grid b{background:#e9edff;color:#586bd4;border-radius:11px;padding:10px 12px;font-size:14px}.how-grid h3{margin:22px 0 8px;font-size:17px}.how-grid p{font-size:12px;color:#8896aa;line-height:1.85}.footer{background:#fff;border-top:1px solid var(--line);padding:42px 0 23px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}.footer p{font-size:12px;color:#919eb0;max-width:330px}.footer-links{display:grid;gap:9px;align-content:start}.footer-links h4{font-size:12px;margin:4px 0}.footer-links a{font-size:12px;color:#78859b}.footer-links a:hover{color:var(--blue)}.footer-end{display:flex;justify-content:space-between;border-top:1px solid #edf0f5;margin-top:35px;padding-top:21px;color:#9aa7b8;font-size:11px;gap:16px}
.tool-head{background:linear-gradient(135deg,#f1f5ff,#fbfcff);padding:30px 0 31px}.breadcrumbs{display:flex;align-items:center;gap:9px;font-size:11px;color:#8693a8;margin:0 0 25px}.tool-title{display:flex;align-items:center;gap:17px}.tool-title-icon{width:61px;height:61px;display:grid;place-items:center;flex:none;border-radius:18px;background:#e5eaff;color:var(--blue)}.tool-title-icon .icon{width:29px;height:29px}.tool-title h1{font-size:clamp(28px,3.7vw,44px);line-height:1.18;letter-spacing:-.05em;margin:0 0 8px}.tool-title p{font-size:13px;color:#78869d;margin:0}.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.chips span{background:#fff;border:1px solid #e6eaf3;border-radius:30px;padding:6px 11px;color:#71809a;font-weight:750;font-size:10px}.workspace{display:grid;grid-template-columns:355px 1fr;align-items:start;gap:20px;margin:25px auto 32px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 6px 23px #23395c06}.controls-card,.preview-card{padding:23px}.card-title{font-size:17px;font-weight:830;letter-spacing:-.025em;margin:0 0 17px}.dropzone{cursor:pointer;min-height:155px;border:1.5px dashed #abbaf1;border-radius:14px;background:#f8faff;display:grid;place-items:center;text-align:center;padding:23px 13px}.dropzone:hover,.dropzone.drag{background:#eef2ff;border-color:#5b6cdb}.dropzone input{position:absolute;width:1px;height:1px;opacity:0}.dropzone .upload-icon{height:45px;width:45px;border-radius:12px;background:#e8edff;color:var(--blue);display:grid;place-items:center;margin:auto auto 10px}.dropzone strong{font-size:12px;display:block;color:#4a5872}.dropzone small{font-size:11px;color:#a1aabd;display:block;margin-top:4px}.upload-meta{display:flex;justify-content:space-between;align-items:center;margin:8px 0 0;gap:8px}.upload-meta span{font-size:10px;color:#8998ac;overflow-wrap:anywhere}.upload-meta button{background:none;border:0;color:var(--blue);font-size:11px;font-weight:800}.separator{height:1px;background:#edf1f6;margin:20px 0}.setting-kicker{font-size:10px;letter-spacing:.12em;color:#9aa6ba;font-weight:850;text-transform:uppercase;margin-bottom:18px}.field{margin-bottom:17px}.field label{font-size:12px;font-weight:800;color:#4d5d75;display:block;margin-bottom:8px}.control{width:100%;border:1px solid #dfe6f0;border-radius:10px;background:white;padding:10px 11px;color:#344560;font-size:12px;min-height:41px}.control:focus{border-color:#8a9ae9}.dual{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dual .field{min-width:0}.field small,.hint{display:block;font-size:11px;color:#9aa6b8;line-height:1.75;margin:8px 0}.slide-head{display:flex;justify-content:space-between;align-items:center}.slide-head label{margin:0}.slide-head span{font-size:11px;color:var(--blue);font-weight:850}.slider{width:100%;accent-color:var(--blue);margin-top:10px}.check-row{display:flex;align-items:center;gap:8px;font-size:12px;color:#65748a;font-weight:700;margin:-3px 0 17px}.check-row input{accent-color:var(--blue);width:16px;height:16px}.color-control{width:50px;height:42px;padding:2px;border:1px solid #e0e5f2;border-radius:9px}.notice{background:#f2f5ff;border:1px solid #e5ebfc;border-radius:11px;padding:13px;color:#687a95;font-size:12px;line-height:1.75}.run{border:0;border-radius:12px;background:var(--blue);color:white;font-weight:850;padding:14px;width:100%;font-size:13px}.run:not(:disabled):hover{background:#4556c2}.run:disabled{cursor:not-allowed;background:#c4ccdf}.status{color:#8998ad;font-size:11px;min-height:21px;margin:13px 0;overflow-wrap:anywhere}.status.error{color:#c2576a}.status.success{color:#159778}.privacy-hint{font-size:11px;color:#96a2b4;display:flex;gap:8px;margin-top:18px;line-height:1.65}.privacy-hint .icon{color:#2ba995}.preview-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.preview-title h2{font-size:16px;margin:0}.preview-title small{font-size:11px;color:#a1acbb}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pane-label{display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:#6e7b93;margin-bottom:8px}.pane-label span{color:#a1adbd}.preview-box{min-height:280px;display:flex;align-items:center;justify-content:center;border:1px solid #e4ebf4;border-radius:13px;background:#f1f4fa;overflow:hidden}.preview-box.checker{background-color:#e3e8ef;background-image:linear-gradient(45deg,#fff 25%,transparent 25%),linear-gradient(-45deg,#fff 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#fff 75%),linear-gradient(-45deg,transparent 75%,#fff 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0}.source-visual{min-height:280px;width:100%;display:flex;align-items:center;justify-content:center;position:relative;touch-action:none;cursor:crosshair}.preview-box img{display:block;max-width:100%;max-height:350px;width:auto;height:auto;object-fit:contain;user-select:none}.placeholder{color:#b1bed0;text-align:center;font-size:11px;padding:25px}.placeholder .icon{width:33px;height:33px;display:block;margin:0 auto 11px;color:#bcc7d8}.crop-outline{position:absolute;border:2px solid white;box-shadow:0 0 0 1px var(--blue);background:#596de022;pointer-events:none}.result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:20px}.result-grid div{padding:12px;background:#f6f8fb;border:1px solid #eaf0f6;border-radius:10px;min-width:0}.result-grid small{font-size:10px;color:#a2adbc;display:block;margin-bottom:6px}.result-grid strong{font-size:11px;color:#4b5a72;display:block;overflow-wrap:anywhere}.download{display:flex;justify-content:center;align-items:center;text-align:center;border:1px solid #30b39e;background:#e3faf2;color:#188972;font-weight:850;font-size:12px;border-radius:11px;padding:13px;margin-top:15px}.download:hover{background:#d2f5e9}.meta-table{border:1px solid var(--line);border-radius:12px;margin-top:16px;overflow:hidden}.meta-table div{padding:11px 13px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:9px;font-size:11px}.meta-table div:last-child{border:0}.meta-table span{color:#8996a9}.meta-table strong{color:#4f5d73;overflow-wrap:anywhere}.swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:15px}.swatch{padding:7px;border:1px solid var(--line);border-radius:11px;background:#fff}.swatch i{display:block;height:57px;border-radius:7px}.swatch strong{display:block;margin-top:6px;font:700 11px monospace}.code-panel{margin-top:15px;background:#f6f8fd;border:1px solid var(--line);padding:15px;border-radius:12px}.code-panel strong{font-size:12px}.code-panel pre{font-size:11px;white-space:pre-wrap;word-break:break-word;line-height:1.7}.mini-btn{border:1px solid #dfe6fd;background:#edf0ff;color:var(--blue);border-radius:8px;padding:8px 12px;font-size:11px;font-weight:850;cursor:pointer}.codebox{width:100%;min-height:110px;resize:vertical;margin:10px 0;border:1px solid var(--line);border-radius:10px;padding:12px;font:11px/1.6 monospace;color:#465571}.more-info{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;margin-bottom:55px}.info-card{padding:24px}.info-card h2{font-size:21px;letter-spacing:-.035em;margin:0 0 13px}.info-card p{font-size:13px;color:#79889d;line-height:1.9}.info-card ul{font-size:12px;color:#6c7d94;line-height:2}.related h2{font-size:24px;margin:0 0 17px;letter-spacing:-.035em}.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.related a{display:flex;gap:12px;align-items:center;font-size:12px;font-weight:800;padding:17px;background:#fff;border:1px solid var(--line);border-radius:12px}.related a .icon{color:var(--blue)}.related a:hover{border-color:#b8c1f4}.article{max-width:850px;padding:45px 38px;margin:50px auto 80px}.article h1{font-size:40px;letter-spacing:-.05em}.article h2{font-size:23px;letter-spacing:-.04em;margin:30px 0 9px}.article p,.article li{font-size:14px;line-height:2;color:#728198}.article code{word-break:break-word}.not-found{text-align:center;padding:120px 20px}.not-found h1{font-size:80px;margin:0}#toast{position:fixed;bottom:28px;right:28px;padding:13px 20px;border-radius:12px;background:#1a2b48;color:#fff;font-size:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;z-index:100}#toast.visible{opacity:1;transform:none}
@media(max-width:1050px){.tool-grid{grid-template-columns:repeat(3,1fr)}.workspace{grid-template-columns:320px 1fr}.hero-inner{gap:25px}.features-row{grid-template-columns:repeat(2,1fr)}}@media(max-width:850px){.hero-inner,.dark-panel{grid-template-columns:1fr}.hero h1{max-width:660px}.demo{max-width:600px;width:100%;margin:auto}.tool-grid{grid-template-columns:repeat(2,1fr)}.workspace,.more-info{grid-template-columns:1fr}.related-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.container{width:calc(100% - 28px)}.head-inner{min-height:65px}.logo{font-size:21px}.logo-icon{height:36px;width:36px}.navigation{display:none;position:absolute;left:0;right:0;top:65px;background:#fff;border-bottom:1px solid var(--line);padding:20px;flex-direction:column;align-items:flex-start;gap:14px}.navigation.open{display:flex}.nav-actions{margin-left:auto}.menu{display:flex}.top-button{display:none}.hero{padding:51px 0 75px}.hero h1{font-size:45px}.lead{font-size:14px}.demo-frame{height:165px}.features-row{gap:9px}.feature-box{padding:12px 10px}.feature-box strong{font-size:11px}.feature-box small{font-size:9px}.section{padding:59px 0 12px}.section-header{display:block}.section-header h2{font-size:33px}.search-box{margin-top:20px;min-width:0;width:100%}.tool-grid{gap:10px}.tool-card{display:block;padding:14px 11px;min-height:140px}.tile-icon{height:34px;width:34px;margin-bottom:10px}.tool-card h4{font-size:12px}.tool-card p{font-size:10px}.group-title h3{font-size:18px}.dark-panel{padding:28px 24px;gap:12px}.dark-panel h2{font-size:29px}.how-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:23px}.footer-grid>div:first-child{grid-column:span 2}.footer-end{display:block}.footer-end span{display:block;margin-top:5px}.tool-title{gap:12px}.tool-title-icon{height:50px;width:50px;border-radius:13px}.tool-title-icon .icon{width:24px;height:24px}.tool-title h1{font-size:28px}.tool-title p{font-size:12px}.tool-head{padding:21px 0 24px}.workspace{gap:13px;margin:16px auto 25px}.controls-card,.preview-card{padding:16px}.comparison{grid-template-columns:1fr}.preview-box,.source-visual{min-height:240px}.result-grid{grid-template-columns:1fr 1fr}.related-grid{grid-template-columns:1fr 1fr}.related a{font-size:11px;padding:12px}.article{padding:23px}.article h1{font-size:32px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}