.generator-main{padding-top:64px;background:#f8f9fc;min-height:100vh}.generator-hero{padding:64px 0 34px;background:#fff;border-bottom:1px solid #eceef3}.generator-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:22px;color:#9297a2;font-size:12px}.generator-breadcrumb a{color:#6366f1}.generator-breadcrumb i{font-style:normal;color:#c3c6ce}.generator-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px}.generator-heading small{color:#6366f1;font-size:10px;font-weight:800;letter-spacing:.16em}.generator-heading h1{margin:12px 0 10px;font-size:clamp(34px,4vw,48px);line-height:1.15;letter-spacing:-.04em}.generator-heading p{max-width:680px;margin:0;color:#6b7280;font-size:14px;line-height:1.75}.local-badge{display:flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid #dfe0ff;border-radius:99px;background:#f7f7ff;color:#5659db;font-size:11px;font-weight:700}.local-badge i{width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:#e8e8ff;font-style:normal;font-size:9px}.generator-workspace{padding:34px 0 92px}.generator-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);gap:18px;align-items:start}.generator-panel{border:1px solid #e6e8ee;border-radius:20px;background:#fff;box-shadow:0 5px 22px rgba(17,24,39,.035);overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 22px;border-bottom:1px solid #eceef3}.panel-head>div{display:flex;align-items:center;gap:11px}.panel-step{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#eeeeff;color:#5659db;font-size:10px;font-weight:800}.panel-head h2{margin:0;font-size:16px}.panel-head small{color:#9297a2;font-size:10px}.panel-body{padding:22px}.generator-form{display:grid;gap:17px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.generator-field{display:grid;gap:7px}.generator-field.full{grid-column:1/-1}.generator-field>span,.field-label{color:#3f4651;font-size:11px;font-weight:700}.generator-field>span em,.field-label em{color:#dc2626;font-style:normal}.generator-field input,.generator-field textarea,.generator-field select,.raw-editor{width:100%;border:1px solid #dfe2e9;border-radius:11px;background:#fff;color:#111827;outline:0;font:inherit;font-size:13px;transition:border-color .2s,box-shadow .2s}.generator-field input,.generator-field select{height:43px;padding:0 13px}.generator-field textarea{min-height:86px;padding:11px 13px;resize:vertical;line-height:1.65}.generator-field input:focus,.generator-field textarea:focus,.generator-field select:focus,.raw-editor:focus{border-color:#a5a7ff;box-shadow:0 0 0 3px rgba(99,102,241,.09)}.generator-field>small{color:#9297a2;font-size:9px;line-height:1.5}.template-block{display:grid;gap:9px}.template-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.template-button{min-height:58px;padding:11px 12px;border:1px solid #e3e5eb;border-radius:11px;background:#fff;color:#4b5260;cursor:pointer;text-align:left;font-size:11px;font-weight:700;transition:.2s}.template-button small{display:block;margin-top:4px;color:#9a9faa;font-size:8px;font-weight:400}.template-button:hover,.template-button.active{border-color:#9da0ff;background:#f7f7ff;color:#4f46e5}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 13px;border:1px solid #e5e7eb;border-radius:11px}.toggle-row span{display:grid;gap:3px;font-size:11px;font-weight:700}.toggle-row small{color:#9499a4;font-size:8px;font-weight:400}.toggle-row input{width:18px;height:18px;accent-color:#6366f1}.dynamic-list{display:grid;gap:9px}.dynamic-row{display:grid;grid-template-columns:1fr 1.4fr auto;gap:8px}.dynamic-row.faq-row{grid-template-columns:1fr}.dynamic-row input,.dynamic-row textarea{width:100%;border:1px solid #dfe2e9;border-radius:9px;padding:9px 10px;font:inherit;font-size:11px;outline:0}.dynamic-row textarea{min-height:58px;resize:vertical}.remove-row{width:34px;height:34px;border:1px solid #eceef3;border-radius:9px;background:#fff;color:#9ca3af;cursor:pointer}.remove-row:hover{border-color:#fecaca;background:#fff7f7;color:#dc2626}.add-row{justify-self:start;padding:8px 11px;border:1px dashed #cfd1dc;border-radius:9px;background:#fafaff;color:#5b5ee7;cursor:pointer;font-size:10px;font-weight:700}.form-actions{display:flex;gap:9px;padding-top:4px}.form-actions .primary-button{border:0;cursor:pointer}.ghost-button{min-height:42px;padding:0 16px;border:1px solid #e2e4ea;border-radius:99px;background:#fff;color:#4b5260;cursor:pointer;font-size:11px;font-weight:700}.ghost-button:hover{border-color:#bbbdfd;color:#4f46e5}.output-panel{position:sticky;top:82px}.output-toolbar{display:flex;gap:7px}.output-toolbar button{height:32px;padding:0 10px;border:1px solid #e3e5eb;border-radius:8px;background:#fff;color:#555d69;cursor:pointer;font-size:9px;font-weight:700}.output-toolbar button:hover:not(:disabled){border-color:#aaaefe;color:#4f46e5}.output-toolbar button:disabled{cursor:not-allowed;opacity:.4}.code-wrap{position:relative}.raw-editor{display:block;min-height:330px;padding:18px;border:0;border-radius:0;background:#111827;color:#dbe4f5;font:12px/1.75 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;resize:vertical;box-shadow:none}.raw-editor:focus{border:0;box-shadow:inset 0 0 0 2px #6366f1}.validation-area{display:grid;gap:8px;padding:16px 18px;border-top:1px solid #e6e8ee;background:#fafbfc}.validation-summary{display:flex;align-items:center;gap:8px;color:#59616e;font-size:10px;font-weight:700}.validation-summary i{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#eaf8f1;color:#059669;font-style:normal}.validation-summary.warning i{background:#fff5e4;color:#d97706}.validation-summary.error i{background:#feeeee;color:#dc2626}.validation-list{display:grid;gap:5px;margin:0;padding:0;list-style:none}.validation-list li{display:flex;gap:7px;color:#767d89;font-size:9px;line-height:1.55}.validation-list li::before{content:"•";color:#a4a8b2}.generator-note{display:flex;gap:10px;margin-top:18px;padding:15px;border:1px solid #e3e4ff;border-radius:13px;background:#f8f8ff;color:#646b78;font-size:10px;line-height:1.65}.generator-note i{width:22px;height:22px;flex:0 0 22px;display:grid;place-items:center;border-radius:7px;background:#e9e9ff;color:#5659db;font-style:normal;font-weight:800}.copy-toast{position:fixed;z-index:120;left:50%;bottom:28px;transform:translate(-50%,18px);padding:10px 16px;border-radius:99px;background:#111827;color:#fff;font-size:11px;opacity:0;pointer-events:none;transition:.25s}.copy-toast.show{opacity:1;transform:translate(-50%,0)}.generator-help{padding:72px 0;background:#fff;border-top:1px solid #eceef3}.generator-help .container{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}.generator-help h2{margin:14px 0;font-size:30px}.generator-help>div p,.generator-help .container>div>p{color:#6b7280;font-size:12px;line-height:1.75}.help-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.help-steps article{padding:20px;border:1px solid #e8e9ee;border-radius:14px}.help-steps span{color:#6366f1;font-size:9px;font-weight:800}.help-steps h3{margin:14px 0 7px;font-size:14px}.help-steps p{margin:0;color:#777e89;font-size:10px;line-height:1.6}
@media(max-width:900px){.generator-grid{grid-template-columns:1fr}.output-panel{position:static}.generator-heading{grid-template-columns:1fr}.local-badge{justify-self:start}.generator-help .container{grid-template-columns:1fr;gap:28px}}
@media(max-width:620px){.generator-main{padding-top:60px}.generator-hero{padding:42px 0 28px}.generator-heading h1{font-size:32px}.generator-workspace{padding:20px 0 64px}.panel-head{align-items:flex-start;padding:16px}.panel-head small{display:none}.panel-body{padding:16px}.field-row,.template-grid{grid-template-columns:1fr}.dynamic-row{grid-template-columns:1fr auto}.dynamic-row input:nth-child(2){grid-column:1/2}.form-actions{display:grid}.form-actions button{width:100%}.output-toolbar{flex-wrap:wrap}.raw-editor{min-height:280px}.generator-help{padding:56px 0}.help-steps{grid-template-columns:1fr}.generator-field.full{grid-column:auto}}

.dynamic-row>textarea{grid-column:1/-1}
.dynamic-row.faq-row{grid-template-columns:1fr auto}
.faq-row [data-faq-question]{grid-column:1;grid-row:1}
.faq-row .remove-row{grid-column:2;grid-row:1}
.faq-row [data-faq-answer]{grid-column:1/-1;grid-row:2}
.generator-field[hidden]{display:none!important}
.template-block{margin:0;padding:0;border:0}
