/* The telegram.org document design (the privacy policy and the FAQ), one
   copy for both pages: a 1:1 rebuild of telegram.org/privacy and /faq,
   measured from the live pages on 30 Sep 2026. Only the brand differs:
   Rentown's name, links, accent (--accent) and our own icons. */
/* ---------- tokens ---------- */
:root {
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bg: #fff;
  --text: #333;
  --accent: #ff5c0a;
  --bullet: #ff5c0a;
  --line: #e8e8e8;
  --head-bg: rgba(255, 255, 255, .84);
  --quote-bg: rgba(255, 92, 10, .08);
  --quote-bar: #ff5c0a;
  --side-link: #737c86;
  --rail: rgba(109, 119, 130, .22);
  --toggle: #8a939d;
  --footer-text: #333;
  --todo-bg: rgba(255, 196, 0, .28);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #17212b;
  --text: #e9edf1;
  --accent: #ff8a4c;
  --bullet: #ff8a4c;
  --line: rgba(255, 255, 255, .08);
  --head-bg: #17212b;
  --quote-bg: color-mix(in srgb, #ff5c0a 16%, transparent);
  --toggle: #c2cbd4;
  --footer-text: #828d99;
  --todo-bg: rgba(255, 196, 0, .22);
}

/* ---------- base ---------- */
* { box-sizing: border-box; }
html { font-size: 10px; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0,0,0,0); }
html, body, body * { font-family: var(--font) !important; letter-spacing: 0 !important; }
body { margin: 0; font-size: 12px; line-height: 18px; color: var(--text); background: var(--bg); position: relative; }
a { color: var(--accent); text-decoration: none; background: transparent; }
a:hover { color: var(--accent); text-decoration: underline; }
a:focus { text-decoration: none; }
:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
b, strong { font-weight: bold; }
h1, h3, h4, h5 { font-weight: 600 !important; line-height: 1.1; color: inherit; position: relative; }
p { margin: 0 0 8.5px; }
ul { margin-top: 0; margin-bottom: 8.5px; }

.container { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; }
@media (min-width: 768px)  { .container { width: 750px; } }
@media (min-width: 992px)  { .container { width: 970px; } }
@media (min-width: 1200px) { .container { width: 1170px; } }
.container::before, .container::after, .clearfix::before, .clearfix::after { content: " "; display: table; }
.container::after, .clearfix::after { clear: both; }
@media (max-width: 767px) { .hidden-xs { display: none !important; } }

/* ---------- header ---------- */
.tl_page_head {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  min-height: 48px; margin-bottom: 0;
  border: 1px solid transparent; border-width: 0 0 1px;
  background: var(--head-bg);
  -webkit-backdrop-filter: blur(25px); backdrop-filter: blur(25px);
}
html[data-theme="dark"] .tl_page_head { border-bottom: 1px solid var(--line); }
.tl_page_head, .tl_page_head * { font-weight: 500 !important; }
.navbar-tg .navbar-inner { border-bottom: 1px solid var(--line); box-shadow: none; }
html[data-theme="dark"] .navbar-tg .navbar-inner { border-bottom: 0; }
.navbar-tg .navbar-inner > .container { padding-right: 44px; }
@media (max-width: 480px) { .navbar-tg .navbar-inner > .container { padding-left: 0; } }

.nav { margin: 0; padding: 0; list-style: none; font-size: 15px; color: #a2a2a2; }
.navbar-nav { float: left; }
.navbar-right { float: right !important; }
.navbar-nav > li { float: left; position: relative; display: block; }
.navbar-tg .nav > li > a {
  position: relative; display: block;
  padding: 15.5px 15px; line-height: 17px;
  color: var(--accent); background: transparent;
}
.navbar-tg .nav > li > a:hover, .navbar-tg .nav > li > a:focus { text-decoration: none; background: transparent; }
.navbar-tg .nav > li > a::after {
  content: ""; display: block; position: absolute; left: 4px; right: 4px; bottom: -1px; height: 3px;
  background: var(--accent); border-radius: 2px 2px 0 0;
  opacity: 0; transform-origin: center bottom; transform: scaleX(.3) scaleY(0);
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
}
.navbar-tg .nav > li > a:hover::after,
.navbar-tg .nav > li > a.is-here::after { opacity: 1; transform: scaleX(1) scaleY(1); }

/* theme toggle, fixed top-right, over the header */
.theme-toggle {
  position: fixed; top: 0; right: 0; z-index: 1001;
  display: flex; align-items: center; justify-content: center;
  height: 50px; padding: 0 16px; border: 0; background: transparent; cursor: pointer;
  color: var(--toggle); opacity: .7; transition: opacity .15s ease;
}
.theme-toggle:hover { opacity: 1; }
.theme-toggle svg { display: block; width: 22px; height: 22px; transition: transform .5s cubic-bezier(.16,1,.3,1); }
.theme-toggle .moon { display: none; }
html[data-theme="dark"] .theme-toggle .sun { display: none; }
html[data-theme="dark"] .theme-toggle .moon { display: block; }

/* ---------- page column ---------- */
.tl_page_container { margin-top: 50px; }
#dev_page_content_wrap { max-width: 800px; margin: 0 auto; padding: 20px 0; }
@media (max-width: 640px) { #dev_page_content_wrap { padding-top: 12px; } }
.dev_page_bread_crumbs { padding-top: 16px; }

#dev_page_title { font-size: 20px; line-height: 1.1; margin: 12px 0 12px; position: static; }
@media (max-width: 640px) { #dev_page_title { font-size: 19px; margin-bottom: 21px; } }

/* ---------- document typography ---------- */
#dev_page_content { font-size: 15px; line-height: 1.6; }
#dev_page_content p,
#dev_page_content li,
#dev_page_content blockquote { font-size: 15px; line-height: 1.6; }
#dev_page_content strong, #dev_page_content b { font-weight: 600; }
#dev_page_content p,
#dev_page_content ul,
#dev_page_content blockquote { margin-top: 0; margin-bottom: 16px; }

#dev_page_content h3 { font-size: 20px; }
#dev_page_content h4 { font-size: 16px; }
#dev_page_content h5 { font-size: 16px; }
#dev_page_content h3, #dev_page_content h4, #dev_page_content h5 { margin: 32px 0 8px; }
#dev_page_content h3:first-child, #dev_page_content h4:first-child, #dev_page_content h5:first-child { margin-top: 0; }
@media (max-width: 640px) {
  #dev_page_content h3 { font-size: 16px; }
  #dev_page_content h4 { font-size: 16px; }
  #dev_page_content h5 { font-size: 14px; }
  a:hover { text-decoration: none; }
}

#dev_page_content > ul { list-style: none; padding-left: 0; }
#dev_page_content > ul li {
  padding-left: 16px;
  background: radial-gradient(circle, var(--bullet) 0 1.7px, transparent 1.9px) no-repeat 0 8px / 5px 5px;
}
#dev_page_content > ul li + li { margin-top: 2px; }

#dev_page_content blockquote {
  position: relative; margin: 0 0 16px; padding: 4px 10px;
  background: var(--quote-bg); border: 0; border-radius: 5px 8px 8px 5px;
}
#dev_page_content blockquote::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 2px;
  background: var(--quote-bar); border-radius: 5px 0 0 5px;
}
#dev_page_content blockquote > :last-child { margin-bottom: 0; }

/* details the owner still has to supply: impossible to miss, gone once filled */
.todo { background: var(--todo-bg); border-radius: 3px; padding: 0 3px; font-weight: 600; }

/* ---------- heading anchors ---------- */
a.anchor {
  display: block; position: absolute; top: 0; left: 0; bottom: 0;
  margin-left: -22px; margin-top: -60px; border-top: 60px solid transparent;
  background-clip: padding-box; line-height: 1; text-decoration: none; cursor: default; outline: 0;
}
a.anchor i.anchor-icon {
  display: inline-block; position: relative; z-index: 10;
  width: 18px; height: 20px; margin-top: 2px; padding: 0; line-height: 14px; vertical-align: text-top;
  background-color: var(--accent);
  -webkit-mask: var(--chain) 0 0 / 17px 18px no-repeat; mask: var(--chain) 0 0 / 17px 18px no-repeat;
  opacity: 0; cursor: pointer; transition: opacity .15s ease-in-out;
}
:root {
  --chain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 18' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M7.3 10.2a3.4 3.4 0 0 0 4.8.2l2.4-2.4a3.4 3.4 0 0 0-4.8-4.8L8.4 4.5'/%3E%3Cpath d='M9.7 7.8a3.4 3.4 0 0 0-4.8-.2L2.5 10a3.4 3.4 0 0 0 4.8 4.8l1.3-1.3'/%3E%3C/svg%3E");
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6 8 1l6.5 5'/%3E%3C/svg%3E");
}
h4 a.anchor i.anchor-icon { margin-top: 0; }
h3:hover a.anchor i.anchor-icon, h4:hover a.anchor i.anchor-icon, h5:hover a.anchor i.anchor-icon { opacity: .6; }
i.anchor-icon:hover { opacity: 1 !important; }
@media (max-width: 1000px) { a.anchor { margin-left: -19px; } }
@media (max-width: 480px)  { a.anchor { margin-left: -16px; } h3 a.anchor i.anchor-icon { margin-top: 1px; } }

/* ---------- right-hand "on this page" nav ---------- */
.dev_side_nav_wrap { position: relative; }
@media (max-width: 1200px) { .dev_side_nav_wrap { display: none; } }
@media (min-width: 1201px) {
  #dev_page_content_wrap.with-side { margin-left: min(170px, calc(50vw - 506px)); }
  .dev_side_nav_wrap { position: fixed; right: 16px; top: 72px; width: 240px; z-index: 2; }
  .dev_side_nav { position: static; width: 240px; }
  .dev_side_nav > ul { box-sizing: border-box; width: 240px; max-height: calc(100vh - 72px - 24px); position: relative; }
}
.dev_side_nav > ul {
  margin: 0; padding: 0 0 16px !important; list-style: none;
  overflow-y: auto !important; overflow-x: hidden; scrollbar-width: none;
}
.dev_side_nav > ul::-webkit-scrollbar { display: none; width: 0; }
.dev_side_nav li { float: none; position: relative; display: block; }
.dev_side_nav li a {
  display: block; position: relative; padding: 4px 12px !important; border-radius: 6px;
  font-size: 13px; line-height: 1.5; font-weight: 400; color: var(--side-link);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: none !important;
  transition: color .18s ease, background-color .18s ease, font-weight .18s ease;
}
.dev_side_nav li li a { padding: 4px 12px 4px 26px !important; }
.dev_side_nav li a:hover { color: var(--accent); text-decoration: none; }
.dev_side_nav li.is-current > a { color: var(--accent); font-weight: 500; }
.dev_side_nav li ul { display: none; margin: 0; padding: 0; list-style: none; }
.dev_side_nav li.active ul { display: block; }
.dev_side_nav_rail { position: absolute; top: 0; left: 0; z-index: 1; pointer-events: none; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.dev_side_nav_rail_bg { position: absolute; inset: 0; background: var(--rail); }
.dev_side_nav_rail_thumb { width: 100%; background: var(--accent); }
.dev_side_nav_rail_thumb.is-animated { transition: margin-top .2s cubic-bezier(.4,0,.2,1), height .2s cubic-bezier(.4,0,.2,1); }

/* ---------- back to top (left gutter, wide screens) ---------- */
.back_to_top_wrap {
  display: block; position: fixed; left: 0; top: 50px; bottom: 0;
  opacity: 0; pointer-events: none; cursor: default; transition: opacity .2s ease-in-out;
}
.back_to_top_wrap.back_to_top_shown { opacity: 1; pointer-events: all; cursor: pointer; }
.back_to_top_wrap:hover { text-decoration: none; }
.back_to_top { width: 120px; padding: 18px 15px 18px 7px; font-size: 15px; line-height: 18px; text-align: center; color: var(--accent); transition: background .2s ease-in-out; }
.back_to_top_wrap:hover .back_to_top { background: rgba(174,198,215,.2); }
html[data-theme="dark"] .back_to_top_wrap:hover .back_to_top { background: rgba(255,255,255,.04); }
.icon-to-top {
  display: inline-block; width: 16px; height: 7px; margin: 7px 12px 0 0; vertical-align: text-top;
  background-color: var(--accent);
  -webkit-mask: var(--chevron) 0 50% / 16px 7px no-repeat; mask: var(--chevron) 0 50% / 16px 7px no-repeat;
}

/* ---------- footer ---------- */
.footer_wrap { max-width: 925px; margin: 10px auto 0; padding: 28px 0 34px; border-top: 1px solid var(--line); color: var(--footer-text); }
.footer_columns_wrap { display: flex; flex-flow: row nowrap; justify-content: space-between; align-content: stretch; align-items: stretch; max-width: 800px; margin: 0 auto; padding-left: 0; }
.footer_mobile { display: none; }
.footer_column { flex: 0 1 auto; }
.footer_column_brand { flex: 0 1 210px; font-size: 12px; line-height: 18px; }
.footer_column h5 { font-size: 14px; line-height: 1.1; margin: 0 0 9px; color: var(--footer-text); }
.footer_column h5 a { color: inherit; }
.footer_column ul, .footer_column ul li { list-style: none; margin: 0; padding: 0; }
.footer_column ul li { font-size: 14px; line-height: 23px; }
@media (max-width: 1000px) {
  .footer_wrap { padding: 16px 0 max(16px, env(safe-area-inset-bottom)); }
  .footer_desktop { display: none; }
  .footer_mobile { display: flex; justify-content: center; }
  .footer_columns_wrap { text-align: center; }
  .footer_column { margin: 0 6px; }
  .footer_column h5 { font-size: 12px; font-weight: 600 !important; text-transform: uppercase; margin: 0; color: var(--accent); }
  .footer_column h5 a { color: var(--accent); }
}
@media print {
  .tl_page_head, .theme-toggle, .dev_side_nav_wrap, .back_to_top_wrap, .footer_wrap { display: none !important; }
  .tl_page_container { margin-top: 0; }
}
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }

/* ---------- FAQ additions (telegram.org/faq) ---------- */
/* thin rules between the opening notes */
#dev_page_content hr { box-sizing: content-box; height: 0; margin: 17px 0; border: 0; border-top: 1px solid #eee; }
html[data-theme="dark"] #dev_page_content hr { border-top-color: var(--line); }
/* the question index: a bold section link over a plain list of questions */
#dev_page_content .dev_page_nav_wrap > p { margin: 0 0 16px; }
.dev_page_nav_wrap > p > a:first-child { color: var(--text); }
#dev_page_content .dev_page_nav_wrap ul { list-style-type: none; margin: 0; padding: 0 0 20px; }
#dev_page_content .dev_page_nav_wrap ul li { background: none; padding-left: 0; padding-top: 1px; padding-bottom: 2px; }
#dev_page_content .dev_page_nav_wrap ul li + li { margin-top: 0; }
@media (max-width: 640px) {
  .dev_page_nav_wrap { margin-top: 25px; }
  .dev_page_nav_wrap > p { margin-bottom: 3.5px; }
  #dev_page_content .dev_page_nav_wrap ul li { padding: 3px 0 4px; }
  #dev_page_content .dev_page_nav_wrap ul li a:first-child { font-size: 14px; display: inline-block; }
}

/* ---------- language menu (telegram.org's globe dropdown) ---------- */
:root {
  --globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.3'%3E%3Ccircle cx='8' cy='8' r='6.6'/%3E%3Cellipse cx='8' cy='8' rx='2.9' ry='6.6'/%3E%3Cpath d='M1.6 6h12.8M1.6 10h12.8'/%3E%3C/svg%3E");
}
.dropdown { position: relative; }
.dev_top_lang_icon {
  display: inline-block; width: 16px; height: 16px; vertical-align: top; line-height: 100%; margin-right: 4px;
  background-color: currentColor;
  -webkit-mask: var(--globe) no-repeat 0 0 / 16px 16px; mask: var(--globe) no-repeat 0 0 / 16px 16px;
}
.top_lang_select .dropdown-toggle { text-align: center; }
.top_lang_select .minicaret {
  display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle;
  border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent;
}
.navbar-nav > li.top_lang_select > .dropdown-menu {
  position: absolute; top: 100%; right: 0; left: auto; z-index: 1000;
  display: block; margin: 4px 0 0; padding: 14px; list-style: none;
  width: 280px; min-width: 280px; text-align: left; font-size: 13px;
  background: #fff; border: 1px solid #e8e8e8; border-radius: 8px;
  box-shadow: 1px 1px 3px 1px rgba(0,0,0,.10);
  transform-origin: top right; transform: scaleX(.15) scaleY(.15); opacity: 0; pointer-events: none;
  transition: transform .15s ease-in-out, opacity .15s ease-out;
}
.navbar-nav > li.top_lang_select > .dropdown-menu::after { content: ""; display: table; clear: both; }
body.preload .top_lang_select > .dropdown-menu { transition: none !important; }
.navbar-nav > li.top_lang_select.open > .dropdown-menu { transform: scaleX(1) scaleY(1); opacity: 1; pointer-events: all; }
.top_lang_select .dropdown-menu li { float: left; display: block; width: 125px; }
.top_lang_select .dropdown-menu li a {
  display: inline-block; max-width: 125px; margin: 0; padding: 9px 10px; border-radius: 4px;
  font-size: 13px; line-height: 15px; color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.top_lang_select .dropdown-menu li a:hover { background: rgba(255, 92, 10, .08); text-decoration: none; }
.top_lang_select .dropdown-menu li.chosen a,
.top_lang_select .dropdown-menu li.chosen a:hover { color: #000; background: #fff; }
html[data-theme="dark"] .navbar-nav > li.top_lang_select > .dropdown-menu { background: #232e3c; border-color: rgba(255,255,255,.08); box-shadow: 0 6px 18px rgba(0,0,0,.4); }
html[data-theme="dark"] .top_lang_select .dropdown-menu li a:hover { background: var(--accent); color: #fff; }
html[data-theme="dark"] .top_lang_select .dropdown-menu li.chosen a { color: #fff; background: transparent; }

/* ---------- tabs in the middle (owner, 30 Sep 2026) ---------- */
/* Telegram floats its links left; ours sit centred on the page, with the
   language menu at the right. The container becomes a flex row, so its
   clearfix pseudo-elements must not become flex items. */
.navbar-tg .navbar-inner > .container { position: relative; display: flex; justify-content: center; }
.navbar-tg .navbar-inner > .container::before,
.navbar-tg .navbar-inner > .container::after { display: none; }
.navbar-tg .nav.navbar-nav:not(.navbar-right) { float: none; display: flex; }
.navbar-tg .navbar-right { position: absolute; top: 0; right: 44px; float: none !important; }
/* a phone has no room for centred tabs beside the menu: they start at the
   left, as on telegram.org, and scroll sideways if a language runs long */
@media (max-width: 767px) {
  .navbar-tg .navbar-inner > .container { justify-content: flex-start; }
  .navbar-tg .nav.navbar-nav:not(.navbar-right) {
    max-width: calc(100% - 80px); overflow-x: auto; scrollbar-width: none; white-space: nowrap;
  }
  .navbar-tg .nav.navbar-nav:not(.navbar-right)::-webkit-scrollbar { display: none; }
  .navbar-tg .nav > li > a { padding-left: 10px; padding-right: 10px; }
}

/* the same room on the left as the theme button takes on the right, so the
   tabs sit on the page's true centre */
@media (min-width: 768px) { .navbar-tg .navbar-inner > .container { padding-left: 44px; } }

/* the page coming in during a tab switch starts beside the column; it must
   not make the page scroll sideways (overflow-x: clip, unlike hidden, keeps
   position: sticky and the fixed nav working) */
.tl_page_container { overflow-x: clip; }

/* ---------- the site's logo at the left of the header (owner, 30 Sep 2026) ----------
   The wordmark where the "Rentown" tab was, linking home. On a desktop it
   sits at the window's left edge, as the theme button sits at its right
   (the header is a containing block, since its backdrop-filter makes it one,
   so fixed here means "in the header"). On a phone there is no logo and no
   theme button, and the page follows the phone's own light or dark: the
   tabs and the language menu get the whole row. */
.head-logo { display: flex; align-items: center; position: fixed; top: 0; left: 16px; height: 48px; z-index: 1001; }
.head-logo img { display: block; height: 20px; width: auto; }
.head-logo .logo-dark { display: none; }
html[data-theme="dark"] .head-logo .logo-light { display: none; }
html[data-theme="dark"] .head-logo .logo-dark { display: block; }
@media (max-width: 767px) {
  .head-logo, .theme-toggle { display: none !important; }
  .navbar-tg .navbar-inner > .container { padding-right: 0; }
  .navbar-tg .navbar-right { right: 4px; }
}