.embed-intro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}.embed-step{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px 20px;text-align:left}.embed-step .es-num{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;background:var(--brand-600);color:#fff;font-weight:700;font-family:'Poppins',sans-serif;margin-bottom:12px}.embed-step h3{margin:0 0 6px;font-size:1.05rem}.embed-step p{margin:0;color:var(--text-2);font-size:.94rem;line-height:1.5}.embed-controls{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end;justify-content:center;margin:6px auto 30px;max-width:760px}.embed-ctl{display:flex;flex-direction:column;gap:6px}.embed-ctl label{font-size:.82rem;font-weight:600;color:var(--text-2)}.embed-ctl input{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:12px;padding:10px 14px;font-size:.95rem;min-width:240px}.embed-ctl input:focus{outline:2px solid var(--brand-600);outline-offset:1px}.seg{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:4px}.seg button{border:0;background:transparent;color:var(--text-2);font-weight:600;font-size:.9rem;padding:8px 16px;border-radius:9px;cursor:pointer;font-family:inherit}.seg button.is-active{background:var(--brand-600);color:#fff}.banner-cat{margin-top:36px}.banner-cat > h3{font-size:1.15rem;margin:0 0 4px;display:flex;align-items:center;gap:10px}.banner-cat > p{color:var(--text-2);margin:0 0 18px;font-size:.92rem}.banner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;align-items:start}.banner-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}.bc-preview{padding:18px;display:flex;align-items:center;justify-content:center;min-height:150px;background: linear-gradient(45deg,#0000 25%,rgba(128,128,128,.06) 0 50%,#0000 0 75%,rgba(128,128,128,.06) 0) 0/22px 22px}.bc-preview img{max-width:100%;height:auto;box-shadow:0 6px 22px rgba(20,24,32,.10);border-radius:4px}.bc-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-top:1px solid var(--border)}.bc-meta .bc-name{font-weight:700;font-size:.95rem}.bc-meta .bc-dim{color:var(--text-2);font-size:.8rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.bc-actions{display:flex;gap:8px;padding:0 16px 16px}.bc-actions .btn{flex:1;justify-content:center;padding:10px 12px;font-size:.9rem}.btn-copy{background:var(--brand-600);color:#fff;border:0;border-radius:11px;cursor:pointer;font-family:inherit;font-weight:600;display:inline-flex;align-items:center;gap:7px}.btn-copy.copied{background:#12a150}.btn-dl{border:1px solid var(--border);background:transparent;color:var(--text);border-radius:11px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:600}.bc-actions svg{width:15px;height:15px}.bc-code{margin:0 16px 16px;display:none}.bc-code.open{display:block}.bc-code pre{margin:0;background:var(--code-bg,#0d1117);color:#c9d1d9;border-radius:12px;padding:14px;font-size:.72rem;line-height:1.55;overflow:auto;white-space:pre;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.bc-toggle-code{background:none;border:0;color:var(--brand-600);font-weight:600;font-size:.82rem;cursor:pointer;padding:0 16px 14px;text-align:left;font-family:inherit}.widget-demo{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;margin-top:24px}.widget-stage{display:flex;align-items:center;justify-content:center;padding:30px;background:var(--surface);border:1px solid var(--border);border-radius:20px;min-height:220px}.widget-code-box{background:#0d1117;border-radius:16px;padding:18px;position:relative}.widget-code-box pre{margin:0;color:#c9d1d9;font-size:.8rem;line-height:1.6;overflow:auto;white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.widget-code-box .btn-copy{position:absolute;top:12px;right:12px;padding:8px 12px;font-size:.8rem}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}.rule-col{border:1px solid var(--border);border-radius:16px;padding:20px}.rule-col h4{margin:0 0 12px;display:flex;align-items:center;gap:8px}.rule-col ul{margin:0;padding-left:18px}.rule-col li{margin:7px 0;color:var(--text-2);line-height:1.5}.rule-do h4{color:#12a150}.rule-dont h4{color:#e5484d}.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:#141820;color:#fff;padding:12px 20px;border-radius:12px;font-weight:600;font-size:.92rem;box-shadow:0 10px 30px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:.28s;z-index:120}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}@media (max-width:820px){.embed-intro-grid{grid-template-columns:1fr}.widget-demo{grid-template-columns:minmax(0,1fr)}.widget-stage{padding:14px}.widget-stage > *{max-width:100%}.rules-grid{grid-template-columns:1fr}}
