/* main container */ .app-container max-width: 1400px; margin: 0 auto;
/* form styles */ .form-panel padding: 1.8rem; /* main container */
button background: none; border: none; hr margin: 0.5rem 0; </style> </head> <body> <div class="app-container"> <div class="hero"> <h1> 📝 Http‑— <span>generate a post</span> </h1> <p>✍️ Fill the details & instantly generate a rich, ready-to-share blog post preview</p> </div> margin: 0 auto
<div class="input-group"> <label>📅 Date (optional)</label> <input type="date" id="postDate"> </div> button background: none
.post-category display: inline-block; background: #e2eaf1; padding: 0.2rem 0.9rem; border-radius: 40px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; color: #1e4a76; letter-spacing: 0.5px; margin-bottom: 0.8rem;
/* header section */ .hero text-align: center; margin-bottom: 2.5rem;