:root{--orange:#f97316;--dark:#111827;--gray:#6b7280;--line:#d1d5db}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f3f4f6;color:var(--dark)}
.wrap{max-width:1100px;margin:0 auto;padding:18px}
.card{background:#fff;border-radius:18px;box-shadow:0 8px 28px rgba(0,0,0,.08);overflow:hidden}
.header{background:linear-gradient(90deg,#ff7a00,#ff9d2e);color:#fff;padding:22px}
.header h1{margin:0;font-size:28px;font-weight:900}
.header p{margin:6px 0 0;opacity:.95}
.form{padding:22px;display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.field{grid-column:span 4}
.field.w2{grid-column:span 2}
.field.w3{grid-column:span 3}
.field.w6{grid-column:span 6}
.field.w8{grid-column:span 8}
.field.w12{grid-column:span 12}
label{font-weight:800;font-size:13px;display:block;margin-bottom:6px}
input,textarea{width:100%;border:1px solid #cbd5e1;border-radius:12px;padding:12px;font-size:16px;outline:none;background:#fff}
textarea{min-height:95px;resize:vertical}
.actions{padding:18px 22px;border-top:1px solid #e5e7eb;display:grid;grid-template-columns:1fr 1fr;gap:12px}
button{border:0;border-radius:14px;padding:15px 18px;font-size:17px;font-weight:900;cursor:pointer}
.btn-green{background:#16a34a;color:#fff}
.btn-dark{background:#111827;color:#fff}
.btn-orange{background:#f97316;color:#fff}
.preview{max-width:240px;border:1px solid #cbd5e1;border-radius:12px;margin-top:8px}
.sigbox{border:1px solid #cbd5e1;border-radius:12px;height:130px;background:#fff;touch-action:none;width:100%}
.note{background:#fff7ed;border:1px solid #fed7aa;border-radius:14px;padding:12px;color:#7c2d12;font-weight:700}
@media(max-width:800px){.field,.field.w2,.field.w3,.field.w6,.field.w8,.field.w12{grid-column:span 12}.actions{grid-template-columns:1fr}.header h1{font-size:22px}}