.embed-page{max-width:1100px;margin:0 auto;padding:2rem 1.5rem 4rem}.embed-page .breadcrumb{font-size:.875rem;color:var(--text-muted, #64748b);margin-bottom:1.5rem}.embed-page .breadcrumb a{color:var(--primary, #2563eb);text-decoration:none}.embed-page .breadcrumb a:hover{text-decoration:underline}.embed-page .breadcrumb .sep{margin:0 .5rem;color:var(--border, #cbd5e1)}.embed-page .page-header{margin-bottom:2.5rem}.embed-page .page-header h1{font-size:2rem;font-weight:800;color:var(--text, #1e293b);margin:0 0 .5rem}.embed-page .page-header .subtitle{font-size:1.1rem;color:var(--text-muted, #64748b);margin:0;max-width:680px}.generator-layout{display:grid;grid-template-columns:320px 1fr;gap:2rem;margin-bottom:3rem}@media(max-width:768px){.generator-layout{grid-template-columns:1fr}}.controls-panel{background:var(--surface, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:12px;padding:1.5rem;height:fit-content}.control-group{margin-bottom:1.5rem}.control-group:last-child{margin-bottom:0}.control-group label{display:block;font-size:.875rem;font-weight:600;color:var(--text, #1e293b);margin-bottom:.5rem}.field-hint{font-size:.75rem;color:var(--text-muted, #94a3b8);margin:.25rem 0 0}.search-wrapper{position:relative}#store-search{width:100%;padding:.625rem .875rem;border:1px solid var(--border, #e2e8f0);border-radius:8px;font-size:.9375rem;background:var(--bg, #f8fafc);color:var(--text, #1e293b);outline:none;transition:border-color .15s;box-sizing:border-box}#store-search:focus{border-color:var(--primary, #2563eb);box-shadow:0 0 0 3px #2563eb1a}.store-dropdown{position:absolute;top:100%;left:0;right:0;max-height:240px;overflow-y:auto;background:var(--surface, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:8px;box-shadow:0 8px 24px #0000001f;display:none;z-index:50;margin-top:4px}.store-dropdown.open{display:block}.store-dropdown .dd-item{padding:.5rem .875rem;cursor:pointer;font-size:.875rem;color:var(--text, #1e293b);display:flex;justify-content:space-between;align-items:center}.store-dropdown .dd-item:hover,.store-dropdown .dd-item.highlighted{background:var(--hover, #f1f5f9)}.store-dropdown .dd-item .dd-cat{font-size:.75rem;color:var(--text-muted, #94a3b8)}.toggle-group{display:flex;gap:0;border:1px solid var(--border, #e2e8f0);border-radius:8px;overflow:hidden}.toggle-btn{flex:1;padding:.5rem .75rem;font-size:.8125rem;font-weight:500;border:none;background:var(--bg, #f8fafc);color:var(--text-muted, #64748b);cursor:pointer;transition:all .15s}.toggle-btn+.toggle-btn{border-left:1px solid var(--border, #e2e8f0)}.toggle-btn.active{background:var(--primary, #2563eb);color:#fff}.preview-panel{background:var(--surface, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:12px;padding:1.5rem}.preview-heading{font-size:1rem;font-weight:600;color:var(--text, #1e293b);margin:0 0 1rem}.widget-preview-container{min-height:180px;display:flex;align-items:center;justify-content:center}.placeholder-message{text-align:center;color:var(--text-muted, #94a3b8)}.placeholder-message svg{margin-bottom:.75rem;opacity:.5}.placeholder-message p{margin:0;font-size:.9375rem}.code-section{margin-bottom:3rem}.code-section.hidden{display:none}.code-section h2{font-size:1.25rem;font-weight:700;color:var(--text, #1e293b);margin:0 0 .5rem}.code-intro{color:var(--text-muted, #64748b);font-size:.9375rem;margin:0 0 1rem}.code-wrapper{position:relative;background:var(--code-bg, #1e293b);border-radius:10px;overflow:hidden}.copy-btn{position:absolute;top:.75rem;right:.75rem;display:flex;align-items:center;gap:.375rem;padding:.5rem .75rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e2e8f0;font-size:.8125rem;cursor:pointer;transition:background .15s}.copy-btn:hover{background:#fff3}.copy-btn.copied{background:#16a34a;border-color:#16a34a}.embed-code{padding:1.25rem;margin:0;font-size:.8125rem;line-height:1.6;color:#e2e8f0;white-space:pre-wrap;word-break:break-all;max-height:300px;overflow-y:auto}.how-it-works{margin-bottom:3rem}.how-it-works h2{font-size:1.25rem;font-weight:700;color:var(--text, #1e293b);margin:0 0 1.25rem}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}@media(max-width:640px){.steps-grid{grid-template-columns:1fr}}.step-card{background:var(--surface, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:10px;padding:1.25rem}.step-number{width:32px;height:32px;border-radius:50%;background:var(--primary, #2563eb);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;margin-bottom:.75rem}.step-card h3{font-size:1rem;font-weight:600;color:var(--text, #1e293b);margin:0 0 .375rem}.step-card p{font-size:.875rem;color:var(--text-muted, #64748b);margin:0;line-height:1.5}.faq-section{margin-bottom:3rem}.faq-section h2{font-size:1.25rem;font-weight:700;color:var(--text, #1e293b);margin:0 0 1rem}.faq-list details{border:1px solid var(--border, #e2e8f0);border-radius:8px;margin-bottom:.5rem;overflow:hidden}.faq-list summary{padding:.875rem 1rem;font-weight:500;color:var(--text, #1e293b);cursor:pointer;font-size:.9375rem}.faq-list summary:hover{background:var(--hover, #f8fafc)}.faq-list details[open] summary{border-bottom:1px solid var(--border, #e2e8f0)}.faq-list details p{padding:.875rem 1rem;margin:0;font-size:.875rem;color:var(--text-muted, #64748b);line-height:1.6}.faq-list code{background:var(--hover, #f1f5f9);padding:.125rem .375rem;border-radius:3px;font-size:.8125rem}.related-tools h2{font-size:1.25rem;font-weight:700;color:var(--text, #1e293b);margin:0 0 1rem}.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}@media(max-width:768px){.tools-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.tools-grid{grid-template-columns:1fr}}.tool-link{display:block;padding:1rem;background:var(--surface, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:10px;text-decoration:none;transition:border-color .15s,box-shadow .15s}.tool-link:hover{border-color:var(--primary, #2563eb);box-shadow:0 2px 8px #2563eb1a}.tool-link h3{font-size:.9375rem;font-weight:600;color:var(--primary, #2563eb);margin:0 0 .25rem}.tool-link p{font-size:.8125rem;color:var(--text-muted, #64748b);margin:0}[data-theme=dark] .embed-page .page-header h1,[data-theme=dark] .code-section h2,[data-theme=dark] .how-it-works h2,[data-theme=dark] .faq-section h2,[data-theme=dark] .related-tools h2,[data-theme=dark] .preview-heading,[data-theme=dark] .control-group label,[data-theme=dark] .step-card h3,[data-theme=dark] .faq-list summary{color:#f1f5f9}[data-theme=dark] .controls-panel,[data-theme=dark] .preview-panel,[data-theme=dark] .step-card,[data-theme=dark] .tool-link,[data-theme=dark] .faq-list details{background:#1e293b99;border-color:#64748b4d}[data-theme=dark] #store-search{background:#0f172a80;border-color:#64748b4d;color:#f1f5f9}[data-theme=dark] .store-dropdown{background:#1e293b;border-color:#64748b4d}[data-theme=dark] .store-dropdown .dd-item{color:#e2e8f0}[data-theme=dark] .store-dropdown .dd-item:hover{background:#33415580}[data-theme=dark] .toggle-btn{background:#0f172a80;color:#94a3b8;border-color:#64748b4d}[data-theme=dark] .toggle-btn+.toggle-btn{border-left-color:#64748b4d}[data-theme=dark] .toggle-group{border-color:#64748b4d}