:root{--white:#fff;--surface:#f4f5f7;--line:#dce0e5}
:root[data-theme=dark]{color-scheme:dark;--ink:#f0f0f0;--muted:#acafb5;--blue:#9bbaff;--tint:#252d38;--white:#171717;--surface:#232323;--line:#414141}
.theme-switch{display:flex;align-items:center;gap:2px;padding:3px;border-radius:13px;background:var(--surface);flex-shrink:0}
.theme-switch button{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer}
.theme-switch button:hover{color:var(--ink)}
.theme-switch button[aria-pressed=true]{background:var(--white);border-color:var(--line);color:var(--ink);box-shadow:0 1px 3px #0000000d}
:root[data-theme=dark] .theme-switch button[aria-pressed=true]{background:#383838;border-color:#515151}
.theme-switch button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.header-inner{gap:20px}.header-inner>nav{margin-left:auto}.header-inner>.theme-switch{margin-left:4px}
:root[data-theme=dark] body,:root[data-theme=dark] .skip{background:var(--white)}
:root[data-theme=dark] .site-header{background:#171717f7}
:root[data-theme=dark] .hero-band{background:linear-gradient(140deg,#171717 5%,#20262d 100%)}
:root[data-theme=dark] nav a:hover,:root[data-theme=dark] .motion-control:hover{background:var(--surface)}
:root[data-theme=dark] .soft-band,:root[data-theme=dark] .component-list article:nth-child(odd),:root[data-theme=dark] .faq-list,:root[data-theme=dark] .connector-body,:root[data-theme=dark] .pricing-plan,:root[data-theme=dark] .usecases .accordion details[open]{background:var(--surface)}
:root[data-theme=dark] .pricing-licence{background:linear-gradient(145deg,#25303d,#202832)}
:root[data-theme=dark] .tabs{background:#2c2c2c}
:root[data-theme=dark] .tabs button[aria-selected=true],:root[data-theme=dark] .accordion details[open],:root[data-theme=dark] .connector-body pre,:root[data-theme=dark] .connector-fields input,:root[data-theme=dark] .connector-fields select,:root[data-theme=dark] #manual-copy{background:var(--white);color:var(--ink)}
:root[data-theme=dark] .button{color:#171717;background:var(--ink)}
:root[data-theme=dark] .button:hover{background:var(--blue)}
:root[data-theme=dark] .footer-bottom img{filter:brightness(0) invert(1)}
/* Only monochrome motion artwork is inverted; product screenshots retain their colors. */
:root[data-theme=dark] .motion{filter:invert(1);mix-blend-mode:screen}
@media(max-width:850px){.header-inner{gap:12px;width:calc(100% - 40px)}.header-inner nav a{padding-inline:10px}}
@media(max-width:760px){.menu-toggle{display:block;margin-left:auto;min-height:44px;padding:10px 0;font-size:14px}.header-inner{height:68px}.header-inner>nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--white);padding:12px 20px 24px;gap:4px;margin:0}.header-inner>nav.open{display:flex;flex-direction:column;align-items:stretch}.header-inner nav a{padding:12px 16px}.header-inner>.theme-switch{margin:0}.theme-switch button{width:36px;height:36px}}
