/* v3.css - обвязка механик внутри живой главной (тест /v2/). Правило проекта: инлайновый
   <style> страницы бьёт общий styles.css, поэтому всё здесь, отдельным файлом после pui-core. */

/* плашка гамм и движения - маленькая, внизу справа, кнопки явные и подписанные */
.v3-bar{position:fixed;right:14px;bottom:14px;z-index:58;display:flex;gap:4px;padding:5px;border-radius:999px;
  background:color-mix(in srgb,var(--night-bg) 88%,transparent);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px)}
.v3-bar button{cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;border:1px solid transparent;
  background:transparent;color:#9B9EA4;font:600 12.5px/1 "Golos",system-ui,sans-serif}
.v3-bar button i{width:9px;height:9px;border-radius:50%;background:var(--sw)}
.v3-bar button:hover,.v3-bar button:focus-visible{color:#F2F1EE;border-color:var(--accent);outline:0}
.v3-bar button[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) 22%,transparent);color:#F2F1EE}
@media(max-width:860px){.v3-bar{bottom:72px;right:10px}.v3-bar button span{display:none}.v3-bar button{padding:7px 9px}}

/* секция механики: рамка-прибор всегда тёмная - на рассветных секциях это стоящий на столе прибор */
.v3.sec{padding-block:calc(var(--sec) * .45)}
.sec + .v3.sec,.v3.sec + .sec,.band--act + .v3.sec{padding-top:calc(var(--sec) * .38)}
.v3-frame{border-radius:22px;border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);
  background:var(--pui-bg,#05060C);color:var(--pui-fg,#F3F1EC);padding:clamp(16px,2.4vw,28px);
  box-shadow:0 30px 80px -40px rgba(0,0,0,.55)}
.dawn .v3-frame{box-shadow:0 30px 70px -30px rgba(21,22,26,.35);border-color:rgba(21,22,26,.14)}
.host{display:block}
@media(max-width:600px){.v3-frame{padding:14px;border-radius:16px}}

/* без движения: остановить всё в обвязке (внутри теней - атрибут data-reduced) */
html.v3-reduced *,html.v3-reduced *::before,html.v3-reduced *::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}

/* /v2/: текст рядом с портретом стал короче - выравниваем по центру строки */
.who{align-items:center}
