#systemIntegrationDemo{--si-ink:#263e49;--si-muted:#697f88;--si-line:#dce5e8;--si-green:#21745f;background:#fff;color:var(--si-ink);font-family:'Inter',system-ui,sans-serif;font-size:14px;line-height:1.5;text-align:left}
#systemIntegrationDemo *{box-sizing:border-box}
#systemIntegrationDemo [hidden]{display:none!important}
#systemIntegrationDemo button,#systemIntegrationDemo input,#systemIntegrationDemo select{font:inherit}
#systemIntegrationDemo button{cursor:pointer}
#systemIntegrationDemo button:disabled{opacity:.5;cursor:default}
#systemIntegrationDemo :focus-visible{outline:2px solid #4d9782;outline-offset:3px}
.si-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 25px;background:#173e39;color:white}
.si-brand{display:flex;align-items:center;gap:11px;font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;letter-spacing:-.02em}
.si-mark{width:31px;height:31px;border:1px solid #8bc6ae;display:grid;place-items:center;border-radius:7px;color:#b8e7cb;font-size:19px}
.si-top-meta{display:flex;align-items:center;gap:18px;font-size:14px;color:#bbd4cd}
.si-sandbox{padding:3px 9px;border:1px solid #537b6f;border-radius:4px;color:#d1e5dd;font-size:14px}
.si-shell{display:grid;grid-template-columns:178px minmax(0,1fr);min-height:692px}
.si-nav{display:flex;flex-direction:column;background:#f4f7f6;border-right:1px solid var(--si-line);padding:26px 12px 18px}
.si-nav-label{font-size:14px;color:#85958f;letter-spacing:.12em;text-transform:uppercase;margin:0 12px 10px}
.si-nav button{display:flex;align-items:center;gap:9px;width:100%;background:transparent;border:0;border-radius:5px;color:#60766f;text-align:left;padding:11px 12px;margin:2px 0;font-size:14px!important}
.si-nav button svg{width:16px;height:16px;flex:none}
.si-nav button.is-active{background:#e2ece6;color:#244f3f;font-weight:600}
.si-nav-footer{margin-top:auto;padding:30px 12px 2px;color:#7d9086;font-size:14px}
.si-nav-footer strong{display:block;color:#4f6e5d;font-size:14px;font-weight:500;margin-bottom:4px}
.si-main{padding:28px 28px 24px;min-width:0}
.si-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:24px}
.si-heading h4{font-family:'Space Grotesk',sans-serif;font-size:25px;font-weight:600;letter-spacing:-.04em;line-height:1.25;color:#254438;margin:0 0 5px}
.si-heading p{font-size:14px;color:var(--si-muted);margin:0}
.si-source-name{display:flex;align-items:center;gap:7px;font-size:14px;color:#557e70}
.si-source-name::before,.si-online::before{content:'';display:inline-block;width:6px;height:6px;background:#3a9673;border-radius:50%;flex:none}
.si-primary,.si-secondary{border:1px solid #2c6553;border-radius:5px;padding:9px 15px;font-size:14px!important;font-weight:500!important;white-space:nowrap}
.si-primary{background:#2c6553;color:#fff}
.si-primary:hover{background:#23523f}
.si-secondary{background:#fff;color:#466c5b;border-color:#cfddd5}
.si-secondary:hover{background:#f2f7f4}
.si-link{padding:0;background:transparent;border:0;color:#286a56;font-size:14px!important;font-weight:500!important;text-align:left}
.si-filter{display:grid;grid-template-columns:1fr 1.15fr 1fr auto;align-items:end;gap:11px;margin-bottom:26px}
#systemIntegrationDemo label{display:grid;gap:7px;color:#617b70;font-size:14px;font-weight:500}
#systemIntegrationDemo select{width:100%;min-width:0;appearance:auto;border:1px solid #d1ded7;border-radius:5px;background:#fff;padding:9px 10px;color:#375949;font-size:14px}
.si-section-line{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;color:#70897c;font-size:14px}
.si-section-line strong{color:#3c5f4e;font-size:14px;font-weight:500}
.si-badge{display:inline-block;background:#eef3f0;color:#6b8172;font-size:14px;white-space:nowrap;padding:3px 7px;border-radius:4px}
.si-badge.new{background:#eaf3ed;color:#367455}
.si-badge.update{background:#fcf3df;color:#956a26}
.si-badge.error{background:#fbece7;color:#a45b43}
.si-table-scroll{overflow:auto;max-width:100%;border-top:1px solid var(--si-line);border-bottom:1px solid var(--si-line)}
.si-table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap;font-size:14px}
.si-table th{padding:11px 12px;background:#f8faf9;color:#7a9084;font-size:14px;letter-spacing:.015em;font-weight:500;border-bottom:1px solid var(--si-line)}
.si-table td{padding:14px 12px;color:#607b6a;border-bottom:1px solid #e8eeea;vertical-align:middle}
.si-table tr:last-child td{border-bottom:0}
.si-table td strong{display:block;color:#304d3d;font-size:14px;font-weight:500}
.si-table td small{display:block;font-family:'IBM Plex Mono',monospace;font-size:14px;color:#8a9d90;line-height:1.5;margin-top:4px}
.si-table .si-check{padding-left:3px;padding-right:2px;width:29px;text-align:center}
#systemIntegrationDemo input[type=checkbox]{accent-color:#3b7f5d;width:14px;height:14px;cursor:pointer;margin:0;vertical-align:middle}
.si-table .si-selected{background:#f8fbf8}
.si-syncbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px}
.si-sync-meta{font-size:14px;color:#405d4b}
.si-sync-meta small{display:block;color:#829586;font-size:14px;margin-top:4px}
.si-sync-actions{display:flex;align-items:center;gap:13px}
.si-toast{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;padding:12px 14px;margin:0 0 19px;background:#edf5ef;color:#35664a;border-left:2px solid #77a585;border-radius:0 4px 4px 0}
.si-toast.warn{background:#fcf5e9;color:#856632;border-color:#c5a45f}
.si-toast button{flex:none}
.si-destinations{display:flex;align-items:center;gap:7px;color:#778c80;font-size:14px}
.si-destinations span{display:inline-flex;align-items:center;gap:5px}
.si-destinations b{font-weight:400;margin:0 2px;color:#acb9af}
.si-online{display:inline-flex;align-items:center;gap:6px;color:#397457;font-size:14px;white-space:nowrap}
.si-online.offline{color:#a76650}
.si-online.offline::before{background:#c48462}
.si-view-switch{display:flex;align-items:center;gap:4px;border-bottom:1px solid var(--si-line);margin-bottom:22px}
.si-view-switch button{background:transparent;border:0;border-bottom:2px solid transparent;border-radius:0;padding:0 15px 12px;color:#7a8d80;font-size:14px!important}
.si-view-switch button:first-child{padding-left:0}
.si-view-switch button.is-active{color:#315d43;border-bottom-color:#4c8860;font-weight:500}
.si-resource{font-family:'IBM Plex Mono',monospace;font-size:14px;color:#6b8375;overflow-wrap:anywhere}
.si-empty{padding:58px 20px;text-align:center;color:#8a9c91;font-size:14px}
.si-empty strong{display:block;color:#526f5e;font-size:15px;margin-bottom:7px}
.si-records-table{min-width:800px}
.si-records-table td{font-size:14px}
.si-records-table .si-id{font-family:'IBM Plex Mono',monospace;font-size:14px}
.si-sheet .si-table th,.si-sheet .si-table td{border-right:1px solid #e2e8e2;padding:10px 12px}
.si-sheet .si-table th{color:#768579;background:#edf2ed;text-align:center;padding:5px 10px;font-size:14px}
.si-sheet .si-sheet-fields td{font-size:14px;color:#355f42;font-weight:500;background:#f4f8f3}
.si-sheet .si-table .si-rownum{background:#f5f7f4;color:#a0aca1;text-align:center;font-size:14px;width:34px}
.si-mapping-table{white-space:normal}
.si-mapping-table td{padding:18px 12px}
.si-mapping-table code{font-family:'IBM Plex Mono',monospace;color:#4e725c;font-size:14px}
.si-mapping-table td small{font-family:inherit;font-size:14px;display:inline;margin-left:8px}
.si-mapping-arrow{color:#a3b7a6}
.si-mapping-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:22px}
.si-mapping-footer small{font-size:14px;color:#829482}
.si-connections{display:grid;gap:0}
.si-connection{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:start;padding:25px 0;border-top:1px solid var(--si-line)}
.si-provider-icon{width:37px;height:39px;display:grid;place-items:center;color:#397a52;background:#edf4ed;border-radius:6px;font-size:18px}
.si-connection h5{color:#355b42;margin:0 0 5px;font-size:15px;font-weight:500}
.si-connection p{font-size:14px;color:#7e9584;margin:6px 0 11px}
.si-connection .si-resource{display:block;margin-top:6px}
.si-connection .si-secondary{margin-top:1px}
.si-history-table tr[data-si-run]{cursor:pointer}
.si-history-table tr[data-si-run]:hover{background:#f7faf7}
.si-history-table tr.is-active{background:#f1f7f1}
.si-run-detail{margin-top:26px;border-top:1px solid var(--si-line);padding-top:19px}
.si-run-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}
.si-run-heading h5{color:#365d44;font-weight:500;font-size:14px;margin:0}
.si-run-heading p{color:#879987;font-size:14px;margin:5px 0 0}
.si-outcomes{display:grid;grid-template-columns:1fr 1fr;gap:25px}
.si-outcome{padding-top:14px;border-top:1px solid #e3eae2}
.si-outcome-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#42694b;font-size:14px;margin-bottom:12px}
.si-counts{display:flex;gap:25px}
.si-counts strong{display:block;font-family:'Space Grotesk',sans-serif;font-weight:500;color:#33583d;font-size:21px;font-variant-numeric:tabular-nums;line-height:1.3}
.si-counts span{color:#899c89;font-size:14px}
.si-outcome p{font-size:14px;color:#a16d4d;margin:0}
.si-run-notes{font-size:14px;color:#859a87;margin-top:18px}
.si-meta-footer{font-size:14px;color:#8b9e8e;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:18px}
@media(min-width:1450px){.si-main{padding:32px 34px}.si-table td{padding-top:16px;padding-bottom:16px}.si-shell{min-height:715px}}
@media(max-width:1000px){.si-shell{grid-template-columns:150px minmax(0,1fr)}.si-main{padding:23px 20px}.si-nav{padding-left:6px;padding-right:6px}.si-nav button{font-size:14px!important;gap:7px;padding:10px}.si-nav-label{margin-left:10px}.si-filter{grid-template-columns:1fr 1fr}.si-filter .si-primary{align-self:end}.si-outcomes{gap:15px}.si-top-meta>span:first-child{display:none}.si-sync-actions{gap:8px}.si-sync-actions .si-link{display:none}}
@media(max-width:700px){.si-top{padding:15px 17px}.si-brand{font-size:16px}.si-top-meta{gap:8px}.si-shell{grid-template-columns:minmax(0,1fr);min-height:0}.si-nav{flex-direction:row;overflow:auto;padding:8px;border-right:0;border-bottom:1px solid var(--si-line);gap:2px}.si-nav button{width:auto;flex:none;gap:6px;white-space:nowrap;padding:8px 10px}.si-nav button svg{width:14px;height:14px}.si-nav-label,.si-nav-footer{display:none}.si-main{padding:22px 17px 23px;min-height:520px}.si-heading{margin-bottom:21px}.si-heading h4{font-size:23px}.si-source-name{font-size:14px}.si-heading p{font-size:14px}.si-filter{gap:11px;margin-bottom:23px}.si-syncbar{align-items:flex-start;gap:12px}.si-sync-meta{font-size:14px}.si-sync-meta small{font-size:14px;max-width:150px}.si-destinations{font-size:14px}.si-toast{font-size:14px;align-items:flex-start}.si-toast button{font-size:14px!important}.si-table{font-size:14px}.si-table td{padding:14px 9px}.si-table th{padding:10px 9px}.si-table td strong{font-size:14px}.si-view-switch button{font-size:14px!important}.si-outcomes{grid-template-columns:1fr;gap:18px}.si-connection{grid-template-columns:30px minmax(0,1fr);gap:12px}.si-connection>.si-secondary{grid-column:2;justify-self:start}.si-provider-icon{width:29px;height:33px;font-size:15px}.si-mapping-table{min-width:530px}.si-mapping-footer{align-items:flex-start}.si-mapping-footer small{max-width:160px}.si-meta-footer{font-size:14px}.si-run-heading{align-items:flex-start}.si-run-heading h5{font-size:14px}}