@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap";
:root{--ink:#18221c;--green:#245243;--paper:#f5f3ec;--card:#fffefa;--line:#dcded4;--lime:#ddf477;--muted:#687169}*{box-sizing:border-box}body{background:radial-gradient(circle at 80% 0,#e6f0d3 0,transparent 27%),var(--paper);color:var(--ink);margin:0;font-family:DM Sans,sans-serif}header{border-bottom:1px solid #dfe0d7;justify-content:space-between;align-items:center;max-width:1180px;height:72px;margin:auto;padding:0 18px;display:flex}header a{align-items:center;gap:9px;font-size:19px;display:flex}header a b{background:var(--ink);width:34px;height:34px;color:var(--lime);border-radius:10px;place-items:center;font:21px DM Serif Display;display:grid}header a strong{color:var(--green);font-weight:500}header>span{border:1px solid var(--line);background:#fff9;border-radius:30px;padding:8px 12px;font-size:12px}header i{background:#55a06d;border-radius:50%;width:7px;height:7px;margin-right:7px;display:inline-block}main{max-width:1060px;margin:auto;padding:70px 20px}.intro{text-align:center;max-width:760px;margin:auto}.tag{color:var(--green);text-transform:uppercase;letter-spacing:.1em;background:#e7edde;border-radius:30px;align-items:center;gap:7px;padding:7px 11px;font-size:11px;font-weight:700;display:inline-flex}.tag svg{width:14px}.intro h1{letter-spacing:-.03em;margin:23px 0 17px;font:400 clamp(50px,7vw,77px)/1 DM Serif Display}.intro h1 em{color:var(--green)}.intro p{color:var(--muted);margin:0 auto 43px;font-size:17px;line-height:1.7}.panel{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:0 25px 70px #25352a12}.tabs{background:#ecebe4;border-radius:12px;gap:5px;width:max-content;margin:0 auto 23px;padding:4px;display:flex}.tabs button{color:#626b64;cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:7px;padding:10px 17px;font:600 13px DM Sans;display:flex}.tabs button svg{width:17px}.tabs button.active{color:var(--ink);background:#fff;box-shadow:0 2px 8px #0001}.drop{cursor:pointer;background:#fafaf6;border:1.5px dashed #b9c1b7;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;height:195px;display:flex}.drop>svg{width:38px;height:38px;color:var(--green);background:#e6eee3;border-radius:12px;margin-bottom:12px;padding:8px}.drop strong{font-size:14px}.drop small{color:#8a928a;margin-top:5px}.fields{grid-template-columns:repeat(3,1fr);gap:13px;margin-top:18px;display:grid}.fields label{text-transform:uppercase;letter-spacing:.07em;font-size:11px;font-weight:700}.fields select{border:1px solid var(--line);width:100%;height:44px;color:var(--ink);background:#fbfbf7;border-radius:9px;margin-top:7px;padding:0 10px;display:block}.toggle{align-items:center;gap:8px;margin-top:16px;font-size:13px;display:flex}.run{background:var(--ink);color:#fff;border:0;border-radius:11px;justify-content:center;align-items:center;gap:8px;width:100%;height:50px;margin-top:20px;font:600 14px DM Sans;display:flex}.run:disabled{opacity:.4}.run svg{width:18px}.spin{animation:1s linear infinite spin}.error{color:#9b3029;background:#fff0ed;border-radius:9px;padding:11px 13px}.output{margin-top:55px}.done{align-items:center;gap:13px;display:flex}.done>svg{color:#479464;width:31px;height:31px}.done small{letter-spacing:.13em;color:#4f7962;font-size:10px;font-weight:700}.done h2{margin:2px 0;font:400 34px DM Serif Display}.pipeline{background:#e7eee3;border-radius:13px;align-items:center;gap:12px;margin:20px 0;padding:14px 17px;display:flex}.pipeline span{white-space:nowrap;font-size:11px;font-weight:600}.pipeline b{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:19px;height:19px;margin-right:6px;display:inline-grid}.pipeline i{background:#b8c8b8;flex:1;height:1px}.texts{grid-template-columns:1fr;display:grid}.texts.split{grid-template-columns:1fr 1fr}.texts article{background:var(--card);border:1px solid var(--line);min-height:330px}.texts article:first-child{border-radius:16px 0 0 16px}.texts article:last-child{border-radius:0 16px 16px 0}.texts article:only-child{border-radius:16px}.texts h3{border-bottom:1px solid var(--line);margin:0;padding:15px 18px;font-size:12px}.texts pre{white-space:pre-wrap;max-height:450px;margin:0;padding:18px;font:13px/1.7 DM Sans;overflow:auto}.downloads{background:var(--card);border:1px solid var(--line);border-radius:17px;margin-top:22px;padding:23px}.downloads h3{margin:0;font:400 25px DM Serif Display}.downloads p{color:var(--muted);margin:5px 0 18px;font-size:12px}.buttons{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.buttons a{border:1px solid var(--line);color:var(--ink);background:#fcfcf8;border-radius:11px;grid-template-columns:35px 1fr 18px;align-items:center;gap:9px;padding:12px;text-decoration:none;transition:all .2s;display:grid}.buttons a:hover{border-color:var(--green);transform:translateY(-1px)}.buttons a>svg:first-child{color:var(--green);width:24px}.buttons a>svg:last-child{color:#899088;width:16px}.buttons span{flex-direction:column;display:flex}.buttons b{font-size:12px}.buttons small{color:var(--muted);margin-top:2px;font-size:10px}.assurance{background:var(--green);color:#fff;border-radius:15px;align-items:center;gap:14px;margin-top:60px;padding:22px;display:flex}.assurance>svg{color:var(--lime)}.assurance div{flex-direction:column;display:flex}.assurance span{color:#c9d7ce;margin-top:4px;font-size:12px}footer{border-top:1px solid var(--line);color:#7e867e;max-width:1020px;margin:auto;padding:25px 0 35px;font-size:11px}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:720px){header>span{display:none}main{padding-top:50px}.intro h1{font-size:49px}.panel{padding:17px}.fields,.buttons,.texts.split{grid-template-columns:1fr}.pipeline{flex-direction:column;align-items:flex-start}.pipeline i{display:none}.texts article,.texts article:first-child,.texts article:last-child{border-radius:13px;margin-bottom:9px}.buttons a{padding:14px}footer{margin:0 20px}}.thumb-input::-webkit-slider-thumb{appearance:none;pointer-events:auto;cursor:pointer;background:#3b82f6;border:3px solid #fff;border-radius:50%;width:20px;height:20px;box-shadow:0 0 5px #0000004d}
