body{font-family:Arial,sans-serif;margin:0;padding:20px;background-color:#f5f5f5}.container{max-width:800px;margin:0 auto;background:#fff;padding:30px;border-radius:10px;box-shadow:0 2px 10px #0000001a}h4{color:#666;text-align:center;margin-bottom:30px}.logo{display:block;margin:0 auto 20px;width:150px}.input-section{margin-bottom:30px;text-align:center}.font-upload{margin:20px 0;padding:15px;border:2px dashed #ddd;border-radius:8px;background-color:#f9f9f9;transition:border-color .3s,background-color .3s;cursor:pointer}.font-upload:hover{border-color:#4caf50;background-color:#f0f8f0}.font-upload.drag-over{border-color:#4caf50;background-color:#e8f5e8;transform:scale(1.02)}.font-upload.drag-active{border-color:#2196f3;background-color:#e3f2fd}.font-upload label{display:block;margin-bottom:10px;color:#555;font-weight:700}#fontFile{margin-bottom:10px}#fontStatus{display:block;font-size:14px;color:#666;font-style:italic}.controls{margin:20px 0;display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}.controls label{display:flex;align-items:center;margin:0;font-size:14px}#fontSize{width:100px;margin:0 10px}#fontSizeValue{font-weight:700;color:#4caf50;min-width:40px}label{display:block;margin-bottom:10px;color:#555;font-weight:700}#textInput{width:300px;padding:12px;font-size:16px;border:2px solid #ddd;border-radius:5px;margin-right:10px;outline:none;transition:border-color .3s}#textInput:focus{border-color:#4caf50}.svg-container{text-align:center;margin-top:20px}#svgOutput{display:inline-block;margin:20px 0}.download-section{margin-top:20px}#downloadBtn{padding:10px 20px;font-size:14px;background-color:#2196f3;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}#downloadBtn:hover{background-color:#1976d2}.error{color:#d32f2f;font-style:italic}.loading{color:#4caf50;font-style:italic;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (max-width: 600px){.container{padding:20px}#textInput{width:250px;margin-bottom:10px;margin-right:0}.input-section{text-align:center}.controls{flex-direction:column;gap:15px}.controls label{justify-content:center}}
