/* Tutorial navigation and copy enhancement; loaded after the tutorial layout. */
.tut-tabs{
  position:-webkit-sticky;position:sticky;top:68px;top:var(--public-nav-height,68px);z-index:90;
  padding:10px 6px;margin-bottom:1rem;
  background:rgba(255,255,255,.97);border-bottom:1px solid var(--line,rgba(22,24,28,.1));
  box-shadow:0 7px 14px -12px rgba(22,24,28,.16);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.tut-tabs .tut-tab{padding:.45rem .9rem;font-size:.85rem;}
.tut-platform-notice{
  max-width:1100px;margin:0 auto 1.5rem;padding:16px 20px;
  color:var(--onv,#606874);background:rgba(var(--glow,217,46,26),.045);
  border:1px solid rgba(var(--glow,217,46,26),.16);border-radius:16px;
  font-size:.94rem;line-height:1.7;
}
.tut-platform-notice a{color:var(--brand,#d92e1a);font-weight:600;text-underline-offset:3px;}
#tut-android:checked ~ .tut-platform-unselected,
#tut-ios:checked ~ .tut-platform-unselected,
#tut-windows:checked ~ .tut-platform-unselected,
#tut-macos:checked ~ .tut-platform-unselected,
#tut-linux:checked ~ .tut-platform-unselected{display:none;}
.tut-arch-empty{color:var(--onv,#606874);}
.tut-outline{
  display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;
  gap:8px;padding:0 0 14px;margin:0 0 12px 26px;
}
.tut-outline-label{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-flex:0 0 auto;flex:0 0 auto;font-size:.76rem;font-weight:700;color:var(--onv,#606874);margin-right:3px;}
.tut-outline-link{
  display:-webkit-inline-flex;display:inline-flex;-webkit-align-items:center;align-items:center;
  gap:7px;min-height:42px;max-width:230px;padding:8px 10px;
  color:var(--onv,#606874);background:var(--card,#fff);
  border:1px solid var(--line,rgba(22,24,28,.1));border-radius:11px;
  font-size:.8rem;line-height:1.45;font-weight:600;text-decoration:none;
  overflow-wrap:anywhere;
}
.tut-outline-link:hover,.tut-outline-link.is-current{
  color:var(--brand,#d92e1a);background:rgba(var(--glow,217,46,26),.055);
  border-color:rgba(var(--glow,217,46,26),.3);
}
.tut-outline-no{
  display:-webkit-inline-flex;display:inline-flex;-webkit-align-items:center;align-items:center;
  -webkit-justify-content:center;justify-content:center;-webkit-flex:0 0 23px;flex:0 0 23px;
  width:23px;height:23px;border-radius:50%;font-size:.7rem;
  background:rgba(var(--glow,217,46,26),.08);color:var(--brand,#d92e1a);
}
.tut-outline-link:focus,.tut-copy-code:focus{outline:2px solid var(--brand,#d92e1a);outline-offset:3px;}
.tut-step,.tut-outline,.tut-panel,#tut-android-harmony{scroll-margin-top:178px;scroll-margin-top:var(--tut-nav-offset,calc(var(--public-nav-height,68px) + 110px));}
.tut-copy-code{
  display:none;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;
  min-height:38px;padding:7px 12px;margin:6px 0;
  font:inherit;font-size:.85rem;font-weight:600;line-height:1.4;
  color:var(--brand,#d92e1a);background:rgba(var(--glow,217,46,26),.06);
  border:1px solid rgba(var(--glow,217,46,26),.22);border-radius:10px;cursor:pointer;
}
.tut-copy-code:hover{background:rgba(var(--glow,217,46,26),.1);}
.tut-copy-code-status{display:block;min-height:1.5em;margin:3px 0 0;font-size:.8rem;line-height:1.5;color:var(--onv,#606874);}
.tut-copy-code-row{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;gap:8px;}
.tut-copy-code-row code{-webkit-user-select:text;user-select:text;}
.tut-copy-code-row>.tut-copy-code-status{-webkit-flex-basis:100%;flex-basis:100%;}
.tut-copy-code-row>.tut-copy-code-status:empty{min-height:0;margin:0;}
.tut-copy-code-row .tut-copy-code{margin:0;}

.tut-tabs [data-platform-tab]:focus{outline:2px solid var(--brand,#d92e1a);outline-offset:3px;}

@media(max-width:760px){
  .tut-tabs{gap:6px;padding:8px 3px;margin-bottom:.8rem;}
  .tut-tabs .tut-tab{padding:.4rem .65rem;gap:.3rem;font-size:.79rem;}
  .tut-tabs .tut-tab-ic svg{width:15px;height:15px;}
  .tut-outline{-webkit-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;margin-left:20px;padding:2px 0 10px;scrollbar-width:thin;}
  .tut-outline-link{-webkit-flex:0 0 auto;flex:0 0 auto;max-width:175px;min-height:43px;padding:7px 9px;font-size:.76rem;}
  .tut-copy-code{min-height:40px;}
}