:root{--primary-50: #E8F4FD;--primary-100: #D1E9FC;--primary-200: #A3D3F9;--primary-300: #75BCF6;--primary-400: #4AA6F3;--primary-500: #3080E2;--primary-600: #2668BA;--primary-700: #1C5092;--primary-800: #13386A;--primary-900: #0A2042;--secondary-50: #FFF9E6;--secondary-100: #FFF3CC;--secondary-200: #FFE799;--secondary-300: #FFDB66;--secondary-400: #FFCF33;--secondary-500: #C5A900;--secondary-600: #9E8700;--secondary-700: #776500;--secondary-800: #504300;--secondary-900: #292200;--neutral-50: #F8F9FA;--neutral-100: #F1F3F4;--neutral-200: #E8EAED;--neutral-300: #DADCE0;--neutral-400: #BDC1C6;--neutral-500: #9AA0A6;--neutral-600: #80868B;--neutral-700: #5F6368;--neutral-800: #3C4043;--neutral-900: #202124}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,Helvetica,sans-serif;background:var(--primary-500);min-height:100vh;padding:20px;color:var(--neutral-800)}.container{max-width:1400px;margin:0 auto}header{text-align:center;margin-bottom:30px}header h1{font-size:2.2rem;font-weight:700;color:#dfcc01}.main-content{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:stretch}@media (max-width: 1024px){.main-content{grid-template-columns:1fr}}.form-section,.preview-section{background:#fff;border-radius:8px;padding:30px;box-shadow:0 4px 20px #0000001a}.form-section h2,.preview-section h2{color:var(--primary-500);margin-bottom:20px;font-size:1.5rem;font-weight:700;border-bottom:2px solid var(--primary-500);padding-bottom:10px}.form-group{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid var(--neutral-200)}.form-group:last-of-type{border-bottom:none}.form-group h3{color:var(--primary-700);margin-bottom:15px;font-size:1.1rem;font-weight:600}.input-group{margin-bottom:16px}.input-group label{display:block;margin-bottom:6px;font-weight:600;color:var(--neutral-700);font-size:.9rem}.input-group input[type=text],.input-group input[type=tel],.input-group input[type=url],.input-group textarea,.input-group select{width:100%;padding:12px 14px;border:1px solid var(--neutral-300);border-radius:4px;font-size:14px;font-family:inherit;transition:border-color .2s ease,box-shadow .2s ease;background:#fff}.input-group select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}.input-group input[type=text]:focus,.input-group input[type=tel]:focus,.input-group input[type=url]:focus,.input-group textarea:focus,.input-group select:focus{outline:none;border-color:var(--primary-500);box-shadow:0 0 0 3px var(--primary-100)}.input-group input[type=text]::placeholder,.input-group input[type=tel]::placeholder,.input-group input[type=url]::placeholder{color:var(--neutral-400)}.input-group small{display:block;margin-top:5px;color:var(--neutral-500);font-size:.85rem}.input-group textarea{resize:vertical;min-height:100px}.form-actions{display:flex;gap:12px;margin-top:24px}.btn-primary,.btn-secondary{padding:12px 24px;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;flex:1;text-transform:uppercase;letter-spacing:.5px}.btn-primary{background:var(--primary-500);color:#fff}.btn-primary:hover{background:var(--primary-600);box-shadow:0 4px 12px #3080e24d}.btn-primary:active{background:var(--primary-700)}.btn-secondary{background:var(--neutral-100);color:var(--neutral-700);border:1px solid var(--neutral-300)}.btn-secondary:hover{background:var(--neutral-200)}.btn-secondary:active{background:var(--neutral-300)}.preview-container{background:#fff;border:1px solid var(--neutral-200);border-radius:6px;padding:20px;min-height:300px;margin-bottom:20px}#replyPreviewContainer{min-height:80px}.preview-placeholder{text-align:center;color:var(--neutral-500);padding:50px 20px;font-style:italic}.preview-container table{background:#fff;border-radius:4px}.preview-actions{display:flex;gap:12px;margin-bottom:20px}.instructions{background:var(--secondary-50);border-left:4px solid var(--secondary-500);padding:16px 20px;border-radius:0 6px 6px 0;margin-top:20px}.instructions h3{color:var(--secondary-700);margin-bottom:12px;font-size:1rem;font-weight:600}.instructions ol{margin-left:20px;line-height:1.8}.instructions li{margin-bottom:6px;color:var(--neutral-700);font-size:.9rem}@media (max-width: 768px){header h1{font-size:1.8rem}.form-section,.preview-section{padding:20px}.form-actions,.preview-actions{flex-direction:column}}