/* ============================================================ pv2 switcher — floating variant/theme pill, shared by all pages Self-contained: does not depend on any page CSS or tokens.css. Pair with shared/switcher.js (renders #pv2-switcher into ). ============================================================ */ #pv2-switcher{ --sw-bg:rgba(16,22,31,.78); --sw-line:rgba(255,255,255,.16); --sw-text:#E8EEF6; --sw-muted:rgba(232,238,246,.62); --sw-active-bg:#E8EEF6; --sw-active-text:#10161F; --sw-focus:#8CC3E3; position:fixed;left:50%;bottom:18px;transform:translateX(-50%); z-index:9999; display:flex;align-items:center;gap:2px; padding:5px; background:var(--sw-bg); border:1px solid var(--sw-line); border-radius:999px; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 8px 28px rgba(0,0,0,.35); font-family:Consolas,"Cascadia Mono",ui-monospace,Menlo,monospace; font-size:13px;line-height:1; } html[data-theme="light"] #pv2-switcher{ --sw-bg:rgba(255,255,255,.82); --sw-line:rgba(14,23,33,.14); --sw-text:#10161F; --sw-muted:rgba(16,22,31,.6); --sw-active-bg:#10161F; --sw-active-text:#F2F6FA; --sw-focus:#1E6E9E; box-shadow:0 8px 28px rgba(18,32,52,.18); } #pv2-switcher a, #pv2-switcher button{ display:inline-flex;align-items:center;justify-content:center; min-width:34px;height:34px;padding:0 10px; border:0;border-radius:999px; background:transparent;color:var(--sw-muted); font:inherit;text-decoration:none;cursor:pointer; transition:color .18s ease,background-color .18s ease; } #pv2-switcher a:hover, #pv2-switcher button:hover{color:var(--sw-text);background:rgba(127,127,127,.16)} #pv2-switcher a:focus-visible, #pv2-switcher button:focus-visible{ outline:2px solid var(--sw-focus);outline-offset:2px;color:var(--sw-text); } #pv2-switcher a[aria-current="page"]{ background:var(--sw-active-bg);color:var(--sw-active-text); } #pv2-switcher .pv2-sep{ width:1px;height:18px;margin:0 4px;background:var(--sw-line); } /* inline variant — the page provided [data-pv2-switcher-slot] (e.g. inside a sticky masthead): no fixed overlay, no glass pill, just a compact round toggle that sits in the running head */ #pv2-switcher.pv2-inline{ position:static;transform:none; padding:0;background:transparent;border:0;border-radius:0; -webkit-backdrop-filter:none;backdrop-filter:none; box-shadow:none; } #pv2-switcher.pv2-inline button{ min-width:28px;height:28px;padding:0; border:1px solid var(--sw-line); color:var(--sw-muted);font-size:14px; } #pv2-switcher.pv2-inline button:hover{color:var(--sw-text)} html[data-theme="dark"] #pv2-switcher.pv2-inline{ /* прозрачный фон — контур и текст берут цвета страницы, не стекла */ --sw-line:rgba(232,238,246,.22); } html[data-theme="light"] #pv2-switcher.pv2-inline{ /* light-тема задаёт box-shadow селектором выше по специфичности, чем .pv2-inline — гасим явно, иначе вокруг круглой кнопки проступает квадратная тень стеклянного pill */ box-shadow:none; } @media (max-width:600px){ #pv2-switcher{bottom:12px} } @media (prefers-reduced-motion:reduce){ #pv2-switcher a, #pv2-switcher button{transition:none} } @media print{ #pv2-switcher{display:none} }