html[data-locale-pending] body{visibility:hidden}
.header{gap:22px}
.header nav{gap:clamp(16px,2.4vw,35px);min-width:0}
.header nav a{white-space:nowrap}
.language-control{display:flex;align-items:center;gap:7px;border:1px solid #bccbbf;background:#ffffff70;border-radius:24px;padding:9px 11px;flex-shrink:0;color:#455d4c}
.language-control>svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4;flex-shrink:0}
.language-select{font:500 11px var(--sans);color:inherit;border:0;background:transparent;max-width:132px;min-width:85px;cursor:pointer;padding:2px 0;outline-offset:4px}
.language-control:focus-within{outline:2px solid #83a48c;outline-offset:3px}
.language-select option{background:#fafbf9;color:#263c2d;font:13px var(--sans)}
.hero-copy{min-width:0}
.hero-attributes{flex-wrap:wrap;row-gap:10px}
.hero-actions{flex-wrap:wrap;row-gap:16px}
.detail-image figcaption{gap:14px;flex-wrap:wrap}
.keymap-toolbar{flex-wrap:wrap}
.keymap-tabs{max-width:100%}
.keymap-tabs button{white-space:normal;line-height:1.4}
.support-intro>div{min-width:0}
.support-links a{min-width:0}
.doc-article,.doc-sidebar,.support-links,.hero-description{overflow-wrap:break-word;hyphens:auto}
.connection-diagram{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr)}
.connection-diagram>div{min-width:0}
.connection-diagram strong,.connection-diagram small{overflow-wrap:anywhere}
.flash-order{flex-wrap:wrap}
.docs-sidebar .doc-nav>a:not([hidden]){display:block}
.docs-sidebar .doc-nav>a[hidden]{display:none}
html:not([lang^="zh"]):not([lang="ja"]):not([lang="ko"]){--sans:'Segoe UI',Arial,sans-serif}
html:not([lang^="zh"]) .hero-copy{max-width:45%}
html:not([lang^="zh"]) .hero h1{font-size:clamp(29px,3.2vw,48px);line-height:1.25;letter-spacing:-.025em}
html:not([lang^="zh"]) .hero-description{font-size:14px;line-height:1.8;max-width:300px}
html:not([lang^="zh"]) .hero-attributes{font-size:10px;gap:12px}
html:not([lang^="zh"]) .hero-attributes span+span{padding-left:12px}
html:not([lang^="zh"]) .hero-actions{gap:18px}
@media(max-width:1100px) and (min-width:761px){
  .header{gap:18px;padding-left:4%;padding-right:4%}
  .header nav{gap:18px;font-size:12px}
  .header .nav-cta{display:none}
}
@media(max-width:760px){
  html{scroll-padding-top:125px}
  .header{display:grid;grid-template-columns:1fr auto;gap:7px 14px;height:auto;min-height:94px;padding:11px 6% 7px}
  .header .logo{grid-column:1;grid-row:1;justify-self:start;font-size:30px}
  .header .language-control{grid-column:2;grid-row:1;padding:6px 9px}
  .language-select{font-size:11px;max-width:137px}
  .header nav{grid-column:1 / -1;grid-row:2;width:100%;justify-content:space-between;gap:10px;font-size:10px}
  .header nav a:nth-child(n){display:block;padding:7px 0}
  .header .nav-cta{display:none}
  html:not([lang^="zh"]) .hero-copy{max-width:none}
  html:not([lang^="zh"]) .hero h1{font-size:clamp(29px,7.6vw,38px);line-height:1.25}
  html:not([lang^="zh"]) .hero-description{font-size:13px;max-width:none}
  .hero-attributes span{line-height:1.5}
  .support-intro{display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px}
  .support-intro>.button{grid-column:2;margin:2px 0 0;justify-self:start;white-space:normal}
  .support-intro h2{font-size:22px;line-height:1.5}
  .support-links{column-gap:18px}
  .connection-diagram{padding:20px 8px;gap:5px}
  .connection-diagram strong{font-size:9px}
  .diagram-connector{font-size:8px;max-width:42px;overflow-wrap:anywhere;text-align:center}
  .layer-explainer{gap:6px;padding:15px 7px}
  .layer-explainer>span{line-height:1.6;padding:0 4px;min-width:0}
  .layer-explainer strong{font-size:10px}
  .keymap-tabs button{padding:9px 8px;font-size:10px}
  .hardware-table>div{grid-template-columns:100px minmax(0,1fr);gap:12px}
}