:root {
  --native-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --native-mono-font: ui-monospace, "SFMono-Regular", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
  --doc-font-size: 15px;
  --doc-line-height: 1.6;
  --doc-space: 16px;
  --side-nav-font-size: 13px;
  --side-nav-line-height: 1.5;
  --side-nav-width: 240px;
  --side-nav-top: 72px;
  --side-nav-right: 16px;
  --bullet-color: #0088cc;
}

html,
body,
body * {
  font-family: var(--native-font) !important;
  letter-spacing: 0 !important;
}
body .glyphicon {
  font-family: 'Glyphicons Halflings' !important;
}

.dev_page_head,
.dev_page_head *,
.tl_page_head,
.tl_page_head * {
  font-weight: 500 !important;
}

.tl_page_head .dev_top_lang_icon,
.tlb_page_head .dev_top_lang_icon {
  background: none !important;
  background-color: currentColor !important;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path fill='black' d='M8 0.4C12.2 0.4 15.6 3.8 15.6 8 15.6 12.2 12.2 15.6 8 15.6 3.8 15.6 0.4 12.2 0.4 8 0.4 3.8 3.8 0.4 8 0.4ZM9.63 11.1L6.37 11.1C6.73 13.07 7.4 14.4 8 14.4 8.6 14.4 9.27 13.07 9.63 11.1ZM5.14 11.1L2.4 11.1C3.19 12.52 4.51 13.61 6.09 14.11 5.71 13.41 5.41 12.5 5.21 11.45L5.14 11.1ZM13.6 11.1L10.86 11.1C10.65 12.3 10.33 13.33 9.92 14.11 11.4 13.64 12.66 12.65 13.46 11.35L13.6 11.1ZM4.99 6.1L1.89 6.1C1.7 6.7 1.6 7.34 1.6 8 1.6 8.66 1.7 9.3 1.89 9.9L4.99 9.9C4.94 9.44 4.92 8.97 4.91 8.49L4.9 8 4.9 7.71C4.91 7.16 4.94 6.62 4.99 6.1ZM9.8 6.1L6.2 6.1C6.14 6.7 6.1 7.34 6.1 8 6.1 8.66 6.14 9.3 6.2 9.9L9.8 9.9C9.86 9.3 9.9 8.66 9.9 8 9.9 7.34 9.86 6.7 9.8 6.1ZM14.11 6.1L11.01 6.1C11.07 6.71 11.1 7.34 11.1 8 11.1 8.66 11.07 9.29 11.01 9.9L14.11 9.9C14.3 9.3 14.4 8.66 14.4 8 14.4 7.34 14.3 6.7 14.11 6.1ZM6.08 1.89L6.02 1.91C4.47 2.42 3.18 3.5 2.4 4.9L5.14 4.9C5.33 3.82 5.6 2.87 5.96 2.13L6.08 1.89ZM8 1.6L7.93 1.61C7.35 1.71 6.72 3.01 6.37 4.9L9.63 4.9C9.28 3.01 8.66 1.71 8.08 1.61L8 1.6ZM9.91 1.89L9.97 2C10.36 2.76 10.66 3.76 10.86 4.9L13.6 4.9C12.86 3.56 11.65 2.52 10.19 1.98L9.91 1.89Z'/></svg>") no-repeat 0 0;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path fill='black' d='M8 0.4C12.2 0.4 15.6 3.8 15.6 8 15.6 12.2 12.2 15.6 8 15.6 3.8 15.6 0.4 12.2 0.4 8 0.4 3.8 3.8 0.4 8 0.4ZM9.63 11.1L6.37 11.1C6.73 13.07 7.4 14.4 8 14.4 8.6 14.4 9.27 13.07 9.63 11.1ZM5.14 11.1L2.4 11.1C3.19 12.52 4.51 13.61 6.09 14.11 5.71 13.41 5.41 12.5 5.21 11.45L5.14 11.1ZM13.6 11.1L10.86 11.1C10.65 12.3 10.33 13.33 9.92 14.11 11.4 13.64 12.66 12.65 13.46 11.35L13.6 11.1ZM4.99 6.1L1.89 6.1C1.7 6.7 1.6 7.34 1.6 8 1.6 8.66 1.7 9.3 1.89 9.9L4.99 9.9C4.94 9.44 4.92 8.97 4.91 8.49L4.9 8 4.9 7.71C4.91 7.16 4.94 6.62 4.99 6.1ZM9.8 6.1L6.2 6.1C6.14 6.7 6.1 7.34 6.1 8 6.1 8.66 6.14 9.3 6.2 9.9L9.8 9.9C9.86 9.3 9.9 8.66 9.9 8 9.9 7.34 9.86 6.7 9.8 6.1ZM14.11 6.1L11.01 6.1C11.07 6.71 11.1 7.34 11.1 8 11.1 8.66 11.07 9.29 11.01 9.9L14.11 9.9C14.3 9.3 14.4 8.66 14.4 8 14.4 7.34 14.3 6.7 14.11 6.1ZM6.08 1.89L6.02 1.91C4.47 2.42 3.18 3.5 2.4 4.9L5.14 4.9C5.33 3.82 5.6 2.87 5.96 2.13L6.08 1.89ZM8 1.6L7.93 1.61C7.35 1.71 6.72 3.01 6.37 4.9L9.63 4.9C9.28 3.01 8.66 1.71 8.08 1.61L8 1.6ZM9.91 1.89L9.97 2C10.36 2.76 10.66 3.76 10.86 4.9L13.6 4.9C12.86 3.56 11.65 2.52 10.19 1.98L9.91 1.89Z'/></svg>") no-repeat 0 0;
  -webkit-mask-size: 16px 16px;
  mask-size: 16px 16px;
}
.tl_page_head .icon-twitter,
.dev_page_head .icon-twitter {
  background: none;
  background-color: currentColor;
  opacity: 1;
  -webkit-mask: url("/img/xLogo.svg") no-repeat 0 50%;
  mask: url("/img/xLogo.svg") no-repeat 0 50%;
  -webkit-mask-size: 15px 15px;
  mask-size: 15px 15px;
}

.navbar-tg .nav > li > a:after {
  background: #0088cc;
}
html[data-theme="dark"] .navbar-tg .nav > li > a:after {
  background: var(--d-accent-bright);
}

.tl_main_download_link .icon-android,
.tl_main_download_link .icon-ios {
  background: none;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
}
.tl_main_download_link .icon-android {
  -webkit-mask-image: url('/img/SiteIconAndroid.svg');
  mask-image: url('/img/SiteIconAndroid.svg');
  -webkit-mask-size: 22px 27px;
  mask-size: 22px 27px;
}
.tl_main_download_link .icon-ios {
  -webkit-mask-image: url('/img/SiteIconApple.svg');
  mask-image: url('/img/SiteIconApple.svg');
  -webkit-mask-size: 21px 27px;
  mask-size: 21px 27px;
}

.tl_main_download_more_btn {
  border-radius: 999px;
  padding: 10px 22px;
}

pre,
code,
kbd,
samp,
pre *,
code * {
  font-family: var(--native-mono-font) !important;
}
#dev_page_content {
  font-size: var(--doc-font-size) !important;
  line-height: var(--doc-line-height) !important;
}

#dev_page_content p,
#dev_page_content li,
#dev_page_content td,
#dev_page_content th,
#dev_page_content blockquote {
  font-size: var(--doc-font-size) !important;
  line-height: var(--doc-line-height) !important;
}

#dev_page_content strong,
#dev_page_content b {
  font-weight: 600;
}

#dev_page_content > ul:not(.nav),
#dev_page_content ul.bulleted,
#dev_page_content > ul:not(.nav) ul:not(.nav),
#dev_page_content > ol:not(.nav) ul:not(.nav),
#dev_page_content ul.bulleted ul.bulleted {
  padding-left: 0;
}

#dev_page_content > ul:not(.nav) li,
#dev_page_content > ol:not(.nav) ul:not(.nav) li,
#dev_page_content ul.bulleted li {
  background-image: radial-gradient(circle, var(--bullet-color) 0 1.7px, transparent 1.9px);
  background-position: start 0.68em !important;
  background-size: 5px 5px;
  padding-inline-start: 16px !important;
}
.tl_dashboard_content_text li::marker {
  color: var(--bullet-color);
}

#dev_page_content > ul:not(.nav) li + li,
#dev_page_content > ol:not(.nav) ul:not(.nav) li + li,
#dev_page_content ul.bulleted li + li {
  margin-top: 2px;
}

#dev_page_content p,
#dev_page_content ul:not(.nav),
#dev_page_content ol:not(.nav),
#dev_page_content blockquote,
#dev_page_content pre,
#dev_page_content table.table,
#dev_page_content .richcode,
#dev_page_content .dev_page_image,
#dev_page_content .blog_video_player_wrap {
  margin-top: 0 !important;
  margin-bottom: var(--doc-space) !important;
}

#dev_page_content h1,
#dev_page_content h2,
#dev_page_content h3,
#dev_page_content h4,
#dev_page_content h5,
#dev_page_content h6 {
  margin-top: calc(var(--doc-space) * 2);
  margin-bottom: calc(var(--doc-space) * 0.5);
}

#dev_page_content h1:first-child,
#dev_page_content h2:first-child,
#dev_page_content h3:first-child,
#dev_page_content h4:first-child,
#dev_page_content h5:first-child,
#dev_page_content h6:first-child {
  margin-top: 0;
}

#dev_page_content blockquote {
  background-color: rgba(28, 147, 227, 0.08);
  border-left: 0;
  border-radius: 5px 8px 8px 5px;
  position: relative;
  padding: 4px 10px;
}

#dev_page_content blockquote::before {
  background-color: #179cde;
  border-radius: 5px 0 0 5px;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  width: 2px;
}

.blog_lang_original {
  border-left: 2px solid #0088cc;
  border-radius: 2px;
}
html[data-theme="dark"] .blog_lang_original {
  border-left-color: var(--d-accent-bright);
}

#dev_page_content li > ul:not(.nav),
#dev_page_content li > ol:not(.nav),
#dev_page_content blockquote > :last-child {
  margin-bottom: 0 !important;
}

@media (min-width: 768px) {
  #dev_page_content .dev_page_nav_wrap ul li a:first-child:hover {
    background: transparent;
  }
}
@media (max-width: 767px) {
  html[data-theme="dark"] #dev_page_content .dev_page_nav_wrap ul li a:first-child:hover {
    background: var(--d-accent-soft);
  }
}

#dev_page_content a.anchor i.anchor-icon {
  background: none;
  background-color: currentColor;
  -webkit-mask: url("https://telegram.org/img/link-icon.png") 0 0 / 17px 18px no-repeat;
  mask: url("https://telegram.org/img/link-icon.png") 0 0 / 17px 18px no-repeat;
}

.dev_page_bread_crumbs {
  padding-top: 16px;
}

.dev_page_bread_crumbs .breadcrumb {
  background: none;
  font-size: 13px;
  margin-bottom: 0;
  padding: 0;
}

#dev_page_title {
  margin-top: 12px !important;
}

.dev_page_bread_crumbs .breadcrumb a,
.dev_page_bread_crumbs .breadcrumb li {
  font-size: 13px;
}

.dev_page_bread_crumbs .icon-breadcrumb-divider {
  background-color: #0088cc;
  background-image: none;
  -webkit-mask: url("/img/breadcrumb_divider.png") 0 50% / 5px 10px no-repeat;
  mask: url("/img/breadcrumb_divider.png") 0 50% / 5px 10px no-repeat;
}

html[data-theme="dark"] .dev_page_bread_crumbs .icon-breadcrumb-divider {
  background-color: #5eb0f3;
}

#dev_page_content mark {
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 5px;
  color: #5b646e;
  font-size: 13px;
  font-weight: 500;
  padding: 1px 5px;
  white-space: nowrap;
}
#dev_page_content mark.mark-new {
  background-color: #08c;
  border-color: transparent;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 4px;
}

#dev_page_content table.table {
  border-collapse: collapse;
}

#dev_page_content table.table > thead > tr > th {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  border-top: 0;
  font-weight: 600;
  padding: 6px 12px;
  text-align: left;
}

#dev_page_content table.table > tbody > tr > td,
#dev_page_content table.table > tbody > tr > th {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 9px 12px;
  vertical-align: top;
}

#dev_page_content table.table > * > tr > th:first-child,
#dev_page_content table.table > * > tr > td:first-child {
  padding-left: 0;
}

#dev_page_content :not(pre) > code {
  background: none !important;
  color: #c61717;
  padding: 0;
}

#dev_page_content pre,
#dev_page_content_wrap pre.page_scheme {
  background-color: rgba(28, 147, 227, 0.08);
  border: 0;
  border-radius: 8px;
  padding: 12px 14px;
  scrollbar-width: thin;
  scrollbar-color: rgba(28, 147, 227, 0.35) transparent;
}

#dev_page_content pre::-webkit-scrollbar,
#dev_page_content_wrap pre.page_scheme::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

#dev_page_content pre::-webkit-scrollbar-track,
#dev_page_content_wrap pre.page_scheme::-webkit-scrollbar-track {
  background: transparent;
}

#dev_page_content pre::-webkit-scrollbar-thumb,
#dev_page_content_wrap pre.page_scheme::-webkit-scrollbar-thumb {
  background-clip: padding-box;
  background-color: rgba(28, 147, 227, 0.3);
  border: 3px solid transparent;
  border-radius: 999px;
}

#dev_page_content pre:hover::-webkit-scrollbar-thumb,
#dev_page_content_wrap pre.page_scheme:hover::-webkit-scrollbar-thumb {
  background-color: rgba(28, 147, 227, 0.45);
}

.dev_side_nav > ul {
  max-height: calc(100vh - 32px);
  margin: 0;
  overflow-y: auto !important;
  overflow-x: hidden;
  padding: 0 0 16px !important;
  position: relative;
  scrollbar-width: none;
}

.dev_side_nav_rail {
  left: 0;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  pointer-events: none;
  position: absolute;
  top: 0;
  z-index: 1;
}

.dev_side_nav_rail_bg {
  background-color: rgba(109, 119, 130, 0.22);
  inset: 0;
  position: absolute;
}

.dev_side_nav_rail_thumb {
  background-color: #08c;
  width: 100%;
}

.dev_side_nav_rail_thumb.is-animated {
  transition: margin-top 0.2s cubic-bezier(0.4, 0, 0.2, 1),
              height 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.dev_side_nav > ul.affix {
  max-height: 100vh;
}

.dev_side_nav > ul::-webkit-scrollbar {
  display: none;
  width: 0;
}

.dev_side_nav li a {
  border-left: 0;
  border-radius: 6px;
  color: #737c86;
  font-size: var(--side-nav-font-size);
  font-weight: 400;
  line-height: var(--side-nav-line-height);
  padding: 4px 12px !important;
  position: relative;
  /* The system font is variable, so font-weight interpolates smoothly. */
  transition: color 0.18s ease, background-color 0.18s ease, font-weight 0.18s ease;
}

.dev_side_nav li a:hover {
  color: #08c;
}

.dev_side_nav li + li {
  margin-top: 0;
}

.dev_side_nav li li a {
  font-size: var(--side-nav-font-size);
  font-weight: 400;
  padding: 4px 12px 4px 26px !important;
}

.dev_side_nav li.is-current > a {
  color: #08c;
  font-weight: 500;
}

@media (min-width: 1201px) {
  /* Keep content from sliding under the fixed nav on wide screens. */
  #dev_page_content_wrap:has(.dev_side_nav) {
    margin-left: min(170px, calc(50vw - 506px));
  }

  .dev_side_nav_wrap {
    position: fixed;
    right: var(--side-nav-right);
    top: var(--side-nav-top);
    width: var(--side-nav-width);
    z-index: 2;
  }

  .dev_side_nav {
    left: auto !important;
    position: static;
    right: auto;
    width: var(--side-nav-width);
  }

  .dev_side_nav > ul,
  .dev_side_nav > ul.affix,
  .dev_side_nav > ul.affix-top,
  .dev_side_nav > ul.affix-bottom {
    box-sizing: border-box;
    max-height: calc(100vh - var(--side-nav-top) - 24px);
    padding-top: 0;
    position: relative;
    width: var(--side-nav-width);
  }
}

.side_blog_wrap:before {
  width: 2px !important;
  border-radius: 2px !important;
  background: #0088cc !important;
}
html[data-theme="dark"] .side_blog_wrap:before {
  background: var(--d-accent-bright) !important;
}
.side_blog_header {
  font-weight: 600 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600 !important;
}

/* Dark theme */
html[data-theme="dark"] {
  color-scheme: dark;
  --d-bg: #17212b;
  --d-surface: #232e3c;
  --d-text: #e9edf1;
  --d-text-muted: #828d99;
  --d-border: rgba(255, 255, 255, 0.08);
  --d-accent: #3390ec;
  --d-accent-bright: #5eb0f3;
  --d-accent-soft: color-mix(in srgb, var(--d-accent) 16%, transparent);
  --bullet-color: var(--d-accent-bright);
}
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] .dev_page_wrap,
html[data-theme="dark"] .tl_page_wrap {
  background-color: var(--d-bg);
  color: var(--d-text);
}
html[data-theme="dark"] .dev_page,
html[data-theme="dark"] .tl_page,
html[data-theme="dark"] .tl_page_container,
html[data-theme="dark"] .container {
  background-color: transparent;
}
html[data-theme="dark"] .dev_page_head,
html[data-theme="dark"] .tl_page_head {
  background: var(--d-bg);
  border-bottom: 1px solid var(--d-border);
  box-shadow: none;
}
html[data-theme="dark"] .navbar-inner {
  border-bottom-color: var(--d-border);
}
html[data-theme="dark"] .navbar-tg .nav a,
html[data-theme="dark"] .dev_page_head a:not(.btn),
html[data-theme="dark"] .tl_page_head a {
  color: var(--d-accent-bright) !important;
}
html[data-theme="dark"] .dropdown-menu {
  background-color: var(--d-surface);
  border-color: var(--d-border) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4) !important;
}
html[data-theme="dark"] .dropdown-menu > li > a {
  color: var(--d-accent-bright) !important;
}
html[data-theme="dark"] .dropdown-menu > li > a:hover,
html[data-theme="dark"] .dropdown-menu > li > a:focus,
html[data-theme="dark"] .dropdown-menu > li.active > a {
  background-color: var(--d-accent) !important;
  color: #fff !important;
}

.dev_layer_select .dropdown-menu {
  max-height: min(60vh, 460px);
  overflow-y: auto;
  scrollbar-width: thin;
}
html[data-theme="dark"] .dev_layer_select > li > a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .dev_layer_select > li > a:hover,
html[data-theme="dark"] .dev_layer_select > li > a:focus {
  background-color: var(--d-accent);
  color: #fff;
}
.dev_layer_select > li > a {
  border-radius: 999px;
}

.caret {
  background-color: currentColor;
  background-image: none;
  -webkit-mask: url("/img/dropdown.webp") -2px -5px no-repeat;
  mask: url("/img/dropdown.webp") -2px -5px no-repeat;
  -webkit-mask-size: 18px 26px;
  mask-size: 18px 26px;
}
.nav .open > a .caret,
.nav .open > a:hover .caret,
.nav .open > a:focus .caret {
  -webkit-mask-position: -2px -15px;
  mask-position: -2px -15px;
}

html[data-theme="dark"] .footer_wrap,
html[data-theme="dark"] .footer_wrap .container,
html[data-theme="dark"] .footer_columns_wrap,
html[data-theme="dark"] .footer_column {
  background: var(--d-bg);
  color: var(--d-text-muted);
}
html[data-theme="dark"] .footer_wrap {
  border-top-color: var(--d-border);
}
html[data-theme="dark"] .footer_wrap a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .footer_column h5,
html[data-theme="dark"] .footer_column h5 a {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .dev_page_bread_crumbs,
html[data-theme="dark"] .breadcrumb {
  background: transparent;
}
html[data-theme="dark"] .dev_page_bread_crumbs {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .dev_page_bread_crumbs a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] #dev_page_title,
html[data-theme="dark"] #dev_page_content,
html[data-theme="dark"] #dev_page_content h1,
html[data-theme="dark"] #dev_page_content h2,
html[data-theme="dark"] #dev_page_content h3,
html[data-theme="dark"] #dev_page_content h4,
html[data-theme="dark"] #dev_page_content h5,
html[data-theme="dark"] #dev_page_content h6,
html[data-theme="dark"] #dev_page_content p,
html[data-theme="dark"] #dev_page_content li,
html[data-theme="dark"] #dev_page_content td,
html[data-theme="dark"] #dev_page_content th {
  color: var(--d-text) !important;
}
html[data-theme="dark"] #dev_page_content a,
html[data-theme="dark"] .dev_page_widget_title a,
html[data-theme="dark"] .blog_lang_original a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] #dev_page_content .dev_page_nav_wrap > p > a:first-child {
  color: var(--d-text);
}
html[data-theme="dark"] #dev_page_content kbd {
  background-color: var(--d-surface);
  border-color: var(--d-border);
  color: var(--d-text);
}
html[data-theme="dark"] #dev_page_content .form-control {
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--d-text) !important;
}
html[data-theme="dark"] #dev_page_content textarea.embed_code {
  background-color: var(--d-surface);
}
html[data-theme="dark"] #dev_page_content .form-control::placeholder {
  color: var(--d-text-muted);
}
html[data-theme="dark"] #dev_page_content .widget-color-label {
  color: var(--d-text);
}

html[data-theme="dark"] .support_wrap {
  background: transparent !important; /* telegram.css cards this white */
}
html[data-theme="dark"] .dev_page_edit_form label,
html[data-theme="dark"] .support_wrap h1,
html[data-theme="dark"] .support_wrap label {
  color: var(--d-text);
}
html[data-theme="dark"] .dev_page_edit_form .form-control,
html[data-theme="dark"] .support_wrap .form-control {
  background-color: var(--d-surface);
  border-color: var(--d-border);
  color: var(--d-text) !important;
}
html[data-theme="dark"] .dev_page_edit_form .form-control::placeholder,
html[data-theme="dark"] .support_wrap .form-control::placeholder {
  color: var(--d-text-muted);
}
.dev_page_edit_form .CodeMirror {
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 6px;
}
html[data-theme="dark"] .dev_page_edit_form .CodeMirror {
  border-color: var(--d-border);
}
html[data-theme="dark"] .cm-s-material.CodeMirror,
html[data-theme="dark"] .cm-s-material .CodeMirror-gutters {
  background-color: #1c2733;
}

html[data-theme="dark"] .dev_page_edit_form {
  border-top-color: var(--d-border);
}
.dev_page_edit_form .form-group {
  margin-bottom: 16px;
}
.dev_page_edit_form label {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
}
.dev_page_edit_form .form-control,
.support_wrap .form-control {
  font-size: 14px;
  height: auto;
  padding: 8px 12px;
  border-radius: 8px;
  box-shadow: none;
}
.form-control {
  color: #222;
}
.dev_page_edit_form .CodeMirror,
.dev_page_edit_form .CodeMirror * {
  font-family: var(--native-mono-font);
}
.dev_page_edit_form .CodeMirror {
  font-size: 13px;
  box-shadow: none;
}
.form-control:focus {
  border-color: #0088cc;
}
.dev_page_edit_form .CodeMirror-focused {
  border-color: #0088cc;
  box-shadow: none;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] #dev_page_content .form-control:focus,
html[data-theme="dark"] .dev_page_edit_form .form-control:focus,
html[data-theme="dark"] .dev_page_edit_form .CodeMirror-focused {
  border-color: var(--d-accent) !important;
}
.form-control {
  caret-color: #0088cc;
}
.dev_page_edit_form .CodeMirror-cursor {
  border-left-color: #0088cc;
}
html[data-theme="dark"] .form-control {
  caret-color: var(--d-accent-bright);
}
html[data-theme="dark"] .dev_page_edit_form .CodeMirror-cursor {
  border-left-color: var(--d-accent-bright);
}
.dev_page_edit_form .btn,
.support_wrap .btn {
  font-size: 14px;
  font-weight: 500;
  padding: 8px 20px;
  border-radius: 999px;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.dev_page_edit_form .btn-primary,
.support_wrap .btn-primary {
  background-color: #0088cc;
  border-color: #0088cc;
  color: #fff;
}
.support_wrap .btn-primary {
  border: 0;
}
.dev_page_edit_form .btn-primary:hover,
.dev_page_edit_form .btn-primary:focus,
.support_wrap .btn-primary:hover,
.support_wrap .btn-primary:focus {
  background-color: #0077b3;
  border-color: #0077b3;
}
.dev_page_edit_form .btn-default {
  background: transparent;
  border: 1px solid rgba(0, 0, 0, 0.14);
  color: #0088cc;
}
.dev_page_edit_form .btn-default:hover,
.dev_page_edit_form .btn-default:focus {
  background-color: rgba(0, 136, 204, 0.08);
  border-color: rgba(0, 136, 204, 0.4);
  color: #0088cc;
}
html[data-theme="dark"] .dev_page_edit_form .btn-primary,
html[data-theme="dark"] .support_wrap .btn-primary {
  background-color: var(--d-accent);
  border-color: var(--d-accent);
  color: #fff;
}
html[data-theme="dark"] .dev_page_edit_form .btn-primary:hover,
html[data-theme="dark"] .dev_page_edit_form .btn-primary:focus,
html[data-theme="dark"] .support_wrap .btn-primary:hover,
html[data-theme="dark"] .support_wrap .btn-primary:focus {
  background-color: var(--d-accent-bright);
  border-color: var(--d-accent-bright);
}
html[data-theme="dark"] .dev_page_edit_form .btn-default {
  border-color: var(--d-border);
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .dev_page_edit_form .btn-default:hover,
html[data-theme="dark"] .dev_page_edit_form .btn-default:focus {
  background-color: var(--d-accent-soft);
  border-color: var(--d-accent);
  color: var(--d-accent-bright);
}
html[data-theme="dark"] #dev_page_content .radio-input-icon,
html[data-theme="dark"] #dev_page_content .checkbox-input-icon {
  background: transparent;
  border-color: var(--d-text-muted);
}
html[data-theme="dark"] #dev_page_content pre,
html[data-theme="dark"] #dev_page_content_wrap pre.page_scheme,
html[data-theme="dark"] #dev_page_content_wrap .richcode {
  background-color: var(--d-accent-soft);
  border: 0;
  color: var(--d-text);
  scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
}
html[data-theme="dark"] #dev_page_content_wrap pre.page_scheme a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] #dev_page_content pre::-webkit-scrollbar-thumb,
html[data-theme="dark"] #dev_page_content_wrap pre.page_scheme::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2);
}
html[data-theme="dark"] #dev_page_content pre:hover::-webkit-scrollbar-thumb,
html[data-theme="dark"] #dev_page_content_wrap pre.page_scheme:hover::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.32);
}
html[data-theme="dark"] #dev_page_content :not(pre) > code {
  background: none;
  color: #ef5350;
}
html[data-theme="dark"] #dev_page_content table.table > thead > tr > th {
  background-color: transparent;
  border-bottom-color: var(--d-border);
  color: var(--d-text);
}
html[data-theme="dark"] #dev_page_content table.table > tbody > tr > td,
html[data-theme="dark"] #dev_page_content table.table > tbody > tr > th {
  background-color: transparent;
  border-top-color: var(--d-border);
  color: var(--d-text);
}
html[data-theme="dark"] #dev_page_content blockquote {
  background-color: var(--d-accent-soft);
}
html[data-theme="dark"] #dev_page_content mark {
  background-color: transparent;
  border-color: var(--d-border);
  color: var(--d-text-muted);
}
html[data-theme="dark"] #dev_page_content mark.mark-new {
  background-color: var(--d-accent);
  border-color: transparent;
  color: #fff;
}
html[data-theme="dark"] .dev_side_nav li a:hover,
html[data-theme="dark"] .dev_side_nav li.is-current > a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .dev_side_nav_rail_thumb {
  background-color: var(--d-accent-bright);
}
html[data-theme="dark"] .back_to_top {
  background: transparent;
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .back_to_top_wrap:hover .back_to_top {
  background: rgba(255, 255, 255, 0.04);
}
html[data-theme="dark"] .icon-to-top {
  background-color: var(--d-accent-bright);
  background-image: none;
  -webkit-mask: url("/img/back_to_top_1x.png") 0 50% / 16px 7px no-repeat;
  mask: url("/img/back_to_top_1x.png") 0 50% / 16px 7px no-repeat;
  filter: none;
}
html[data-theme="dark"] #dev_page_content hr {
  border-color: var(--d-border);
}

html[data-theme="dark"] .tl_main_logo_title_image path {
  fill: var(--d-text);
}
html[data-theme="dark"] .tl_main_logo_title {
  color: var(--d-text);
}
html[data-theme="dark"] .tl_main_logo_lead {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .tl_main_body_header {
  color: var(--d-text);
}
html[data-theme="dark"] .tl_main_card_lead,
html[data-theme="dark"] .tl_main_card_lead b,
html[data-theme="dark"] .dev_blog_card_lead {
  color: var(--d-text);
}
html[data-theme="dark"] .dev_blog_card_date,
html[data-theme="dark"] .side_blog_date,
html[data-theme="dark"] .tl_main_side_blog .side_blog_date {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .video_play .tl_main_video_player {
  opacity: 0;
}
html[data-theme="dark"] .tl_main_recent_news_header,
html[data-theme="dark"] .tl_main_recent_news_header a,
html[data-theme="dark"] .tl_main_cards_animated_wrap h3.tl_main_card_header,
html[data-theme="dark"] .tl_main_card_header,
html[data-theme="dark"] .tl_main_card_lead a,
html[data-theme="dark"] .tl_main_download_link,
html[data-theme="dark"] .tl_main_download_link b,
html[data-theme="dark"] .tl_main_download_desktop_link,
html[data-theme="dark"] .tl_main_download_desktop_link b,
html[data-theme="dark"] .dev_blog_card_title,
html[data-theme="dark"] .side_blog_header,
html[data-theme="dark"] .side_blog_title {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] a.tl_main_download_link:after,
html[data-theme="dark"] a.tl_main_download_desktop_link:after {
  background: var(--d-accent-bright);
}

html[data-theme="dark"] .td_content_title {
  color: var(--d-text);
}
html[data-theme="dark"] #td_about_tdesktop,
html[data-theme="dark"] .td_about_license,
html[data-theme="dark"] .td_download_divider {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .td_content_wrap a:not(.td_download_btn) {
  color: var(--d-accent-bright);
}

.tl_dashboard_counter_value {
  color: #0088cc;
}
html[data-theme="dark"] .tl_dashboard_counter {
  background: var(--d-surface);
}
html[data-theme="dark"] .tl_dashboard_counter_value {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .tl_dashboard_graph .chart_wrap_outer.chart_wrap_rendered {
  border-color: var(--d-border);
  background: #242f3e;
}
html[data-theme="dark"] .tl_dashboard_container table tr th,
html[data-theme="dark"] .tl_dashboard_container table tr td {
  border-color: var(--d-border);
}
html[data-theme="dark"] .tl_dashboard_table_explanation,
html[data-theme="dark"] .tl_dashboard_table_desc {
  color: var(--d-text-muted);
}
html[data-theme="dark"] .tl_dashboard_footer {
  --bg-color: var(--d-surface);
  background: var(--d-surface);
  box-shadow: 0 1px var(--d-border);
}
.tl_dashboard_container a,
.tl_dashboard_footer a {
  color: #0088cc;
}
html[data-theme="dark"] .tl_dashboard_container a,
html[data-theme="dark"] .tl_dashboard_footer a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .tl_dashboard_phone_video svg {
  color: var(--d-surface);
}

.tl_blog_list_cards_wrap {
  margin: 0 -15px;
}

.dev_blog_card_image.legacy {
  border-radius: 10px;
  padding: 5px;
  background-color: #fff;
}

.dev_blog_card_title {
  margin-top: 6px;
}

.pager {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
  text-align: right;
}
.pager li {
  display: inline-block;
}
.pager li.previous {
  float: left;
}
.pager li > a {
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 999px;
  color: #0088cc;
  background: transparent;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.pager li > a:hover {
  background-color: rgba(0, 136, 204, 0.08);
  border-color: rgba(0, 136, 204, 0.4);
}
html[data-theme="dark"] .pager li > a {
  border-color: var(--d-border);
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .pager li > a:hover {
  background-color: var(--d-accent-soft);
  border-color: var(--d-accent);
}

.tlb_page_head,
.tlb_page_head * {
  font-weight: 500;
}
.tlb_page_head {
  padding-right: 56px;
}
html[data-theme="dark"] .tlb_page_wrap {
  background-color: var(--d-bg);
  color: var(--d-text);
}
html[data-theme="dark"] .tlb_page_head {
  background: var(--d-bg);
  border-bottom: 1px solid var(--d-border);
}
html[data-theme="dark"] .tlb_page_head a.tlb_head_home,
html[data-theme="dark"] .tlb_top_lang_select > a.dropdown-toggle,
html[data-theme="dark"] .tlb_page_wrap #dev_page_title a {
  color: var(--d-accent-bright);
}
html[data-theme="dark"] .tlb_blog_logo {
  position: relative;
}
html[data-theme="dark"] .tlb_blog_logo::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 30px;
  right: 0;
  background-color: var(--d-text);
  -webkit-mask: url(/img/blog/BlogLogo3x.png) -30px 0 / 146px 20px no-repeat;
  mask: url(/img/blog/BlogLogo3x.png) -30px 0 / 146px 20px no-repeat;
}
.tlb_blog_page .tl_blog_list_cards_wrap,
.tlb_blog_page .tl_main_recent_news_cards {
  margin-left: 0;
  margin-right: 0;
}
.tlb_blog_page .dev_blog_card_link_wrap {
  padding-left: 0;
  padding-right: 0;
}
.tlb_blog_page .dev_blog_card_title,
.tlb_blog_page .dev_blog_card_lead,
.tlb_blog_page .dev_blog_card_date {
  padding-left: 0;
  padding-right: 0;
}
.tlb_blog_page .dev_blog_card_image,
.tlb_blog_page .preload .dev_blog_card_image {
  width: 100%;
  max-width: 100%;
  margin: 0;
}
body:has(.tlb_page_wrap) .theme-toggle {
  position: absolute;
}


html[data-theme="dark"] .top_lang_select .dropdown-menu li.chosen a,
html[data-theme="dark"] .top_lang_select .dropdown-menu li.chosen a:hover {
  color: #fff;
  background: transparent;
}

.navbar-form a {
  border-radius: 999px;
}

.navbar-tg .navbar-inner > .container {
  padding-right: 44px;
}

.theme-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  color: #8a939d;
  cursor: pointer;
  display: flex;
  height: 50px;
  justify-content: center;
  opacity: 0.7;
  padding: 0 16px;
  position: fixed;
  right: 0;
  top: 0;
  transition: opacity 0.15s ease;
  view-transition-name: theme-toggle; /* own VT layer → animates with the reveal */
  z-index: 1001; /* above the fixed header (z-index 1000) */
}

.theme-toggle:hover {
  opacity: 1;
}

.theme-toggle canvas,
.theme-toggle--static:before {
  display: block;
  height: 22px;
  width: 22px;
}
.theme-toggle--static canvas {
  display: none;
}
.theme-toggle--static:before {
  content: '';
  background-size: contain;
  background-image: url('/img/themeMoon.webp');
}
html[data-theme="dark"] .theme-toggle--static:before {
  background-size: contain;
  background-image: url('/img/themeSun.webp');
}

html[data-theme="dark"] .theme-toggle {
  color: #c2cbd4;
}

/* Radial theme reveal (View Transitions). */
::view-transition-group(root),
::view-transition-image-pair(root) {
  isolation: isolate;
  overflow: hidden;
}
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal; /* kill the UA plus-lighter edge seam */
  backface-visibility: hidden;
  contain: paint;
}
::view-transition-old(root) {
  z-index: 9999; /* the shrinking layer rides on top */
  will-change: clip-path;
  transform: translateZ(0); /* dedicated, fully-rasterised GPU layer */
}
::view-transition-new(root) { z-index: 1; }

/* Theme toggle icon morph animation. */
@keyframes tt-icon-out {
  to { opacity: 0; transform: rotate(-90deg) scale(0.5); }
}
@keyframes tt-icon-in {
  from { opacity: 0; transform: rotate(90deg) scale(0.5); }
}
::view-transition-old(theme-toggle) {
  animation: 500ms cubic-bezier(0.16, 1, 0.3, 1) both tt-icon-out;
}
::view-transition-new(theme-toggle) {
  animation: 500ms cubic-bezier(0.16, 1, 0.3, 1) both tt-icon-in;
}

:focus:not(:focus-visible) {
  outline: none;
}

.tl_main_side_blog .side_blog_wrap {
  z-index: 1;
}