/* Фирменный стиль strenёv для сайта без кабинета.
   Цвета - палитра v2.1, шрифты, кегли и кнопки - docs/platform/BRAND.md коробки.
   Подключается первым; страница дописывает свою раскладку поверх токенов.
   Правило владельца: кнопки и строки на экранах уже 768 px не ниже 44 px. */

@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;
  src:url("fonts/manrope-cyr.woff2") format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;
  src:url("fonts/manrope-lat.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/plexmono-400-cyr.woff2") format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/plexmono-400-lat.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url("fonts/plexmono-500-cyr.woff2") format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url("fonts/plexmono-500-lat.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* палитра v2.1 */
  --sv-ink:#14171C; --sv-white:#FFFFFF;
  --sv-electric:#4C6FF8; --sv-blue-text:#3457E0; --sv-blue-deep:#2B48C4; --sv-blue-tint:#C9D3FC;
  --sv-lagoon:#17879B; --sv-lagoon-text:#0F6E7E; --sv-lagoon-light:#4FC3D4;
  --sv-graphite:#767B86; --sv-graphite-text:#686D78; --sv-graphite-deep:#4A4F59; --sv-graphite-light:#A3A8B3;
  --sv-lines:#DDE1E9; --sv-line-row:#EEF0F4; --sv-cards:#F4F5F8;
  --sv-lines-dark:#2A2F38; --sv-cards-dark:#1C2027;
  --sv-coffee:#6B4630; --sv-success:#3B8B57; --sv-gold:#E8B21A; --sv-error:#CF5248;
  /* производные: заливки с прозрачностью */
  --sv-field:rgba(20,23,28,.045); --sv-field-focus:rgba(20,23,28,.09);
  --sv-electric-wash:rgba(76,111,248,.10); --sv-lagoon-wash:rgba(23,135,155,.10);
  --sv-success-wash:rgba(59,139,87,.10); --sv-warn-wash:rgba(232,178,26,.22);
  --sv-error-wash:rgba(207,82,72,.10); --sv-error-wash-2:rgba(207,82,72,.18);
  --sv-scrim:rgba(20,23,28,.55); --sv-sh-pop:0 24px 60px -24px rgba(20,23,28,.45);
  /* геометрия и шрифты */
  --sv-r-control:6px; --sv-r-card:8px; --sv-r-chip:4px;
  --sv-font:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --sv-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --sv-ease:.5s ease;
}

html{scrollbar-gutter:stable}
body.sv-page{margin:0;background:var(--sv-white);color:var(--sv-ink);font:400 15px/1.5 var(--sv-font);
  -webkit-font-smoothing:antialiased}
.sv-page input,.sv-page button,.sv-page select,.sv-page textarea{font-family:var(--sv-font)}
.sv-page :focus-visible{outline:2px solid var(--sv-electric);outline-offset:2px}

/* ------------------------------------------------------------ шапка */
.sv-top{position:sticky;top:0;z-index:40;background-color:var(--sv-ink);
  background-image:radial-gradient(var(--sv-lines-dark) 1px,transparent 1.6px);background-size:24px 24px}
.sv-top-in{max-width:1080px;margin:0 auto;padding:0 20px;min-height:56px;box-sizing:border-box;
  display:flex;align-items:center;gap:20px}
.sv-brand{display:inline-flex;align-items:center;flex:none;padding:6px 0;text-decoration:none;border-radius:var(--sv-r-control)}
.sv-page .sv-top :focus-visible{outline-color:var(--sv-lagoon-light)}
.sv-nav{display:flex;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
.sv-nav::-webkit-scrollbar{display:none}
.sv-nav a{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:var(--sv-r-control);
  font:400 14px/20px var(--sv-font);color:var(--sv-graphite-light);text-decoration:none;white-space:nowrap;
  transition:color var(--sv-ease),background-color var(--sv-ease)}
.sv-nav a:hover{color:var(--sv-white)}
.sv-nav a.on{background:var(--sv-lines-dark);color:var(--sv-white)}
.sv-links{margin-left:auto;display:flex;align-items:center;gap:4px}
.sv-links a,.sv-links span{display:inline-flex;align-items:center;min-height:32px;padding:0 8px;border-radius:var(--sv-r-control);
  font:400 12px/16px var(--sv-mono);color:var(--sv-graphite-light);text-decoration:none;white-space:nowrap;
  transition:color var(--sv-ease)}
.sv-links a:hover{color:var(--sv-white)}

/* ------------------------------------------------------------ кнопки */
.sv-page .btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;
  height:40px;min-height:40px;padding:0 16px;border:0;border-radius:var(--sv-r-control);
  font:500 14px/20px var(--sv-mono);letter-spacing:0;white-space:nowrap;text-decoration:none;cursor:pointer;
  background:var(--sv-graphite-text);color:var(--sv-white);transition:background-color var(--sv-ease),color var(--sv-ease)}
.sv-page .btn:hover,.sv-page .btn:active{background:var(--sv-graphite-deep);color:var(--sv-white)}
.sv-page .btn.ghost{background:transparent;color:var(--sv-graphite-text)}
.sv-page .btn.ghost:hover{background:transparent;color:var(--sv-ink)}
.sv-page .btn.del,.sv-page .btn.danger{background:var(--sv-error-wash);color:var(--sv-error)}
.sv-page .btn.del:hover,.sv-page .btn.danger:hover{background:var(--sv-error-wash-2);color:var(--sv-error)}
.sv-page .btn.sm{height:32px;min-height:32px;padding:0 12px;font-size:13px;line-height:18px}
.sv-page .btn[disabled]{opacity:.55;cursor:not-allowed}
.sv-page .btn[hidden]{display:none}

/* ------------------------------------------------------------ поля */
.sv-page input[type=text],.sv-page input[type=search],.sv-page input[type=number],.sv-page input[type=date],
.sv-page input[type=time],.sv-page input[type=password],.sv-page select,.sv-page textarea{
  box-sizing:border-box;height:40px;padding:0 12px;border:0;border-radius:var(--sv-r-control);outline:none;
  background-color:var(--sv-field);color:var(--sv-ink);font:400 15px/20px var(--sv-font);letter-spacing:0;
  box-shadow:none;transition:background-color var(--sv-ease)}
.sv-page textarea{height:auto;min-height:80px;padding:10px 12px;line-height:1.5}
.sv-page input:focus,.sv-page select:focus,.sv-page textarea:focus{background-color:var(--sv-field-focus);outline:none}
.sv-page input::placeholder,.sv-page textarea::placeholder{color:var(--sv-graphite-text);opacity:1}
.sv-page input[type=checkbox],.sv-page input[type=radio]{accent-color:var(--sv-electric)}
.sv-page input:-webkit-autofill{-webkit-text-fill-color:var(--sv-ink);
  -webkit-box-shadow:0 0 0 1000px var(--sv-cards) inset;transition:background-color 600000s 0s}

/* ------------------------------------------------------------ служебное */
.sv-page .chip{display:inline-flex;align-items:center;padding:4px 8px;border-radius:var(--sv-r-chip);
  font:500 12px/16px var(--sv-mono);letter-spacing:0;background:var(--sv-cards);color:var(--sv-graphite-deep)}
.sv-sq{display:inline-block;width:8px;height:8px;border-radius:2px;vertical-align:middle}

/* ------------------------------------------------------------ страница-оболочка (ссылки гостям) */
.sv-wrap{max-width:1080px;margin:0 auto;padding:28px 20px 64px;box-sizing:border-box}
.sv-h1{margin:0 0 6px;font:400 30px/1.1 var(--sv-font);letter-spacing:0;text-wrap:balance}
.sv-shell p{margin:0 0 14px;color:var(--sv-graphite-deep)}
.sv-shell .sub{margin:0 0 22px;font:400 13px/1.55 var(--sv-font);color:var(--sv-graphite-text)}
.sv-shell .err{color:var(--sv-error)}
.sv-shell .ok{color:var(--sv-ink)}
.sv-shell .ok::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:8px;background:var(--sv-success)}
.sv-shell .hint,.sv-shell .muted{font:400 13px/1.55 var(--sv-font);color:var(--sv-graphite-text)}
.sv-shell a{color:var(--sv-graphite-text);text-underline-offset:3px;transition:color var(--sv-ease)}
.sv-shell a:hover{color:var(--sv-ink)}
.sv-shell form>label{display:block;margin:0 0 14px;font:400 12px/16px var(--sv-mono);color:var(--sv-graphite-text)}
.sv-shell form>label>input{display:block;width:100%;max-width:420px;margin-top:6px}
.sv-shell table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 14px}
.sv-shell th{text-align:left;padding:0 8px 8px 0;font:400 11px/16px var(--sv-mono);text-transform:uppercase;
  letter-spacing:.04em;color:var(--sv-graphite-text)}
.sv-shell td{padding:12px 8px 12px 0;border-top:1px solid var(--sv-line-row);vertical-align:top}
.sv-shell code{font:400 12.5px var(--sv-mono)}

@media (max-width:767px){
  .sv-top-in{flex-wrap:wrap;padding:0 12px;gap:0 8px}
  .sv-brand{min-height:48px}
  .sv-nav{order:3;flex:1 0 100%;margin:0 -8px;padding:0 0 6px}
  .sv-nav a{height:44px;padding:0 14px}
  .sv-links a,.sv-links span{min-height:44px}
  .sv-page .btn{height:44px;min-height:44px}
  .sv-page .btn.sm{height:44px;min-height:44px}
  .sv-page input[type=text],.sv-page input[type=search],.sv-page input[type=number],.sv-page input[type=date],
  .sv-page input[type=time],.sv-page input[type=password],.sv-page select{height:44px;font-size:16px}
  .sv-page textarea{font-size:16px}
  .sv-wrap{padding:22px 12px 56px}
  .sv-h1{font-size:24px}
}
@media (prefers-reduced-motion:reduce){
  .sv-nav a,.sv-links a,.sv-page .btn,.sv-page input,.sv-page select,.sv-page textarea{transition:none}
}