*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:linear-gradient(135deg,gray,#a9a9a9);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px;color:#333}.container{background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;max-width:900px;width:100%;padding:30px;display:flex;flex-direction:column;min-height:80vh}header{text-align:center;margin-bottom:30px}header h1{color:#000;font-size:2.5rem;margin-bottom:10px}.subtitle{color:#666;font-size:1rem}main{flex:1;display:flex;flex-direction:column}.controls{display:flex;justify-content:flex-end;gap:12px;margin-bottom:20px}.reset-button{background:#e0e0e0;color:#333;border:none;padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .3s ease}.reset-button:hover{background:#d0d0d0;transform:translateY(-2px)}.reset-button:active{transform:translateY(0)}.copy-button{background:#fb7832;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d}.copy-button:hover{background:#e46520;transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.copy-button:active{transform:translateY(0)}.icon{width:20px;height:20px}.editor-container{flex:1;display:flex;flex-direction:column}.template-editor{flex:1;min-height:400px;padding:20px;border:2px solid #e0e0e0;border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.6;overflow-y:auto;transition:border-color .3s ease}.template-editor:focus-within{border-color:#fb7832;box-shadow:0 0 0 3px #fb78321a}.template-editor .section{margin-bottom:20px;padding:12px;background:#f8f9fa;border-left:4px solid #fb7832;border-radius:4px;transition:background .2s ease}.template-editor .section:hover{background:#f0f1f5}.template-editor .section-heading{margin-bottom:8px;color:#000;font-size:15px}.template-editor .section-content{font-weight:400;min-height:24px;color:#333;padding:8px 10px;background:#fff;border-radius:4px;border:1px solid #e0e0e0;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.template-editor .section-content:focus{border-color:#fb7832;box-shadow:0 0 0 2px #fb783226}.template-editor .section-content:empty:before{color:#999}.notification{position:fixed;bottom:30px;right:30px;background:#4caf50;color:#fff;padding:16px 24px;border-radius:8px;box-shadow:0 4px 12px #0003;font-weight:600;animation:slideIn .3s ease;z-index:1000}.notification.hidden{display:none}@keyframes slideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}footer{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #e0e0e0;color:#666;font-size:.9rem}@media(max-width:768px){body{padding:10px}.container{padding:20px;min-height:90vh}header h1{font-size:1.8rem}.subtitle{font-size:.9rem}.reset-button,.copy-button{flex:1;justify-content:center;padding:14px 20px}.template-editor{min-height:350px;font-size:13px;padding:15px}.notification{bottom:20px;right:20px;left:20px;text-align:center}}@media(max-width:480px){header h1{font-size:1.5rem}.copy-button{font-size:.9rem;padding:12px 16px}.template-editor{font-size:12px;min-height:300px}}
