/* DataBridge User Manual — shares the product's design tokens (databridge-ui.css).
   Self-contained: no CDN, no external fonts. Works from disk (file://) and from /help. */
:root{
  --db-app:#e9ecf0;--db-surface:#f4f6f8;--db-surface-2:#eceff3;--db-surface-3:#e3e7ec;
  --db-band:#eceff3;--db-line:#cfd5dc;--db-line-soft:#dde2e8;--db-line-strong:#b6bec8;
  --db-ink:#1b2128;--db-ink-2:#3d4650;--db-muted:#565d68;--db-faint:#626870;
  --db-accent:#1f5fa8;--db-accent-deep:#17497f;--db-accent-soft:#e4edf7;--db-accent-line:#b9d0e8;
  --db-on-accent:#fff;--db-ok:#17694a;--db-ok-bg:#e2f0e9;--db-ok-line:#a9cfbe;
  --db-warn:#8a5a08;--db-warn-bg:#f8eeda;--db-warn-line:#ddc590;
  --db-crit:#a32b1e;--db-crit-bg:#f9e5e1;--db-crit-line:#e8b6ac;
  --db-shadow-1:0 1px 2px rgba(22,28,36,.07);
  --db-shadow-2:0 2px 4px rgba(22,28,36,.08),0 10px 24px rgba(22,28,36,.10);
  --db-radius:3px;--db-radius-lg:4px;
  --db-font-ui:"IBM Plex Sans","Segoe UI",system-ui,Arial,sans-serif;
  --db-font-mono:"IBM Plex Mono","Cascadia Mono",Consolas,"SF Mono",monospace;
  --rail:clamp(232px,17vw,320px);--outline:clamp(200px,15vw,300px);--shell:1760px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --db-app:#101418;--db-surface:#171c22;--db-surface-2:#1d232a;--db-surface-3:#242b33;
  --db-band:#1c222a;--db-line:#2b333d;--db-line-soft:#262d37;--db-line-strong:#3b4551;
  --db-ink:#e9edf2;--db-ink-2:#c2c9d3;--db-muted:#959fae;--db-faint:#8592a5;
  --db-accent:#79ade3;--db-accent-deep:#9cc4ee;--db-accent-soft:#1b2a3b;--db-accent-line:#2f4a68;
  --db-on-accent:#0b1219;--db-ok:#63c391;--db-ok-bg:#162c24;--db-ok-line:#2c5844;
  --db-warn:#d9a84d;--db-warn-bg:#2e2617;--db-warn-line:#5f4c26;
  --db-crit:#e07b68;--db-crit-bg:#351f1c;--db-crit-line:#6d4038;
  --db-shadow-1:0 1px 2px rgba(0,0,0,.5);--db-shadow-2:0 2px 4px rgba(0,0,0,.5),0 10px 26px rgba(0,0,0,.45);
}}
:root[data-theme="dark"]{
  --db-app:#101418;--db-surface:#171c22;--db-surface-2:#1d232a;--db-surface-3:#242b33;
  --db-band:#1c222a;--db-line:#2b333d;--db-line-soft:#262d37;--db-line-strong:#3b4551;
  --db-ink:#e9edf2;--db-ink-2:#c2c9d3;--db-muted:#959fae;--db-faint:#8592a5;
  --db-accent:#79ade3;--db-accent-deep:#9cc4ee;--db-accent-soft:#1b2a3b;--db-accent-line:#2f4a68;
  --db-on-accent:#0b1219;--db-ok:#63c391;--db-ok-bg:#162c24;--db-ok-line:#2c5844;
  --db-warn:#d9a84d;--db-warn-bg:#2e2617;--db-warn-line:#5f4c26;
  --db-crit:#e07b68;--db-crit-bg:#351f1c;--db-crit-line:#6d4038;
  --db-shadow-1:0 1px 2px rgba(0,0,0,.5);--db-shadow-2:0 2px 4px rgba(0,0,0,.5),0 10px 26px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:64px}
body{margin:0;background:var(--db-app);color:var(--db-ink);font:15px/1.65 var(--db-font-ui);
  -webkit-font-smoothing:antialiased}
a{color:var(--db-accent);text-decoration:none}
a:hover{text-decoration:underline}
code,kbd,samp,pre{font-family:var(--db-font-mono);font-size:.875em}

/* ---- shell ---- */
.m-top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;height:48px;
  padding:0 14px;background:var(--db-band);border-bottom:1px solid var(--db-line)}
.m-brand{display:flex;align-items:center;gap:8px;font-weight:600;letter-spacing:.01em;color:var(--db-ink)}
.m-brand .m-dot{width:9px;height:9px;border-radius:2px;background:var(--db-accent)}
.m-brand small{font-weight:400;color:var(--db-muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em}
.m-top .m-spacer{flex:1}
.m-btn{appearance:none;border:1px solid var(--db-line);background:var(--db-surface);color:var(--db-ink-2);
  border-radius:var(--db-radius);height:28px;padding:0 10px;font:500 12px var(--db-font-ui);cursor:pointer}
.m-btn:hover{border-color:var(--db-line-strong);color:var(--db-ink)}
.m-search{position:relative}
.m-search input{width:260px;height:28px;padding:0 9px;border:1px solid var(--db-line);border-radius:var(--db-radius);
  background:var(--db-surface);color:var(--db-ink);font:13px var(--db-font-ui)}
.m-search input:focus{outline:none;border-color:var(--db-accent);box-shadow:0 0 0 2px var(--db-accent-soft)}
.m-results{position:absolute;top:34px;right:0;width:460px;max-height:60vh;overflow:auto;background:var(--db-surface);
  border:1px solid var(--db-line);border-radius:var(--db-radius-lg);box-shadow:var(--db-shadow-2);display:none;z-index:50}
.m-results.open{display:block}
.m-results a{display:block;padding:8px 11px;border-bottom:1px solid var(--db-line-soft);color:var(--db-ink)}
.m-results a:last-child{border-bottom:0}
.m-results a:hover,.m-results a.sel{background:var(--db-accent-soft);text-decoration:none}
.m-results .r-ch{display:block;font-size:11px;color:var(--db-muted);text-transform:uppercase;letter-spacing:.07em}
.m-results .r-t{font-weight:600}
.m-results .r-x{color:var(--db-muted);font-size:12.5px}
.m-results mark{background:transparent;color:var(--db-accent-deep);font-weight:600}
/* Three columns once there is room for one: chapters, the page, and the page's own outline.
   Surplus width goes to the outline and to wider tables and figures, not to longer lines. */
.m-wrap{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);align-items:start;
  max-width:var(--shell);margin-inline:auto}
@media(min-width:1380px){.m-wrap{grid-template-columns:var(--rail) minmax(0,1fr) var(--outline)}}
.m-rail{position:sticky;top:48px;height:calc(100vh - 48px);overflow:auto;padding:14px 8px 40px;
  background:var(--db-band);border-right:1px solid var(--db-line)}
.m-rail ol{list-style:none;margin:0;padding:0}
.m-rail .m-part{margin:14px 0 5px;padding:0 8px;font-size:10.5px;font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;color:var(--db-faint)}
.m-rail a{display:flex;gap:8px;padding:5px 8px;border-radius:var(--db-radius);color:var(--db-ink-2);font-size:13px}
.m-rail a:hover{background:var(--db-surface-2);text-decoration:none;color:var(--db-ink)}
.m-rail a.cur{background:var(--db-accent-soft);color:var(--db-accent-deep);font-weight:600;
  box-shadow:inset 2px 0 0 var(--db-accent)}
.m-rail .n{color:var(--db-faint);font-family:var(--db-font-mono);font-size:11.5px;min-width:18px}
.m-rail a.cur .n{color:var(--db-accent)}
.m-main{min-width:0;padding:30px clamp(22px,2.6vw,52px) 90px}
/* Everything shares one right edge. Capping prose while tables ran full width left a column of
   dead space beside every paragraph, which read as a layout bug. Line length is governed by the
   grid instead: the two rails and the page gutters take their share, and the whole shell stops
   growing past --shell so an ultrawide monitor centres it rather than stretching it. */
.m-doc,.m-doc>*{max-width:100%}
.m-doc>.m-lede{max-width:min(100%,92ch)}

/* ---- prose ---- */
.m-eyebrow{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--db-accent);margin:0 0 6px}
.m-doc h1{font-size:27px;line-height:1.24;letter-spacing:-.012em;margin:0 0 10px;font-weight:600}
.m-doc .m-lede{font-size:15.5px;color:var(--db-ink-2);margin:0 0 26px;max-width:66ch}
.m-doc h2{font-size:19px;font-weight:600;letter-spacing:-.006em;margin:38px 0 10px;padding-top:14px;
  border-top:1px solid var(--db-line-soft)}
.m-doc h3{font-size:15.5px;font-weight:600;margin:26px 0 7px}
.m-doc h4{font-size:13.5px;font-weight:600;margin:20px 0 5px;color:var(--db-ink-2)}
.m-doc p{margin:0 0 13px}
.m-doc ul,.m-doc ol{margin:0 0 13px;padding-left:22px}
.m-doc li{margin:0 0 5px}
.m-doc li>ul,.m-doc li>ol{margin-top:5px}
.anchor{opacity:0;margin-left:7px;font-weight:400;color:var(--db-faint);font-size:.8em}
h2:hover .anchor,h3:hover .anchor,h4:hover .anchor{opacity:1}
.m-doc code{background:var(--db-surface-3);border:1px solid var(--db-line-soft);border-radius:2px;padding:.5px 4px}
.m-doc pre{background:var(--db-surface);border:1px solid var(--db-line);border-radius:var(--db-radius-lg);
  padding:11px 13px;overflow:auto;margin:0 0 15px;line-height:1.55}
.m-doc pre code{background:none;border:0;padding:0}
kbd{background:var(--db-surface-3);border:1px solid var(--db-line-strong);border-bottom-width:2px;border-radius:3px;
  padding:1px 5px;font-size:11.5px;color:var(--db-ink-2)}
/* ---- tables ---- */
.m-doc table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:13px;
  border:1px solid var(--db-line);border-radius:var(--db-radius-lg);overflow:hidden}
.m-doc th{text-align:left;background:var(--db-band-2,var(--db-surface-2));font-weight:600;font-size:11px;
  text-transform:uppercase;letter-spacing:.07em;color:var(--db-muted);padding:7px 10px;border-bottom:1px solid var(--db-line)}
.m-doc td{padding:7px 10px;border-bottom:1px solid var(--db-line-soft);vertical-align:top}
.m-doc tr:last-child td{border-bottom:0}
.m-doc tbody tr:hover{background:var(--db-surface-2)}
.m-doc td code{white-space:nowrap}
/* ---- callouts ---- */
.note,.warn,.crit,.tip{border:1px solid var(--db-line);border-left-width:3px;border-radius:var(--db-radius-lg);
  padding:10px 13px;margin:0 0 16px;background:var(--db-surface);font-size:13.4px}
.note{border-left-color:var(--db-accent);background:var(--db-accent-soft);border-color:var(--db-accent-line)}
.tip{border-left-color:var(--db-ok);background:var(--db-ok-bg);border-color:var(--db-ok-line)}
.warn{border-left-color:var(--db-warn);background:var(--db-warn-bg);border-color:var(--db-warn-line)}
.crit{border-left-color:var(--db-crit);background:var(--db-crit-bg);border-color:var(--db-crit-line)}
.note>:last-child,.tip>:last-child,.warn>:last-child,.crit>:last-child{margin-bottom:0}
.note>b:first-child,.tip>b:first-child,.warn>b:first-child,.crit>b:first-child{
  display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
.note>b:first-child{color:var(--db-accent-deep)}.tip>b:first-child{color:var(--db-ok)}
.warn>b:first-child{color:var(--db-warn)}.crit>b:first-child{color:var(--db-crit)}

/* ---- figures / screenshots ---- */
figure{margin:0 0 20px}
figure img{display:block;width:100%;border:1px solid var(--db-line);border-radius:var(--db-radius-lg);
  box-shadow:var(--db-shadow-1);background:var(--db-surface);cursor:zoom-in}
figure img.missing{min-height:120px;cursor:default}
figcaption{margin-top:6px;font-size:12px;color:var(--db-muted)}
figcaption .fig-n{font-weight:600;color:var(--db-ink-2)}
.m-lightbox{position:fixed;inset:0;z-index:100;background:rgba(10,14,18,.86);display:none;
  align-items:center;justify-content:center;padding:28px;cursor:zoom-out}
.m-lightbox.open{display:flex}
.m-lightbox img{max-width:100%;max-height:100%;border-radius:var(--db-radius-lg);box-shadow:var(--db-shadow-2)}
/* ---- reference bits ---- */
.ui{font-weight:600;color:var(--db-ink)}
.path{font-family:var(--db-font-mono);font-size:.875em;color:var(--db-ink-2);white-space:nowrap}
.pill{display:inline-block;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;
  padding:1.5px 6px;border-radius:9px;border:1px solid var(--db-line);background:var(--db-surface-2);color:var(--db-muted)}
.pill.mod{background:var(--db-accent-soft);border-color:var(--db-accent-line);color:var(--db-accent-deep)}
.pill.adm{background:var(--db-warn-bg);border-color:var(--db-warn-line);color:var(--db-warn)}
.tip-dot{border-bottom:1px dotted var(--db-faint);cursor:help}
/* footnotes */
.fn-ref{font-size:.72em;vertical-align:super;line-height:0;font-weight:600;padding:0 1px}
.m-notes{margin-top:44px;padding-top:12px;border-top:1px solid var(--db-line);font-size:12.5px;color:var(--db-ink-2)}
.m-notes h2{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--db-faint);border:0;margin:0 0 8px;padding:0}
.m-notes ol{padding-left:20px}
.m-notes li{margin-bottom:5px}
.m-notes li:target{background:var(--db-accent-soft);border-radius:2px}
/* prev / next */
.m-turn{display:flex;gap:12px;margin-top:46px;padding-top:18px;border-top:1px solid var(--db-line)}
.m-turn a{flex:1;border:1px solid var(--db-line);border-radius:var(--db-radius-lg);padding:10px 13px;
  background:var(--db-surface);color:var(--db-ink)}
.m-turn a:hover{border-color:var(--db-accent-line);background:var(--db-accent-soft);text-decoration:none}
.m-turn .d{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--db-faint);margin-bottom:2px}
.m-turn .nx{text-align:right}
/* landing */
.m-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:12px;margin:0 0 26px}
.m-card{display:block;border:1px solid var(--db-line);border-radius:var(--db-radius-lg);padding:13px 15px;
  background:var(--db-surface);color:var(--db-ink)}
.m-card:hover{border-color:var(--db-accent-line);background:var(--db-accent-soft);text-decoration:none}
.m-card .n{font-family:var(--db-font-mono);font-size:11px;color:var(--db-faint)}
.m-card h3{margin:2px 0 4px;font-size:14.5px;font-weight:600}
.m-card p{margin:0;font-size:12.6px;color:var(--db-muted);line-height:1.5}
.m-menu{display:none}
@media(max-width:980px){:root{--rail:0px}.m-wrap{grid-template-columns:minmax(0,1fr)}
  .m-menu{display:inline-flex;align-items:center}
  .m-rail{display:none;position:fixed;top:48px;left:0;bottom:0;height:auto;width:min(86vw,320px);z-index:39;
    background:var(--db-surface);border-right:1px solid var(--db-line);box-shadow:0 8px 28px rgba(0,0,0,.18)}
  body.m-nav-open .m-rail{display:block}
  .m-scrim{display:none;position:fixed;inset:48px 0 0 0;z-index:38;background:rgba(0,0,0,.32)}
  body.m-nav-open .m-scrim{display:block}
  .m-main{padding:22px 18px 70px}.m-search input{width:150px}
  .m-results{width:min(92vw,460px)}}
@media(max-width:600px){.m-top{gap:8px;padding-left:10px;padding-right:10px}.m-brand small,#m-print{display:none}
  .m-search{flex:1;min-width:0}.m-search input{width:100%}.m-top .m-spacer{display:none}
  .m-results{position:fixed;top:44px;left:8px;right:8px;width:auto}}
@media print{.m-scrim,.m-top,.m-rail,.m-turn,.m-lightbox{display:none!important}.m-wrap{display:block}
  .m-main{padding:0}.m-doc{max-width:none}figure img{box-shadow:none}
  .m-doc h2{break-after:avoid}figure{break-inside:avoid}a{color:inherit}}

/* ---- right-hand outline: "on this page" ---- */
.m-outline{display:none}
@media(min-width:1380px){
  .m-outline{display:block;position:sticky;top:48px;max-height:calc(100vh - 48px);overflow:auto;
    padding:30px 18px 40px 6px}
  .m-outline h2{margin:0 0 8px;font-size:10.5px;font-weight:600;text-transform:uppercase;
    letter-spacing:.1em;color:var(--db-faint);border:0;padding:0}
  .m-outline ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--db-line)}
  .m-outline a{display:block;padding:4px 10px;margin-left:-1px;border-left:2px solid transparent;
    color:var(--db-muted);font-size:12.5px;line-height:1.45}
  .m-outline a:hover{color:var(--db-ink);text-decoration:none}
  .m-outline a.sub{padding-left:22px;font-size:12px}
  .m-outline a.here{color:var(--db-accent-deep);border-left-color:var(--db-accent);font-weight:600}
}
@media print{.m-outline{display:none!important}}
