Код:

<!-- Тёмная тема -->
<style>#html-header{position:relative}.StyleSwitch{height:20px;width:20px;position:absolute;z-index:1000;right:5px;top:50px;border-radius:50%;cursor:pointer;box-shadow:0 0 10px rgba(0,0,0,.7);transition:.1s ease}.StyleSwitch:hover{opacity:.8}.StyleSwitch.St{background:#426B9A url(https://forumstatic.ru/files/0016/a6/f8/90261.png) center center no-repeat!important;background-size:16px!important}.StyleSwitch.My{background:#6996CA url(https://forumstatic.ru/files/0016/a6/f8/22564.png) center center no-repeat!important;background-size:16px!important}body.dark-theme .post .post-body::before{border-color:transparent #4a5b70 transparent transparent !important}body.dark-theme .post .post-body::after{border-color:transparent #2d3748 transparent transparent !important}body.dark-theme .postVoters strong{background:#c0c0c0;padding:2px 4px;border-radius:4px;color:#000}body.dark-theme .punbb .post-content p a{background:rgba(255,255,255,0.1);border-radius:3px;padding:2px}body.dark-theme .punbb .post-content p a:hover{color:teal}</style><script>(function(){var style='https://forumstatic.ru/files/001a/f0/7d/20423.css?v=2';style='<link rel="stylesheet" id="StyleAdd" type="text/css" href="'+style+'"/>';function setStyle(){$('link[rel="stylesheet"]:last').after(style);$('.StyleSwitch').removeClass('St').addClass('My');$('.StyleSwitch').attr('title','Стандартный стиль');$('body').addClass('dark-theme')}$('#html-header').prepend('<span class="StyleSwitch St" title="Затемненный стиль"></span>');$('.StyleSwitch').tipsy({fade:true,gravity:'nw'});if($getCookie('StyleSwitch')){setStyle();}$('.StyleSwitch.St').live('click',function(){$setCookie('StyleSwitch','My',30*3600*24*30*1000);setStyle();});$('.StyleSwitch.My').live('click',function(){$('link#StyleAdd').remove();$deleteCookie('StyleSwitch');$('.StyleSwitch').addClass('St').removeClass('My');$('.StyleSwitch').attr('title','Затемненный стиль');$('body').removeClass('dark-theme');});})();</script>
<!-- Конец тёмной темы -->

Код:

<!-- Тёмная тема и вспомогательные стили -->
<style>
/* ===== Переключатель темы ===== */
#html-header {
    position: relative; /* Чтобы кнопка StyleSwitch позиционировалась относительно header */
}
.StyleSwitch {
    height: 20px;
    width: 20px;
    position: absolute;
    z-index: 1000;
    right: 5px; /* Отступ справа */
    top: 50px;  /* Отступ сверху */
    border-radius: 50%; /* Круглая кнопка */
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,.7); /* Тень для объёма */
    transition: .1s ease; /* Плавная анимация при наведении */
}
.StyleSwitch:hover { opacity: .8; } /* Лёгкое затемнение при наведении */
.StyleSwitch.St {
    background: #426B9A url(https://forumstatic.ru/files/0016/a6/f8/22564.png) center center no-repeat!important;
    background-size: 16px!important; /* Иконка стандартного стиля */
}
.StyleSwitch.My {
    background: #6996CA url(https://forumstatic.ru/files/0016/a6/f8/90261.png) center center no-repeat!important;
    background-size: 16px!important; /* Иконка тёмного стиля */
}

/* ===== Треугольники (только для тёмной темы) ===== */
body.dark-theme .post .post-body::before {
    border-color: transparent #4a5b70 transparent transparent !important; /* тёмный фон треугольника */
}
body.dark-theme .post .post-body::after {
    border-color: transparent #2d3748 transparent transparent !important; /* тёмная окантовка */
}

/* ===== "Сказали спасибо" (только для тёмной темы) ===== */
body.dark-theme .postVoters strong {
    background: #c0c0c0; /* серебристый фон */
    padding: 2px 4px;
    border-radius: 4px;
    color: #000; /* чёрный текст */
}

/* ===== Подсветка ссылок в постах (только для тёмной темы) ===== */
body.dark-theme .punbb .post-content p a {
    background: rgba(255,255,255,0.1); /* мягкий светлый фон */
    border-radius: 3px;
    padding: 2px;
}
body.dark-theme .punbb .post-content p a:hover { color: teal; } /* цвет текста при наведении */
</style>

<script type="text/javascript">
(function () {
    var style = 'https://forumstatic.ru/files/001a/f0/7d/73291.css?v=45'; // Ссылка на внешний CSS для тёмной темы
    style = '<link rel="stylesheet" id="StyleAdd" type="text/css" href="'+style+'"/>';

    /* ===== Функция включения тёмного стиля ===== */
    function setStyle () {
        $('link[rel="stylesheet"]:last').after(style); // Подключаем внешний CSS
        $('.StyleSwitch').removeClass('St').addClass('My'); // Меняем иконку кнопки
        $('.StyleSwitch').attr('title','Стандартный стиль'); // Подпись кнопки
        $('body').addClass('dark-theme'); // Добавляем класс тёмной темы
    }

    /* ===== Добавляем кнопку в HTML ===== */
    $('#html-header').prepend('<span class="StyleSwitch St" title="Затемненный стиль"></span>');
    $('.StyleSwitch').tipsy({fade: true, gravity: 'nw'}); // Подсказка при наведении

    if($getCookie('StyleSwitch')) { setStyle (); } // Если включена тёмная тема, применяем сразу

    /* ===== Событие клика по кнопке для включения ===== */
    $('.StyleSwitch.St').live('click', function () {
        $setCookie('StyleSwitch','My',30*3600*24*30*1000); // Сохраняем cookie на 30 дней
        setStyle ();
    });  

    /* ===== Событие клика по кнопке для выключения ===== */
    $('.StyleSwitch.My').live('click', function () {
        $('link#StyleAdd').remove(); // Убираем подключённый CSS
        $deleteCookie('StyleSwitch'); // Удаляем cookie
        $('.StyleSwitch').addClass('St').removeClass('My'); // Меняем иконку на стандартную
        $('.StyleSwitch').attr('title','Затемненный стиль');
        $('body').removeClass('dark-theme'); // Убираем класс тёмной темы
    });
})();
</script>
<!-- Конец тёмной темы -->

Код:

<!-- Тёмная тема без вспышки -->
<style id="dark-loader-style" disabled>
  #dark-loader {
    position: fixed;
    z-index: 99999;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    background: #121212;
    pointer-events: none;
  }
</style>

<script>
// Вставляем затемняющий экран сразу, если активна тёмная тема
(function () {
  if (document.cookie.indexOf('StyleSwitch=My') !== -1) {
    document.getElementById('dark-loader-style').disabled = false;
    var loader = document.createElement('div');
    loader.id = 'dark-loader';
    document.body.appendChild(loader);

    window.addEventListener('load', function () {
      setTimeout(() => {
        document.getElementById('dark-loader')?.remove();
      }, 50); // Можете увеличить до 100–200, если фон всё равно мелькает
    });
  }
})();
</script>

<style>
/* Стили кнопки и темы */
#html-header{position:relative}
.StyleSwitch{height:20px;width:20px;position:absolute;z-index:1000;right:5px;top:50px;border-radius:50%;cursor:pointer;box-shadow:0 0 10px rgba(0,0,0,.7);transition:.1s ease}
.StyleSwitch:hover{opacity:.8}
.StyleSwitch.St{background:#426B9A url(https://forumstatic.ru/files/0016/a6/f8/90261.png) center center no-repeat!important;background-size:16px!important}
.StyleSwitch.My{background:#6996CA url(https://forumstatic.ru/files/0016/a6/f8/22564.png) center center no-repeat!important;background-size:16px!important}
body.dark-theme .post .post-body::before{border-color:transparent #4a5b70 transparent transparent !important}
body.dark-theme .post .post-body::after{border-color:transparent #2d3748 transparent transparent !important}
body.dark-theme .postVoters strong{background:#c0c0c0;padding:2px 4px;border-radius:4px;color:#000}
body.dark-theme .punbb .post-content p a{background:rgba(255,255,255,0.1);border-radius:3px;padding:2px}
body.dark-theme .punbb .post-content p a:hover{color:teal}
</style>
<!-- Тёмная тема без вспышки -->

Код:

<!--🌙 Плавающий переключатель тёмной темы (фиксированно с регулировкой от верха) -->
<script>
(function(){
  var topOffset = 270; // ⬆️ Положение кнопки от верха (можно менять)
  var mobileMaxWidth = 600; // 📱 Порог ширины для мобильного

  function isMobile(){ return window.innerWidth <= mobileMaxWidth; }
  function isHome(){ return location.pathname === '/' || location.pathname.endsWith('index.php'); }

  function updateButtonTheme(btn) {
    const isDark = document.cookie.includes('StyleSwitch=My');
    btn.style.background = isDark
      ? '#6996CA url("https://forumstatic.ru/files/0016/a6/f8/22564.png") center/50% no-repeat'
      : '#426B9A url("https://forumstatic.ru/files/0016/a6/f8/90261.png") center/50% no-repeat';
    btn.title = isDark ? 'Светлая тема' : 'Тёмная тема';
  }

  function createMobileSwitch(){
    if (!isMobile() || !isHome()) return;
    if (document.getElementById('mobile-style-switch')) return;

    const btn = document.createElement('div');
    btn.id = 'mobile-style-switch';
    document.body.appendChild(btn);

    const style = document.createElement('style');
    style.textContent = `
      #mobile-style-switch {
        position: fixed;
        top: ${topOffset}px;
        right: 15px;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #426B9A url('https://forumstatic.ru/files/0016/a6/f8/90261.png') center/50% no-repeat;
        box-shadow: 0 0 8px rgba(0,0,0,0.6);
        z-index: 10000;
        cursor: pointer;
        transition: transform 0.2s ease;
      }
      #mobile-style-switch:active {
        transform: scale(0.9);
      }
    `;
    document.head.appendChild(style);

    updateButtonTheme(btn); // выставляем начальное состояние

    btn.addEventListener('click', function(){
      const desktopBtn = document.querySelector('.StyleSwitch');
      if (desktopBtn) {
        desktopBtn.click();
        setTimeout(() => updateButtonTheme(btn), 100); // ⚡ небольшая задержка, чтобы тема успела примениться
      }
    });
  }

  function waitForBody(){
    if (document.body){
      createMobileSwitch();
    } else {
      setTimeout(waitForBody, 50);
    }
  }
  waitForBody();

  window.addEventListener('resize', createMobileSwitch);
})();
</script>
<!--🌙 Плавающий переключатель тёмной темы (фиксированно с регулировкой от верха) -->