@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght,SOFT,WONK@9..144,600,40,1;9..144,700,40,1&display=swap');
:root{--ink:#24342e;--muted:#637369;--cream:#f6f1e8;--paper:#fffdf8;--green:#256b50;--lime:#d2e97f;--line:#dcded2;--error:#9d3d36;--font:'DM Sans',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}.page{max-width:1180px;margin:auto;padding:0 48px}.site-header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{text-decoration:none;color:var(--ink);font:700 35px/1 'Fraunces',Georgia,serif;letter-spacing:-2px}.wordmark-dot{color:var(--green)}.header-note,.eyebrow,.section-kicker{font-size:12px;font-weight:700;letter-spacing:.18em}.header-note{color:var(--muted)}main{padding:84px 0 60px}.eyebrow{color:var(--green);display:flex;align-items:center;gap:10px}.spark{font-size:24px;line-height:0}h1{font:700 clamp(54px,7.5vw,103px)/1.02 'Fraunces',Georgia,serif;letter-spacing:-.055em;margin:27px 0 25px;max-width:950px}h1 em{font-style:normal;color:var(--green)}.intro{font-size:19px;line-height:1.55;color:var(--muted);max-width:620px;margin:0 0 56px}.converter{max-width:780px;background:var(--paper);border:1px solid #e8e9df;border-radius:28px;box-shadow:0 20px 55px rgba(35,58,40,.07);padding:42px}.card-heading{display:flex;align-items:center;gap:15px;margin-bottom:26px}.step-number{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:var(--lime);color:var(--ink);font-size:12px;font-weight:700}.card-heading h2{font:700 25px/1.2 'Fraunces',Georgia,serif;letter-spacing:-.025em;margin:0}.field-label{display:block;font-size:14px;font-weight:700;margin-bottom:11px}input{width:100%;height:60px;border:1px solid #ccd5ca;background:#fff;border-radius:12px;padding:0 18px;font:500 16px var(--font);color:var(--ink);outline:0;transition:border-color .18s,box-shadow .18s}input::placeholder{color:#9aa79c}input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(37,107,80,.13)}.field-hint{font-size:13px;line-height:1.5;color:var(--muted);margin:10px 0 24px}.convert-button{height:59px;width:100%;border:0;border-radius:12px;background:var(--green);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font:700 16px var(--font);cursor:pointer;transition:transform .15s,background .15s}.convert-button:hover{background:#1d5840;transform:translateY(-2px)}.convert-button:disabled{opacity:.65;cursor:wait;transform:none}.convert-button span:last-child{font-size:25px;font-weight:400}.divider{display:flex;align-items:center;gap:15px;margin:35px 0;color:var(--green);font-size:19px}.divider:before,.divider:after{content:"";height:1px;flex:1;background:var(--line)}.output-wrap{display:flex;gap:10px}.output-wrap input{flex:1;min-width:0;background:#f7f8f3}.copy-button{border:0;border-radius:12px;background:var(--lime);padding:0 20px;font:700 14px var(--font);color:var(--ink);cursor:pointer}.copy-button:disabled{background:#e9ece4;color:#8d988d;cursor:default}.status{min-height:22px;font-size:13px;line-height:1.5;color:var(--muted);margin:13px 0 0}.status.success{color:var(--green)}.status.error{color:var(--error)}.how-to{margin-top:95px}.section-kicker{color:var(--green)}.how-to h2{font:700 45px/1.1 'Fraunces',Georgia,serif;letter-spacing:-.04em;margin:15px 0 27px}.how-to ol{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:0;margin:0}.how-to li{border-top:1px solid var(--line);padding-top:19px;max-width:280px;line-height:1.5;color:#45574c}.how-to li span{display:block;font:700 21px 'Fraunces',Georgia,serif;color:var(--green);margin-bottom:9px}.notice{display:flex;gap:17px;max-width:780px;margin-top:80px;padding:25px;background:#e9eee3;border-radius:16px;color:#45574c}.notice-icon{display:grid;place-items:center;flex:none;width:25px;height:25px;border:1px solid var(--green);border-radius:50%;color:var(--green);font-weight:700}.notice p{margin:0;font-size:13px;line-height:1.6}.notice strong{color:var(--ink)}footer{border-top:1px solid var(--line);padding:28px 0 40px;color:var(--muted);font-size:13px}footer span{padding:0 8px}@media(max-width:700px){.page{padding:0 22px}.site-header{height:76px}.wordmark{font-size:30px}.header-note{font-size:10px;letter-spacing:.12em}main{padding:58px 0 45px}h1{font-size:clamp(46px,13vw,70px);margin-top:23px}.intro{font-size:16px;margin-bottom:36px}.converter{padding:24px;border-radius:21px}.card-heading{gap:10px}.card-heading h2{font-size:21px}input{height:56px;font-size:14px}.how-to{margin-top:72px}.how-to h2{font-size:37px}.how-to ol{grid-template-columns:1fr;gap:17px}.how-to li{max-width:none}.notice{margin-top:54px}.output-wrap{flex-direction:column}.copy-button{height:48px}}
