/* Сгенерировано build_brand.py из theme.py коробки strenёv. Правка - в login.base.css
   или в коробке, затем пересборка. */
/* Экран входа, первого запуска и ошибок доступа. Белое исполнение strenev_light:
   карточка и подвал белые, одна тень; промежутки 16 px; поля без рамки цвета
   карточки, при фокусе подсветка #F4F5F8; кнопка Графит-текст, при наведении
   Графит-глубокий; ссылки Графит-текст, при наведении Уголь. Значения -
   theme.login_css(strenev_light). */
body.sv-login{margin:0;min-height:100vh;color:#14171C;font:400 15px/1.5 'Manrope',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}
.sv-login main{min-height:100vh;display:grid;place-items:center;padding:24px 24px 104px;box-sizing:border-box}
.sd-card{width:340px;max-width:100%;box-sizing:border-box;background:#FFFFFF;border:1px solid #DDE1E9;
  border-radius:8px;box-shadow:0 0 28px 4px rgba(20,23,28,.14);padding:16px;display:flex;
  flex-direction:column;gap:16px}
.sd-card form{display:flex;flex-direction:column;gap:16px;margin:0}
.sd-title{margin:0;color:#14171C;text-align:center;font:400 18px/1.3 'Manrope',system-ui,sans-serif}
.sd-hint{margin:0;color:#14171C;text-align:center;font:400 13px/1.55 'Manrope',system-ui,sans-serif}
.sd-hint a,.sd-card a{color:#686D78;text-decoration:none;transition:color .5s ease}
.sd-hint a:hover,.sd-card a:hover,.sd-card a:focus-visible{color:#14171C}
.sd-hint code{font:400 12px 'IBM Plex Mono',ui-monospace,monospace}
.sd-err{margin:0;text-align:center;font:400 12px/16px 'IBM Plex Mono',ui-monospace,monospace;color:#CF5248}
.sd-err:empty{display:none}

/* Поле: скругление и цвет дает подложка .sd-field, само поле прозрачное и рисует
   фон только внутри букв. Так подложка автозаполнения Chrome не дает канта по
   скруглению (урок 2 в LESSONS.md коробки). */
.sd-field{position:relative;border-radius:6px;background:transparent;transition:background-color .5s ease}
.sd-field:focus-within{background:#F4F5F8}
.sd-field>input{display:block;width:100%;box-sizing:border-box;height:48px;margin:0;padding:0 14px;
  font:400 15px 'Manrope',system-ui,sans-serif;letter-spacing:normal;text-align:center;
  border:0 !important;border-radius:0 !important;outline:none;background:transparent !important;
  -webkit-box-shadow:none !important;box-shadow:none !important;
  -webkit-background-clip:text !important;background-clip:text !important;
  color:#14171C;-webkit-text-fill-color:#14171C;caret-color:#14171C;transition:none !important}
.sd-field>input::placeholder{color:#686D78;-webkit-text-fill-color:#686D78;opacity:1;
  font-family:'Manrope',system-ui,sans-serif;letter-spacing:normal}
.sd-field>input:-webkit-autofill{-webkit-box-shadow:none !important;box-shadow:none !important}
.sd-field>input:autofill{filter:none !important}
.sd-field>input:disabled{cursor:not-allowed}
/* пароль: знак «•» шрифт SvPixelL рисует цветным квадратом */
#sd-card .sd-field>input[type=password]{font-family:'SvPixelL','Manrope',sans-serif;letter-spacing:0;
  font-palette:--svP0;padding:0 48px}
#sd-card .sd-field>input[type=password]::placeholder{font-family:'Manrope',system-ui,sans-serif;letter-spacing:normal}
#sd-card .sd-field>input.sd-pw-text{padding:0 48px}

/* глаз: без подложки, меняется только цвет и перечеркивание */
.sd-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;padding:0;
  border:0;border-radius:6px;background:transparent;color:#686D78;cursor:pointer;display:flex;
  align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;transition:color .5s ease}
.sd-eye:hover,.sd-eye:active{color:#14171C}
.sd-eye:focus-visible{outline:2px solid #17879B;outline-offset:0}

#sd-submit{height:48px;margin:0;border:0;border-radius:6px;background:#686D78;color:#FFFFFF;cursor:pointer;
  font:500 14px 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:0;transition:background-color .5s ease}
#sd-submit:hover,#sd-submit:active{background:#4A4F59}
#sd-submit:focus-visible{outline:2px solid #17879B;outline-offset:2px}
#sd-submit:disabled{opacity:.55;cursor:not-allowed}

/* подвал: полоса цвета карточки, знак справа, текст левее; текст-знак = знак-край = 48 px */
.sv-foot{position:fixed;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:flex-end;align-items:center;
  gap:48px;padding:16px 48px;background:#FFFFFF;border-top:1px solid #DDE1E9;box-shadow:0 0 28px 4px rgba(20,23,28,.14)}
.ft-txt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;white-space:nowrap;
  font:400 12px/18px 'IBM Plex Mono',ui-monospace,monospace;color:#686D78}
.ft-logo{display:flex;align-items:center}
@media (max-width:640px),(max-height:520px){
  .sv-foot{flex-direction:column;gap:10px;padding:16px 20px 20px}
  .ft-txt{align-items:center}
  .ft-logo{order:-1}
  .sv-login main{padding-bottom:150px}
  .sd-field>input{font-size:16px}
  .sd-eye{width:44px;height:44px;right:2px}
}
@media (prefers-reduced-motion:reduce){.sd-card a,.sd-field,#sd-submit,.sd-eye{transition:none}}

/* клетка светлого входа: theme.tartan(strenev_light, 'login') */
body.sv-login{background-color:#f4f5f8;background-image:repeating-linear-gradient(90deg, transparent 0px 34.38px, rgba(79,195,212,0.5) 34.38px 37.12px, transparent 37.12px 132.00px),repeating-linear-gradient(0deg, transparent 0px 34.38px, rgba(79,195,212,0.5) 34.38px 37.12px, transparent 37.12px 132.00px),repeating-linear-gradient(45deg, rgba(20,23,28,0.015) 0 1px, transparent 1px 8.25px),repeating-linear-gradient(90deg, rgba(23,135,155,0.0825) 0.00px 30.25px, transparent 30.25px 41.25px, rgba(163,168,179,0.1275) 41.25px 60.50px, transparent 60.50px 68.75px, rgba(20,23,28,0.135) 68.75px 74.25px, transparent 74.25px 79.75px, rgba(20,23,28,0.135) 79.75px 85.25px, transparent 85.25px 96.25px, rgba(23,135,155,0.06) 96.25px 123.75px, transparent 123.75px 126.50px, rgba(20,23,28,0.1125) 126.50px 129.25px, transparent 129.25px 132.00px),repeating-linear-gradient(0deg, rgba(23,135,155,0.0825) 0.00px 30.25px, transparent 30.25px 41.25px, rgba(163,168,179,0.1275) 41.25px 60.50px, transparent 60.50px 68.75px, rgba(20,23,28,0.135) 68.75px 74.25px, transparent 74.25px 79.75px, rgba(20,23,28,0.135) 79.75px 85.25px, transparent 85.25px 96.25px, rgba(23,135,155,0.06) 96.25px 123.75px, transparent 123.75px 126.50px, rgba(20,23,28,0.1125) 126.50px 129.25px, transparent 129.25px 132.00px);background-size:132px 132px;}
/* пароль цветными пикселями: семь палитр шрифта, переключает brand.js скачком */
@font-face{font-family:'SvPixelL';src:url('fonts/sv-pixel3-light.ttf') format('truetype');unicode-range:U+2022,U+25A0,U+25CF,U+25E6;font-display:block}
@font-palette-values --svP0{font-family:'SvPixelL';base-palette:0}@font-palette-values --svP1{font-family:'SvPixelL';base-palette:1}@font-palette-values --svP2{font-family:'SvPixelL';base-palette:2}@font-palette-values --svP3{font-family:'SvPixelL';base-palette:3}@font-palette-values --svP4{font-family:'SvPixelL';base-palette:4}@font-palette-values --svP5{font-family:'SvPixelL';base-palette:5}@font-palette-values --svP6{font-family:'SvPixelL';base-palette:6}
/* змейка знака в подвале: theme.snake_css() */
@keyframes sn0{0%{opacity:0;background:#3C58C9}4.878%{opacity:1;background:#3C58C9}78.049%{opacity:1;background:#3C58C9}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn0{animation:sn0 20.5s linear infinite}@keyframes sn1{0%{opacity:0;background:#4A6CF1}4.878%{opacity:0;background:#4A6CF1}9.756%{opacity:1;background:#4A6CF1}78.049%{opacity:1;background:#4A6CF1}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn1{animation:sn1 20.5s linear infinite}@keyframes sn2{0%{opacity:0;background:#785C4E}9.756%{opacity:0;background:#785C4E}14.634%{opacity:1;background:#785C4E}78.049%{opacity:1;background:#785C4E}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn2{animation:sn2 20.5s linear infinite}@keyframes sn3{0%{opacity:0;background:#348C9F}14.634%{opacity:0;background:#348C9F}19.512%{opacity:1;background:#348C9F}78.049%{opacity:1;background:#348C9F}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn3{animation:sn3 20.5s linear infinite}@keyframes sn4{0%{opacity:0;background:#9C9FA6}19.512%{opacity:0;background:#9C9FA6}24.390%{opacity:1;background:#9C9FA6}78.049%{opacity:1;background:#9C9FA6}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn4{animation:sn4 20.5s linear infinite}@keyframes sn5{0%{opacity:0;background:#AFB1B6}24.390%{opacity:0;background:#AFB1B6}29.268%{opacity:1;background:#AFB1B6}78.049%{opacity:1;background:#AFB1B6}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn5{animation:sn5 20.5s linear infinite}@keyframes sn6{0%{opacity:0;background:#C3C4C8}29.268%{opacity:0;background:#C3C4C8}34.146%{opacity:1;background:#C3C4C8}78.049%{opacity:1;background:#C3C4C8}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn6{animation:sn6 20.5s linear infinite}@keyframes sn7{0%{opacity:0;background:#8BB0BB}34.146%{opacity:0;background:#8BB0BB}39.024%{opacity:1;background:#8BB0BB}78.049%{opacity:1;background:#8BB0BB}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn7{animation:sn7 20.5s linear infinite}@keyframes sn8{0%{opacity:0;background:#9A8A83}39.024%{opacity:0;background:#9A8A83}43.902%{opacity:1;background:#9A8A83}78.049%{opacity:1;background:#9A8A83}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn8{animation:sn8 20.5s linear infinite}@keyframes sn9{0%{opacity:0;background:#887369}43.902%{opacity:0;background:#887369}48.780%{opacity:1;background:#887369}78.049%{opacity:1;background:#887369}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn9{animation:sn9 20.5s linear infinite}@keyframes sn10{0%{opacity:0;background:#679DAC}48.780%{opacity:0;background:#679DAC}53.659%{opacity:1;background:#679DAC}78.049%{opacity:1;background:#679DAC}87.805%{opacity:1;background:#C3C4C8}97.561%{opacity:0;background:#C3C4C8}100%{opacity:0;background:#C3C4C8}}.sn10{animation:sn10 20.5s linear infinite}.sv-lockup .sn{opacity:0}@media (prefers-reduced-motion:reduce){.sv-lockup .sn{animation:none;opacity:1}}