/* Manrope со своего сервера (шрифты лежат в /static/fonts), без внешних адресов */
@font-face{font-family:'Manrope';font-weight:500;font-display:swap;src:url(/static/fonts/manrope-cyrillic-500.woff2) format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Manrope';font-weight:500;font-display:swap;src:url(/static/fonts/manrope-latin-500.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:600 700;font-display:swap;src:url(/static/fonts/manrope-cyrillic-600.woff2) format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Manrope';font-weight:600 700;font-display:swap;src:url(/static/fonts/manrope-latin-600.woff2) format('woff2')}
/* CVY Online — вход «пополам».
   ПРАВИЛО ВЛАДЕЛЬЦА (2026-10-14): вход как у дорогих компаний — слева тёмно-синий живой фон и логотип A,
   справа форма входа; на телефоне логотип сверху.
   ПРАВИЛО ВЛАДЕЛЬЦА (2026-10-14): логотип A — ОРИГИНАЛЬНЫЙ файл, пиксель в пиксель. Эффекты только ВОКРУГ логотипа.
   ПРАВИЛО ВЛАДЕЛЬЦА: форма входа работает как раньше (логин, пароль, EN/RU, Face ID, «Забыли пароль?»), меняется только вид.
   ПРАВИЛО ВЛАДЕЛЬЦА: никаких рамок при нажатии/фокусе — только смена цвета.
   Три вида (login-split.js, LOOK): sweep — один блик при открытии + световая линия под логотипом;
   halo — сияние и мягкие лучи света вокруг; glass — логотип на стеклянной плашке с отражением. */
body.lg-split{--lg-w:54vw;--lg-font:'Manrope','Inter',system-ui,sans-serif;padding-left:var(--lg-w);min-height:100vh;box-sizing:border-box;
  background:radial-gradient(1000px 600px at 100% 0,rgba(29,95,174,.07),transparent 60%),radial-gradient(800px 500px at 60% 100%,rgba(29,95,174,.04),transparent 60%),#f7f9fc;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* ---------- левая панель ---------- */
#lg-hero{position:fixed;left:0;top:0;bottom:0;width:var(--lg-w);overflow:hidden;color:#fff;z-index:0;pointer-events:none;user-select:none;
  /* неподвижный фон (он же на слабых телефонах), без грязных тёмных пятен */
  background:radial-gradient(70% 55% at 50% 48%,#09264a 0,#082142 45%,transparent 80%),radial-gradient(900px 700px at 8% 0,#0f3363,transparent 62%),radial-gradient(900px 700px at 100% 100%,#0c2c58,transparent 60%),#061630}
#lg-hero.lg-look-glass{background:radial-gradient(900px 700px at 12% 6%,#245394,transparent 60%),radial-gradient(800px 650px at 95% 95%,#173f78,transparent 60%),#0a1f40}
#lg-hero>*{position:absolute}
#lg-hero .lg-bg{inset:0;opacity:0;transition:opacity 1s}
#lg-hero.lg-live .lg-bg{opacity:1}
/* тонкая сетка точек — «технологичный» фон, гаснет к краям */
#lg-hero .lg-grid{inset:0;background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.3px);background-size:24px 24px;
  -webkit-mask:radial-gradient(ellipse 65% 55% at 50% 50%,#000 10%,transparent 72%);mask:radial-gradient(ellipse 65% 55% at 50% 50%,#000 10%,transparent 72%);opacity:.55}
/* зерно — убирает полосы в градиенте, даёт «дорогую» глубину */
#lg-hero .lg-grain{inset:0;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* лёгкая виньетка и тонкий световой край справа */
#lg-hero .lg-vig{inset:0;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(2,8,20,.45))}
#lg-hero .lg-edge{top:0;bottom:0;right:0;width:1px;background:linear-gradient(180deg,transparent,rgba(160,205,255,.35) 30%,rgba(160,205,255,.35) 70%,transparent)}
#lg-hero .lg-brand{inset:0;z-index:1;display:flex;justify-content:center;align-items:center} /* логотип выше зерна и виньетки: они его не трогают */
#lg-hero .lg-plate{position:relative;width:min(540px,80%)}
#lg-hero .lg-logo{position:relative;width:100%;line-height:0}
#lg-hero .lg-logo img{position:relative;z-index:1;display:block;width:100%;height:auto}
#lg-hero .lg-foot{left:40px;bottom:32px;font:500 12px/1 var(--lg-font);letter-spacing:.02em;color:rgba(200,216,236,.62)}
#lg-hero .lg-sh,#lg-hero .lg-halo,#lg-hero .lg-rays,#lg-hero .lg-floor{display:none}

/* края плашки логотипа плавно уходят в фон (по замеру буквы занимают x 20–514, y 29–193 из 540×220 — маска их не задевает) */
#lg-hero.lg-look-sweep .lg-logo img,#lg-hero.lg-look-halo .lg-logo img{
  -webkit-mask:linear-gradient(90deg,transparent,#000 3.5%,#000 96.5%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent,#000 3.5%,#000 96.5%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-composite:intersect}
/* подложка цвета края логотипа, чтобы плашка не читалась прямоугольником */
#lg-hero.lg-look-sweep .lg-halo,#lg-hero.lg-look-halo .lg-halo{display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}
#lg-hero.lg-look-sweep .lg-halo{width:160%;height:250%;background:radial-gradient(closest-side,rgba(11,48,92,.95) 0,rgba(9,38,74,.85) 38%,rgba(9,38,74,.4) 58%,transparent 80%)}

/* A. sweep — один мягкий блик при открытии, затем логотип стоит как оригинал; световая линия-«горизонт» под логотипом */
#lg-hero.lg-look-sweep .lg-sh{display:block;position:absolute;inset:0;z-index:2;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.28) 50%,transparent 58%) no-repeat;background-size:250% 100%;background-position:150% 0;
  -webkit-mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-composite:intersect;
  animation:lgSweep 2.6s cubic-bezier(.45,.05,.25,1) .8s 1 both}
@keyframes lgSweep{from{background-position:150% 0}to{background-position:-60% 0}}
#lg-hero.lg-look-sweep .lg-floor{display:block;position:absolute;left:6%;right:6%;bottom:-26px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(120,190,255,.0) 5%,rgba(150,205,255,.75) 50%,rgba(120,190,255,0) 95%,transparent);
  box-shadow:0 0 18px 2px rgba(80,160,255,.35)}

/* B. halo — свет сверху, как на сцене: мягкий конус лучей падает на логотип + синее сияние вокруг */
#lg-hero.lg-look-halo .lg-halo{width:190%;height:330%;
  background:radial-gradient(closest-side,rgba(11,48,92,.95) 0,rgba(9,38,74,.9) 34%,rgba(40,120,235,.22) 52%,rgba(40,110,220,.08) 68%,transparent 84%);animation:lgBreathe 7s ease-in-out infinite}
@keyframes lgBreathe{0%,100%{opacity:.8}50%{opacity:1}}
#lg-hero.lg-look-halo .lg-rays{display:block;left:0;right:0;top:-8%;height:78%;filter:blur(10px);
  background:conic-gradient(from 0deg at 50% 0,transparent 154deg,rgba(150,205,255,.10) 160deg,transparent 164deg,rgba(150,205,255,.16) 170deg,rgba(150,205,255,.07) 176deg,rgba(170,215,255,.20) 180deg,rgba(150,205,255,.07) 184deg,rgba(150,205,255,.15) 190deg,transparent 196deg,rgba(150,205,255,.09) 200deg,transparent 206deg);
  -webkit-mask:linear-gradient(180deg,#000 0,#000 45%,transparent 95%);mask:linear-gradient(180deg,#000 0,#000 45%,transparent 95%);
  animation:lgShimmer 9s ease-in-out infinite}
@keyframes lgShimmer{0%,100%{opacity:.75}50%{opacity:1}}
#lg-hero.lg-look-halo .lg-floor{display:block;position:absolute;left:10%;right:10%;bottom:-30px;height:40px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(90,160,255,.28),transparent);filter:blur(6px)}

/* C. glass — оригинальный логотип целиком на стеклянной плашке, отражение снизу */
#lg-hero.lg-look-glass .lg-plate{padding:11px;border-radius:20px;width:min(540px,76%);box-sizing:content-box;
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.13);border-top-color:rgba(255,255,255,.30);
  box-shadow:0 1px 0 rgba(255,255,255,.10) inset,0 50px 90px -36px rgba(0,6,20,.75),0 18px 36px -18px rgba(0,6,20,.5);
  -webkit-box-reflect:below 14px linear-gradient(transparent 72%,rgba(255,255,255,.12))}
/* размытие стекла — отдельным слоем позади, чтобы сам логотип не проходил через фильтр (остаётся пиксель в пиксель) */
#lg-hero.lg-look-glass .lg-plate::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
#lg-hero.lg-look-glass .lg-plate{isolation:isolate}
#lg-hero.lg-look-glass .lg-logo{border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 10px 26px -10px rgba(0,0,0,.6)}

/* ---------- правая часть: форма (только вид; поля, кнопки и ссылки работают как раньше) ---------- */
body.lg-split .lg-card{position:relative;z-index:2;background:#fff;border:1px solid rgba(16,32,64,.07);border-radius:18px;padding:36px 36px 30px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 12px -4px rgba(16,24,40,.05),0 32px 64px -24px rgba(16,24,40,.16);font-family:var(--lg-font);color:#0f1f35}
body.lg-split .lg-head{margin:0 0 22px}
body.lg-split .lg-head b{display:block;font:700 26px/1.15 var(--lg-font);letter-spacing:-.025em;color:#0d1b2e}
body.lg-split .lg-head span{display:block;margin-top:8px;font:500 14px/1.4 var(--lg-font);color:#667085}
body.lg-split .lg-card label{font:600 13px/1.3 var(--lg-font);color:#344054;letter-spacing:.005em}
body.lg-split .lg-card input:not([type=checkbox]):not([type=radio]):not([type=submit]){height:46px;border:1px solid #d3dae5;border-radius:11px;background:#fff;color:#0f1f35;
  font:500 15px var(--lg-font);padding:0 14px;box-shadow:0 1px 2px rgba(16,24,40,.05);transition:border-color .16s,background-color .16s;outline:none}
body.lg-split .lg-card input:hover{border-color:#b6c2d3}
body.lg-split .lg-card input:focus{border-color:#2f6fbf;background:#fcfdff;outline:none}
body.lg-split .lg-card form button:not([type=button]),body.lg-split .lg-card input[type=submit]{height:48px;border:0;border-radius:11px;color:#fff;cursor:pointer;
  font:700 15px var(--lg-font);letter-spacing:.01em;background:linear-gradient(180deg,#275a98,#163a66);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px rgba(10,30,60,.25),0 10px 22px -10px rgba(22,58,102,.65);transition:filter .16s,box-shadow .16s;outline:none}
body.lg-split .lg-card form button:not([type=button]):hover,body.lg-split .lg-card input[type=submit]:hover{filter:brightness(1.08)}
body.lg-split .lg-card form button:not([type=button]):active,body.lg-split .lg-card input[type=submit]:active{filter:brightness(.96);box-shadow:inset 0 2px 4px rgba(0,0,0,.18)}
body.lg-split .lg-card a{color:#1d5fae;text-decoration:none;font:600 13.5px var(--lg-font);transition:color .16s}
body.lg-split .lg-card a:hover{color:#164a8a;text-decoration:underline;text-underline-offset:3px}
body.lg-split .lg-onhero{font-family:var(--lg-font)}
/* логотип в карточке не дублируем: он уже большой слева / сверху */
body.lg-split .lg-hide{display:none!important}

@media (max-width:700px){
  body.lg-split{padding-left:0;padding-top:236px;position:relative;align-items:flex-start;background:#f7f9fc}
  #lg-hero{position:absolute;right:0;bottom:auto;width:auto;height:264px}
  #lg-hero .lg-brand{bottom:28px}
  #lg-hero .lg-plate{width:min(320px,80%)}
  #lg-hero.lg-look-glass .lg-plate{padding:10px;border-radius:16px;width:min(290px,72%);-webkit-box-reflect:none}
  #lg-hero .lg-foot,#lg-hero .lg-edge{display:none}
  #lg-hero.lg-look-sweep .lg-floor{bottom:-14px}
  body.lg-split .lg-card{margin-top:0;border-radius:20px;padding:28px 22px 24px;box-shadow:0 -1px 0 rgba(255,255,255,.6) inset,0 20px 50px -20px rgba(16,24,40,.25)}
  body.lg-split .lg-head b{font-size:23px}
  /* EN / RU сверху лежит на синем — делаем светлым, чтобы читалось */
  body.lg-split .lg-onhero,body.lg-split .lg-onhero *{color:#fff!important}
}
@media (prefers-reduced-motion:reduce){#lg-hero .lg-bg{display:none}#lg-hero .lg-halo,#lg-hero .lg-rays{animation:none}#lg-hero.lg-look-sweep .lg-sh{display:none}}

/* EN / RU в правом верхнем углу белой карточки: тёмные буквы, выбранный — синий */
body.lg-split .login-container .login-card > .lang-switch .lang-btn{color:#94a3b8}
body.lg-split .login-container .login-card > .lang-switch .lang-btn[aria-pressed="true"]{color:#1d5fae}
body.lg-split .login-container .login-card > .lang-switch .lang-sep{color:#cbd5e1}
body.lg-split .login-container{background:transparent}
/* телефон: карточка сразу под синей полосой с логотипом, без пустоты */
@media (max-width:700px){body.lg-split .login-container{min-height:0;align-items:flex-start;padding-top:0}}