:root{--wa-green:#25d366;--wa-dark:#075e54;--wa-teal:#128c7e;--wa-light:#dcf8c6;--bg:#f0f2f5;--card:#fff;--text:#111b21;--muted:#667781;--border:#e0e0e0;--radius:10px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);justify-content:center;min-height:100vh;padding:2rem 1rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex}#app{flex-direction:column;gap:1.5rem;width:100%;max-width:480px;display:flex}header{text-align:center;flex-direction:column;align-items:center;gap:.5rem;display:flex}header .logo{width:64px;height:64px}header h1{color:var(--wa-dark);font-size:1.4rem;font-weight:700}header .tagline{color:var(--muted);font-size:.9rem}main{background:var(--card);border-radius:var(--radius);flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex;box-shadow:0 1px 3px #00000014}.form-group{flex-direction:column;gap:.4rem;display:flex}label{font-size:.85rem;font-weight:600}.optional{color:var(--muted);font-size:.8rem;font-weight:400}select,input,textarea{border:1.5px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--text);outline:none;padding:.6rem .75rem;font-family:inherit;font-size:.95rem;transition:border-color .15s}select:focus,input:focus,textarea:focus{border-color:var(--wa-teal)}select{cursor:pointer}.phone-input{align-items:center;gap:.5rem;display:flex}.dial-code{color:var(--wa-dark);text-align:center;background:var(--bg);border-radius:var(--radius);border:1.5px solid var(--border);min-width:3.5rem;padding:.6rem 0;font-size:.95rem;font-weight:600}.phone-input input{flex:1}.error{color:#d32f2f;margin-top:.2rem;font-size:.8rem}textarea{resize:vertical;min-height:70px}button{border-radius:var(--radius);cursor:pointer;border:none;padding:.7rem 1rem;font-family:inherit;font-size:.95rem;font-weight:600;transition:background .15s,transform .1s}button:active{transform:scale(.98)}#generate{background:var(--wa-green);color:#fff}#generate:hover{background:#20bd5a}.result{border-top:1px solid var(--border);flex-direction:column;gap:.6rem;padding-top:.5rem;display:flex}.link-box{background:var(--bg);border-radius:var(--radius);word-break:break-all;padding:.75rem}.link-box a{color:var(--wa-teal);font-size:.9rem;font-weight:500;text-decoration:none}.link-box a:hover{text-decoration:underline}.copy-btn{background:var(--wa-dark);color:#fff}.copy-btn:hover{background:#054c44}footer{text-align:center;color:var(--muted);font-size:.75rem}.content{background:var(--card);border-radius:var(--radius);flex-direction:column;gap:.7rem;padding:1.5rem;display:flex;box-shadow:0 1px 3px #00000014}.content h2{color:var(--wa-dark);font-size:1.05rem}.content h2:not(:first-child){margin-top:.9rem}.content ol{flex-direction:column;gap:.35rem;padding-left:1.25rem;font-size:.9rem;display:flex}.content p{font-size:.9rem;line-height:1.55}.content details{border-top:1px solid var(--border);padding:.65rem 0}.content details:last-of-type{border-bottom:1px solid var(--border)}.content summary{cursor:pointer;font-size:.9rem;font-weight:600}.content details p{color:var(--muted);margin-top:.5rem}
