.connectors-page{background:linear-gradient(#f8fbff 0%,#fff 380px),#fff}.connector-hero,.connector-guides,.connector-next-step{width:min(var(--max), calc(100% - 40px));margin:0 auto}.connector-hero{padding:clamp(58px,9vw,112px) 0 clamp(46px,8vw,82px)}.connector-hero h1{max-width:760px}.connector-hero>p:not(.eyebrow){max-width:720px;color:var(--ink-soft);margin:24px 0 0;font-size:clamp(1rem,1.38vw,1.14rem);line-height:1.72}.connector-summary{max-width:760px;color:var(--blue-deep);background:#eef6ff;border:1px solid #cfe3ff;border-radius:8px;align-items:center;gap:10px;margin-top:26px;padding:12px 14px;display:inline-flex}.connector-summary span{color:var(--ink-soft);font-size:.93rem;font-weight:600;line-height:1.45}.connector-guides{border-top:1px solid var(--line);max-width:820px;padding-top:8px}.guide-section{border-bottom:1px solid var(--line);padding:clamp(42px,7vw,72px) 0;scroll-margin-top:90px}.guide-copy h2,.connector-next-step h2{max-width:720px;color:var(--ink);margin:0;font-size:clamp(1.55rem,2.35vw,2.25rem);font-weight:600;line-height:1.16}.guide-copy>p:not(.eyebrow),.connector-next-step p{max-width:700px;color:var(--ink-soft);margin:16px 0 0;line-height:1.7}.guide-copy ul{gap:10px;margin:24px 0 0;padding:0;list-style:none;display:grid}.guide-copy li{color:var(--ink-soft);align-items:flex-start;gap:9px;font-size:.93rem;line-height:1.5;display:flex}.guide-copy li svg{color:var(--blue-deep);flex:none;margin-top:2px}.guide-code-stack{gap:22px;min-width:0;margin-top:26px;display:grid}.code-example{min-width:0;display:grid}.code-description{background:#fff;border:1px solid #d2d2d7;border-bottom:0;border-radius:8px 8px 0 0;gap:5px;min-width:0;padding:13px 16px 14px;display:grid}.code-description strong{color:#1d1d1f;font-size:.92rem;font-weight:700}.code-description p{color:#6e6e73;margin:0;font-size:.84rem;line-height:1.48}.code-window{color:#1d1d1f;background:#f2f2f7;border:1px solid #d2d2d7;border-radius:8px;min-width:0;overflow:hidden;box-shadow:0 8px 18px #1c20260f}.code-example-described .code-window{border-radius:0 0 8px 8px}.code-titlebar{color:#6e6e73;background:#f5f5f7;border-bottom:1px solid #d2d2d7;align-items:center;gap:7px;min-height:40px;padding:0 14px;font-size:.78rem;font-weight:650;display:flex}.code-titlebar span{margin-right:auto}.code-titlebar i{background:#d2d2d7;border-radius:50%;width:9px;height:9px}.code-window pre{margin:0;padding:18px 20px 20px;font-family:SF Mono,ui-monospace,Menlo,monospace;font-size:.84rem;line-height:1.66;overflow-x:auto}.code-window code{white-space:pre}.code-token-key,.code-token-global{color:#333}.code-token-string{color:#036a07}.code-token-boolean,.code-token-keyword{color:#0433ff}.code-token-comment{color:#007fff}.code-token-punctuation{color:#1d1d1f}.connector-next-step{background:#f8fbff;border:1px solid #cfe3ff;border-radius:8px;justify-content:space-between;align-items:center;gap:24px;max-width:820px;margin-top:clamp(48px,8vw,86px);margin-bottom:clamp(34px,6vw,64px);padding:clamp(24px,4vw,38px);display:flex}.connector-next-step a{color:#fff;background:linear-gradient(#24282f 0%,#05070a 100%);border-radius:8px;flex:none;align-items:center;gap:8px;min-height:44px;padding:0 15px;font-size:.92rem;font-weight:700;text-decoration:none;display:inline-flex}@media (width<=920px){.connector-guides,.connector-next-step{max-width:none}}@media (width<=620px){.connector-hero,.connector-guides,.connector-next-step{width:min(calc(100% - 28px), var(--max))}.connector-next-step{flex-direction:column;align-items:flex-start}.connector-next-step a{justify-content:center;width:100%}.code-window pre{font-size:.78rem}}.connector-hero-actions{margin-top:28px}.badge-generate-btn{color:var(--ink);border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:9px;align-items:center;gap:8px;padding:10px 16px;font:600 .92rem/1 inherit;transition:background .12s,border-color .12s;display:inline-flex}.badge-generate-btn svg{color:var(--blue)}.badge-generate-btn:hover{background:var(--panel);border-color:#cfd6e2}.badge-generate-btn:active{transform:translateY(.5px)}.badge-modal-backdrop{z-index:80;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#141c2c6b;justify-content:center;align-items:flex-start;padding:clamp(24px,8vh,96px) 20px;display:flex;position:fixed;inset:0;overflow-y:auto}.badge-modal{border:1px solid var(--line);background:#fff;border-radius:14px;width:min(520px,100%);padding:22px;box-shadow:0 24px 60px #0f224a47}.badge-modal-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.badge-modal-head h2{color:var(--ink);margin:0;font-size:1.12rem}.badge-close{width:30px;height:30px;color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;display:inline-flex}.badge-close:hover{color:var(--ink);background:var(--panel)}.badge-modal-sub{color:var(--ink-soft);margin:8px 0 18px;font-size:.92rem;line-height:1.6}.badge-field{margin-bottom:14px;display:block}.badge-field>span{color:var(--muted);margin-bottom:6px;font-size:.8rem;font-weight:600;display:block}.badge-field>input{width:100%;color:var(--ink);background:var(--canvas);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font:.92rem/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}.badge-field>input:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px #2f7bf629}.badge-preview{border:1px solid var(--line);background:linear-gradient(#f8fbff 0%,#fff 100%);border-radius:10px;justify-content:center;align-items:center;margin:4px 0 18px;padding:22px;display:flex}.badge-preview a{line-height:0;display:inline-flex}.badge-tabs{align-items:center;gap:6px;margin-bottom:10px;display:flex}.badge-tabs>button{color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:7px;padding:6px 12px;font:600 .82rem/1 inherit}.badge-tabs>button.active{color:var(--ink);background:var(--panel);border-color:var(--line)}.badge-tabs-spacer{flex:1}.badge-copy{align-items:center;gap:6px;display:inline-flex;color:var(--blue-deep)!important}.badge-output{width:100%;color:var(--ink);background:var(--panel);border:1px solid var(--line);resize:vertical;word-break:break-all;border-radius:9px;padding:12px;font:.82rem/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}.badge-output:focus{border-color:var(--blue);outline:none}.badge-hint{color:var(--muted);margin:12px 0 0;font-size:.78rem;line-height:1.55}.badge-hint code{background:var(--panel);border:1px solid var(--line);word-break:break-all;border-radius:5px;padding:1px 5px;font-size:.74rem}
