.tw-sg-app{max-width:1200px;margin:0 auto;padding-top:20px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#1a1a2e}
.tw-sg-card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden}
.tw-sg-header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;border-bottom:1px solid #e5e7eb;flex-wrap:wrap;gap:8px}
.tw-sg-tabs{display:flex;gap:4px;flex-wrap:wrap}
.tw-sg-tab{padding:6px 14px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;cursor:pointer;font-size:13px;color:#6b7280;transition:all .2s}
.tw-sg-tab:hover{background:#56aea4;color:#fff;border-color:#56aea4}
.tw-sg-tab.active{background:#56aea4;color:#fff;border-color:#56aea4}
.tw-sg-actions{display:flex;gap:8px}
.tw-sg-btn{display:flex;align-items:center;gap:5px;padding:6px 14px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;cursor:pointer;font-size:13px;color:#6b7280;transition:all .2s}
.tw-sg-btn:hover{background:#56aea4;color:#fff;border-color:#56aea4}
.tw-sg-body{display:grid;grid-template-columns:1fr 1fr;min-height:400px}
.tw-sg-form{padding:20px;border-right:1px solid #e5e7eb;overflow-y:auto;max-height:600px}
.tw-sg-preview{padding:20px;background:#f8fafc;overflow-y:auto;max-height:600px}
.tw-sg-preview-label{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.tw-sg-code{background:#1a1a2e;color:#e2e8f0;padding:16px;border-radius:8px;font-size:13px;line-height:1.6;overflow-x:auto;white-space:pre;margin:0;min-height:300px}
.tw-sg-code .key{color:#7dd3fc}
.tw-sg-code .str{color:#86efac}
.tw-sg-code .num{color:#fbbf24}
.tw-sg-code .bool{color:#f472b6}
.tw-sg-field{margin-bottom:12px}
.tw-sg-field label{display:block;font-size:12px;font-weight:600;color:#6b7280;margin-bottom:4px}
.tw-sg-field input,.tw-sg-field textarea,.tw-sg-field select{width:100%;padding:8px 12px;border:1px solid #e5e7eb;border-radius:6px;font-size:14px;color:#1a1a2e;transition:border-color .2s;box-sizing:border-box;font-family:inherit}
.tw-sg-field input:focus,.tw-sg-field textarea:focus,.tw-sg-field select:focus{outline:none;border-color:#56aea4}
.tw-sg-field textarea{resize:vertical}
.tw-sg-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tw-sg-btn-add{display:block;width:100%;padding:8px;border:1px dashed #56aea4;border-radius:6px;background:#f0fdf8;color:#56aea4;cursor:pointer;font-size:13px;font-weight:600;margin-top:8px;transition:all .2s}
.tw-sg-btn-add:hover{background:#56aea4;color:#fff}
.tw-sg-faq-item,.tw-sg-step-item,.tw-sg-breadcrumb-item{padding:12px;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:8px;position:relative}
.tw-sg-remove{position:absolute;top:8px;right:8px;width:24px;height:24px;border:none;background:#fee2e2;color:#dc2626;border-radius:50%;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center}
.tw-sg-remove:hover{background:#dc2626;color:#fff}
.tw-sg-toggle-wrap{margin-top:16px}
.tw-sg-toggle-btn{width:100%;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:#fff;border:1px solid #56aea4;border-radius:10px;cursor:pointer;transition:background .2s}
.tw-sg-toggle-btn:hover{background:#f0fdf8}
.tw-sg-h2{font-size:14px;font-weight:600;color:#56aea4;margin:0}
.tw-sg-chevron{color:#56aea4;transition:transform .3s}
.tw-sg-chevron.open{transform:rotate(180deg)}
.tw-sg-article-content{padding:24px;background:#fff;border:1px solid #e5e7eb;border-top:0;border-radius:0 0 10px 10px}
@media(max-width:880px){
  .tw-sg-body{grid-template-columns:1fr}
  .tw-sg-form{border-right:none;border-bottom:1px solid #e5e7eb;max-height:none}
  .tw-sg-preview{max-height:none}
}
@media(max-width:500px){
  .tw-sg-header{flex-direction:column;align-items:flex-start}
  .tw-sg-row2{grid-template-columns:1fr}
}