/* Беофф: служебное оформление музея */
html { font-synthesis: none; }
.bx-museum { position: fixed; right: 0; bottom: 0; z-index: 99999; background: #ffffe1; color: #000 !important;
  border: 1px solid #000; border-width: 1px 0 0 1px; padding: 2px 6px; font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; text-decoration: none; }
.bx-museum:hover { background: #0a246a; color: #fff !important; }
.bx-adv { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
  border: 1px solid #ff8080; color: #ff8080; font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; background: #fff; }
/* Видео с YouTube: заглушка плеера тех лет, клик открывает ролик на YouTube. Ширину ужимаем под колонку с сохранением пропорций. */
.bx-video { display: inline-block; position: relative; vertical-align: top; max-width: 100%; height: auto; cursor: pointer;
  background: #000 radial-gradient(ellipse at center, #2a2a2a 0%, #000 70%); }
.bx-play { position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; margin: -24px 0 0 -34px;
  border-radius: 12px; background: rgba(33, 33, 33, .85); }
.bx-play::after { content: ""; position: absolute; left: 27px; top: 14px; border-style: solid; border-width: 10px 0 10px 17px;
  border-color: transparent transparent transparent #fff; }
.bx-video:hover .bx-play { background: #cc181e; }
.bx-vcap { position: absolute; right: 8px; bottom: 6px; color: #ccc; font: bold 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; }
/* Музыка из умерших сервисов (muzebra, prostopleer): полоска на месте плеера */
.bx-audio { display: inline-flex; align-items: center; box-sizing: border-box; max-width: 100%; padding: 0 8px; vertical-align: middle;
  border: 1px solid #ccc; background: #eee; color: #888; font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; }
bx-t { display: inline; position: relative; filter: url(#bxc); }
bx-t.l { filter: url(#bxl); }

/* ---- Формы в стиле Windows XP (Luna) ---- */
input[type=text], input[type=password], input[type=search], input:not([type]), textarea, select {
  font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; color: #000; background: #fff;
  border: 1px solid #7f9db9; border-radius: 0; padding: 2px 3px; box-shadow: none; outline: none; }
input[type=text]:focus, input[type=password]:focus, input:not([type]):focus, textarea:focus { border-color: #7f9db9; }
/* Кнопки — по режиму шрифта (Кирилл, 27.09): XP — Luna, сглаженный — как в современном Chrome. Класс на <html> ставит px.js
   (bx-xp / bx-smooth); без него — Luna. Кнопка «Выберите файл» (::file-selector-button) — в том же виде, что и все. */
html:not(.bx-smooth) input[type=submit], html:not(.bx-smooth) input[type=button], html:not(.bx-smooth) input[type=reset],
html:not(.bx-smooth) button, html:not(.bx-smooth) input[type=file]::file-selector-button {
  font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; color: #000; min-height: 23px; padding: 0 10px; cursor: default;
  border: 1px solid #003c74; border-radius: 3px;
  background: linear-gradient(#ffffff 0%, #f5f4ef 40%, #ecebe6 86%, #d6d0c5 100%); }
html:not(.bx-smooth) input[type=file]::file-selector-button { margin-right: 6px; }
html:not(.bx-smooth) input[type=file] { font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; }
html:not(.bx-smooth) input[type=submit]:hover, html:not(.bx-smooth) input[type=button]:hover, html:not(.bx-smooth) input[type=reset]:hover,
html:not(.bx-smooth) button:hover, html:not(.bx-smooth) input[type=file]::file-selector-button:hover {
  box-shadow: inset 0 1px 0 #fff0cf, inset 0 -1px 0 #e5a01a, inset 1px 0 0 #fbd88b, inset -1px 0 0 #f8b636,
              inset 0 2px 0 #fdd889, inset 0 -2px 0 #f8b636; }
html:not(.bx-smooth) input[type=submit]:active, html:not(.bx-smooth) input[type=button]:active, html:not(.bx-smooth) button:active,
html:not(.bx-smooth) input[type=file]::file-selector-button:active {
  background: linear-gradient(#e5e4de 0%, #e3e2da 80%, #f2f1ec 100%); box-shadow: none; }
/* Сглаженный режим: кнопки как в Chrome (2020–2026, светлая тема Windows) — прописано явно, чтобы обновления браузера
   не меняли вид: фон #efefef, рамка #767676, скругление 2px, Arial 13.33px; наведение/нажатие — как у Chrome. */
html.bx-smooth input[type=submit], html.bx-smooth input[type=button], html.bx-smooth input[type=reset],
html.bx-smooth button, html.bx-smooth input[type=file]::file-selector-button {
  -webkit-appearance: none; appearance: none; font: 13.3333px Arial, sans-serif; color: #000; cursor: default;
  min-height: 0; padding: 1px 6px; border: 1px solid #767676; border-radius: 2px; background: #efefef; box-shadow: none; }
html.bx-smooth input[type=file]::file-selector-button { margin-right: 4px; }
html.bx-smooth input[type=submit]:hover, html.bx-smooth input[type=button]:hover, html.bx-smooth input[type=reset]:hover,
html.bx-smooth button:hover, html.bx-smooth input[type=file]::file-selector-button:hover { background: #e5e5e5; border-color: #4f4f4f; }
html.bx-smooth input[type=submit]:active, html.bx-smooth input[type=button]:active, html.bx-smooth input[type=reset]:active,
html.bx-smooth button:active, html.bx-smooth input[type=file]::file-selector-button:active { background: #f5f5f5; border-color: #8d8d8d; }
html.bx-smooth input[type=submit]:disabled, html.bx-smooth input[type=button]:disabled, html.bx-smooth button:disabled {
  background: rgba(239, 239, 239, 0.3); border-color: rgba(118, 118, 118, 0.3); color: rgba(16, 16, 16, 0.3); }
input[type=checkbox], input[type=radio] {
  -webkit-appearance: none; appearance: none; width: 13px; height: 13px; margin: 0 4px 0 2px; vertical-align: -2px;
  border: 1px solid #1c5180; background: linear-gradient(135deg, #dcdcd7, #ffffff); box-sizing: border-box; }
input[type=radio] { border-radius: 50%; }
input[type=checkbox]:checked {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' shape-rendering='crispEdges'%3E%3Cpath fill='%2321a121' d='M2 4h1v1h1v1h1V5h1V4h1V3h1V2h1v3H8v1H7v1H6v1H5v1H4V8H3V7H2z'/%3E%3C/svg%3E") center/11px no-repeat,
              linear-gradient(135deg, #dcdcd7, #ffffff); }
input[type=radio]:checked {
  background: radial-gradient(circle at 50% 50%, #55d551 0, #21a121 2.2px, transparent 2.6px), linear-gradient(135deg, #dcdcd7, #ffffff); }
input[type=checkbox]:hover, input[type=radio]:hover { box-shadow: inset 0 0 0 1px #fbd88b, inset 0 0 0 2px #f8b636; }
select { -webkit-appearance: none; appearance: none; padding-right: 20px; height: 21px;
  /* кнопка со стрелкой — классическая серая объёмная, как полосы прокрутки (Кирилл, 28.09) */
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' shape-rendering='crispEdges'%3E%3Crect width='16' height='17' fill='%23d4d0c8'/%3E%3Cpath fill='%23fff' d='M0 0h15v1H1v15H0z'/%3E%3Cpath fill='%23808080' d='M1 15h14v1H1zM14 1h1v14h-1z'/%3E%3Cpath fill='%23404040' d='M0 16h16v1H0zM15 0h1v17h-1z'/%3E%3Cpath fill='%23000' d='M4 7h7v1h-1v1H9v1H8v1H7v-1H6V9H5V8H4z'/%3E%3C/svg%3E") right 1px center no-repeat; }

/* ---- Сглаженный режим: поля, выпадающие списки, галки и радиокнопки — как в современном Chrome (Windows, светлая тема),
   прописано явно (Кирилл, 28.09: один тулкит на режим; обновления браузера не должны менять вид) ---- */
html.bx-smooth input[type=text], html.bx-smooth input[type=password], html.bx-smooth input[type=search], html.bx-smooth input[type=email], html.bx-smooth input:not([type]), html.bx-smooth select {
  font: 13.3333px Arial, sans-serif; color: #000; background: #fff; border: 1px solid #767676; border-radius: 2px;
  padding: 1px 2px; box-shadow: none; height: auto; }
html.bx-smooth textarea { font: 13.3333px Consolas, "Courier New", "bx-emoji", monospace; color: #000; background: #fff; border: 1px solid #767676;
  border-radius: 2px; padding: 2px; box-shadow: none; }
html.bx-smooth input[type=text]:focus, html.bx-smooth input[type=password]:focus, html.bx-smooth input[type=search]:focus, html.bx-smooth input[type=email]:focus,
html.bx-smooth input:not([type]):focus, html.bx-smooth textarea:focus, html.bx-smooth select:focus { outline: 2px solid #101010; outline-offset: -1px; border-color: #767676; }
html.bx-smooth select { -webkit-appearance: none; appearance: none; padding: 1px 22px 1px 3px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") right 7px center no-repeat; }
html.bx-smooth select:hover { border-color: #4f4f4f; }
html.bx-smooth input[type=checkbox], html.bx-smooth input[type=radio] { -webkit-appearance: none; appearance: none; width: 13px; height: 13px;
  margin: 3px 4px 3px 3px; vertical-align: -2px; box-sizing: border-box; border: 1px solid #767676; background: #fff; box-shadow: none; }
html.bx-smooth input[type=checkbox] { border-radius: 2px; }
html.bx-smooth input[type=radio] { border-radius: 50%; }
html.bx-smooth input[type=checkbox]:hover, html.bx-smooth input[type=radio]:hover { border-color: #4f4f4f; box-shadow: none; }
html.bx-smooth input[type=checkbox]:checked { background: #0075ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11'%3E%3Cpath d='M2.2 5.6l2.3 2.3 4.4-4.6' fill='none' stroke='%23fff' stroke-width='1.8'/%3E%3C/svg%3E") center / 11px no-repeat; border-color: #0075ff; }
html.bx-smooth input[type=checkbox]:checked:hover { background-color: #005cc8; border-color: #005cc8; }
html.bx-smooth input[type=radio]:checked { border-color: #0075ff; background: radial-gradient(circle, #0075ff 0 3.5px, #fff 4px); }
html.bx-smooth input[type=radio]:checked:hover { border-color: #005cc8; background: radial-gradient(circle, #005cc8 0 3.5px, #fff 4px); }

/* ---- Полосы прокрутки — по режиму шрифта, как кнопки (Кирилл, 27–28.09): XP — классические Windows 98/2000 (серые объёмные,
   клетчатая дорожка, чёрные стрелки; голубые Luna не вязались с кнопками), сглаженный — классические Chrome (серые, плоские);
   всё прописано явно, чтобы обновления браузера не меняли вид ---- */
html:not(.bx-smooth)::-webkit-scrollbar, html:not(.bx-smooth) ::-webkit-scrollbar { width: 16px; height: 16px; background: #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-track, html:not(.bx-smooth) ::-webkit-scrollbar-track { background: repeating-conic-gradient(#d4d0c8 0% 25%, #ffffff 0% 50%) 0 0 / 2px 2px; }
html:not(.bx-smooth)::-webkit-scrollbar-thumb, html:not(.bx-smooth) ::-webkit-scrollbar-thumb { background: #d4d0c8; border: 0; border-radius: 0; box-shadow: inset -1px -1px #404040, inset 1px 1px #ffffff, inset -2px -2px #808080, inset 2px 2px #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button { display: block; width: 16px; height: 16px; border: 0; border-radius: 0; background-color: #d4d0c8; box-shadow: inset -1px -1px #404040, inset 1px 1px #ffffff, inset -2px -2px #808080, inset 2px 2px #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button:vertical:decrement, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button:vertical:decrement { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath fill='%23000000' d='M7 6h1v1h1v1h1v1h1v1H4V9h1V8h1V7h1z'/%3E%3C/svg%3E") center no-repeat #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button:vertical:increment, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button:vertical:increment { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath fill='%23000000' d='M4 6h7v1h-1v1H9v1H8v1H7V9H6V8H5V7H4z'/%3E%3C/svg%3E") center no-repeat #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button:horizontal:decrement, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button:horizontal:decrement { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath fill='%23000000' d='M9 4v7H8v-1H7V9H6V8H5V7h1V6h1V5h1V4z'/%3E%3C/svg%3E") center no-repeat #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button:horizontal:increment, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button:horizontal:increment { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath fill='%23000000' d='M6 4v7h1v-1h1V9h1V8h1V7H9V6H8V5H7V4z'/%3E%3C/svg%3E") center no-repeat #d4d0c8; }
html:not(.bx-smooth)::-webkit-scrollbar-button:single-button:active, html:not(.bx-smooth) ::-webkit-scrollbar-button:single-button:active { box-shadow: inset 1px 1px #808080, inset -1px -1px #808080; background-position: calc(50% + 1px) calc(50% + 1px); }
html:not(.bx-smooth)::-webkit-scrollbar-corner, html:not(.bx-smooth) ::-webkit-scrollbar-corner { background: #d4d0c8; }
/* сглаженный: классические полосы Chrome (Windows) */
html.bx-smooth::-webkit-scrollbar, html.bx-smooth ::-webkit-scrollbar { width: 17px; height: 17px; background: #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-track, html.bx-smooth ::-webkit-scrollbar-track { background: #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-thumb, html.bx-smooth ::-webkit-scrollbar-thumb { background: #c1c1c1; border: 2px solid #f1f1f1; border-radius: 0; box-shadow: none; }
html.bx-smooth::-webkit-scrollbar-thumb:hover, html.bx-smooth ::-webkit-scrollbar-thumb:hover { background: #a8a8a8; }
html.bx-smooth::-webkit-scrollbar-thumb:active, html.bx-smooth ::-webkit-scrollbar-thumb:active { background: #787878; }
html.bx-smooth::-webkit-scrollbar-button:single-button, html.bx-smooth ::-webkit-scrollbar-button:single-button { display: block; height: 17px; width: 17px; border: 0; border-radius: 0; box-shadow: none; background-color: #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-button:single-button:vertical:decrement, html.bx-smooth ::-webkit-scrollbar-button:single-button:vertical:decrement { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' shape-rendering='crispEdges'%3E%3Cpath fill='%23505050' d='M8 6h1v1h1v1h1v1h1v1H5V9h1V8h1V7h1z'/%3E%3C/svg%3E") center no-repeat #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-button:single-button:vertical:increment, html.bx-smooth ::-webkit-scrollbar-button:single-button:vertical:increment { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' shape-rendering='crispEdges'%3E%3Cpath fill='%23505050' d='M5 7h7v1h-1v1h-1v1H9v1H8v-1H7V9H6V8H5z'/%3E%3C/svg%3E") center no-repeat #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-button:single-button:horizontal:decrement, html.bx-smooth ::-webkit-scrollbar-button:single-button:horizontal:decrement { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' shape-rendering='crispEdges'%3E%3Cpath fill='%23505050' d='M10 5v7H9v-1H8v-1H7V9H6V8h1V7h1V6h1V5z'/%3E%3C/svg%3E") center no-repeat #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-button:single-button:horizontal:increment, html.bx-smooth ::-webkit-scrollbar-button:single-button:horizontal:increment { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' shape-rendering='crispEdges'%3E%3Cpath fill='%23505050' d='M7 5v7h1v-1h1v-1h1V9h1V8h-1V7H9V6H8V5z'/%3E%3C/svg%3E") center no-repeat #f1f1f1; }
html.bx-smooth::-webkit-scrollbar-button:single-button:hover, html.bx-smooth ::-webkit-scrollbar-button:single-button:hover { background-color: #d2d2d2; }
html.bx-smooth::-webkit-scrollbar-corner, html.bx-smooth ::-webkit-scrollbar-corner { background: #f1f1f1; }
.bx-soft bx-t, .bx-soft bx-t.l { filter: none; }
/* нецелый масштаб экрана: пиксельные шрифты растягиваются и мылятся — полям и кнопкам обычный Tahoma (px.js делает так же для текста) */
.bx-soft input, .bx-soft textarea, .bx-soft select, .bx-soft button, .bx-soft .bx-vcap, .bx-soft .bx-audio { font-family: Tahoma, "bx-emoji", sans-serif !important; }
.bx-fontmode { right: 44px; }
/* крупный текст: настоящий шрифт, серое сглаживание как «Стандартное» на XP (opacity отключает ClearType) */
bx-t.g { filter: none; opacity: 0.999; }
.bx-vbar { position: fixed; left: 0; bottom: 0; z-index: 99999; background: #ffffe1; border: 1px solid #000; border-width: 1px 1px 0 0;
  padding: 2px 6px; font: 11px "bx-tahoma-11", Tahoma, "bx-emoji", sans-serif; color: #000; }
.bx-vbar a { color: #0048AB; margin: 0 2px; } .bx-vbar b { margin: 0 2px; }
