/* Тумблер: общие токены и компоненты */
@font-face{font-family:"Onest";font-weight:800;font-display:swap;src:url(../fonts/onest-cyrillic-800-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:800;font-display:swap;src:url(../fonts/onest-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"Onest";font-weight:900;font-display:swap;src:url(../fonts/onest-cyrillic-900-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:900;font-display:swap;src:url(../fonts/onest-latin-900-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}


@font-face{font-family:"Onest";font-weight:400;font-display:swap;src:url(../fonts/onest-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:400;font-display:swap;src:url(../fonts/onest-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"Onest";font-weight:500;font-display:swap;src:url(../fonts/onest-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:500;font-display:swap;src:url(../fonts/onest-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"Onest";font-weight:600;font-display:swap;src:url(../fonts/onest-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:600;font-display:swap;src:url(../fonts/onest-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"Onest";font-weight:700;font-display:swap;src:url(../fonts/onest-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:700;font-display:swap;src:url(../fonts/onest-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url(../fonts/jetbrains-mono-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url(../fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(../fonts/jetbrains-mono-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(../fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2212,U+2190-21FF}

:root{
  --ink:#0E0E0E; --ink-2:#1B1B1B; --ink-3:#3C3C3A;
  --milk:#F4F4F1; --milk-2:#EBEBE7; --paper:#FFFFFF; --white:#FFFFFF;
  --block:#0E0E0E; --on-block:#FFFFFF; --sel-bg:#0E0E0E; --sel-fg:#FFFFFF; --leaf-t:#11704A; --chart-2:#E3E3DE; --clay-hi:#FFFFFF; --clay-lo:#F3F3F0; --hdr-bg:rgba(244,244,241,.86);
  --signal:#E3F234; --signal-d:#D5E51E; --signal-soft:#F4FAC6; --signal-t:#5E6B00; --on-signal:#0E0E0E;
  --leaf:#1FA463; --leaf-soft:#E3F4EA;
  --butter:#E3F234; --butter-soft:#F4FAC6;
  --dust:#8C8C87; --dust-2:#B9B9B4;
  --seam:#E5E5E0;
  --danger:#E0453A;

  --f-display:"Onest", system-ui, sans-serif;
  --f-text:"Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, Menlo, monospace;

  --r-s:10px; --r-m:16px; --r-l:24px; --r-xl:32px;
  --sh-1:0 1px 2px rgba(0,0,0,.04), 0 2px 8px -2px rgba(0,0,0,.05);
  --sh-2:0 2px 4px rgba(0,0,0,.03), 0 18px 40px -16px rgba(0,0,0,.16);
  --sh-3:0 40px 90px -30px rgba(0,0,0,.28);
  --clay:inset 0 2px 1px rgba(255,255,255,.9), inset 0 -6px 14px rgba(0,0,0,.05), 0 1px 1px rgba(0,0,0,.04), 0 22px 44px -18px rgba(0,0,0,.18);
  --ease: cubic-bezier(.2,.8,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-text);color:var(--ink);background:var(--milk);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid #B7C800;outline-offset:2px;border-radius:6px}

.mono{font-family:var(--f-mono);font-feature-settings:"zero" 0}
.display{font-family:var(--f-display);font-weight:800;letter-spacing:-.035em}

/* Кнопки */
.btn{--bg:var(--block);--fg:var(--on-block);display:inline-flex;align-items:center;justify-content:center;gap:.55em;height:48px;padding:0 22px;border-radius:14px;border:0;background:var(--bg);color:var(--fg);font-weight:600;font-size:15px;text-decoration:none;cursor:pointer;transition:transform .2s var(--ease), background .2s, box-shadow .2s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(1px)}
.btn-signal{--bg:var(--signal);--fg:var(--on-signal);box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 26px -12px rgba(170,190,0,.9)}
.btn-signal:hover{--bg:var(--signal-d)}
.btn-ghost{--bg:var(--paper);--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--seam), var(--sh-1)}
.btn-ghost:hover{--bg:var(--block);--fg:var(--on-block)}
.btn-soft{--bg:var(--milk-2);--fg:var(--ink)}
.btn-soft:hover{--bg:var(--seam)}
.btn-lg{height:60px;padding:0 32px;font-size:17px;border-radius:16px}
.btn-sm{height:36px;padding:0 14px;font-size:14px;border-radius:10px}
.btn .arr{transition:transform .2s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}

/* Чипы и бейджи */
.chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:999px;background:var(--milk-2);font-size:13px;font-weight:500;white-space:nowrap}
.chip-leaf{background:var(--leaf-soft);color:var(--leaf-t)}
.chip-signal{background:var(--signal-soft);color:var(--signal-t)}
.chip-butter{background:var(--butter-soft);color:var(--signal-t)}
.chip-ink{background:var(--block);color:var(--on-block)}
.chip-lime{background:var(--signal);color:var(--on-signal)}
.dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.dot-live{position:relative}
.dot-live::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:currentColor;opacity:.35;animation:ping 1.8s var(--ease) infinite}
@keyframes ping{0%{transform:scale(.6);opacity:.5}100%{transform:scale(1.8);opacity:0}}

/* Метка-пилюля */
.tag{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 10px;border-radius:999px;background:var(--signal);color:var(--on-signal);font-weight:700;font-size:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink)}

/* Карточки */
.card{background:var(--paper);border-radius:var(--r-l);box-shadow:var(--sh-1);border:1px solid rgba(0,0,0,.04)}
.clay{background:linear-gradient(160deg,#FFFFFF 0%,#F3F3F0 100%);box-shadow:var(--clay);border-radius:var(--r-l)}

/* Поля */
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;font-weight:600;color:var(--ink-3)}
.input{height:48px;padding:0 14px;border-radius:12px;border:1.5px solid var(--seam);background:var(--white);transition:border-color .2s, box-shadow .2s;width:100%}
.input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(227,242,52,.45)}
.hint{font-size:12.5px;color:var(--dust)}


.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Тёмная тема */
:root{color-scheme:light}
[data-theme="dark"]{
  color-scheme:dark;
  --ink:#F2F2EE; --ink-2:#E2E2DC; --ink-3:#BEBEB7;
  --milk:#0D0D0C; --milk-2:#232321; --paper:#171716; --white:#1C1C1B;
  --block:#262624; --on-block:#FFFFFF; --sel-bg:#F2F2EE; --sel-fg:#0E0E0E;
  --signal-soft:#262A07; --signal-t:#E3F234;
  --leaf:#2BBF76; --leaf-soft:#0F2A1C; --leaf-t:#5FD69B;
  --butter-soft:#262A07;
  --dust:#8B8B85; --dust-2:#5C5C57;
  --seam:#2A2A27; --danger:#FF6A5E;
  --chart-2:#3A3A37; --clay-hi:#3A3A37; --clay-lo:#2A2A28; --hdr-bg:rgba(13,13,12,.82);
  --sh-1:0 1px 0 rgba(255,255,255,.03) inset, 0 2px 10px -2px rgba(0,0,0,.5);
  --sh-2:0 1px 0 rgba(255,255,255,.04) inset, 0 22px 50px -18px rgba(0,0,0,.8);
  --sh-3:0 40px 90px -30px rgba(0,0,0,.9);
}
[data-theme="dark"] .card{border-color:rgba(255,255,255,.04)}
[data-theme="dark"] .input{border-color:#33332F}
html.theme-anim *,html.theme-anim *::before,html.theme-anim *::after{transition:background-color .35s ease,color .35s ease,border-color .35s ease,box-shadow .35s ease!important}

/* Переключатель темы */
.theme-tg{position:relative;width:60px;height:34px;border-radius:17px;border:0;padding:0;cursor:pointer;background:var(--milk-2);box-shadow:inset 0 2px 5px rgba(0,0,0,.12);flex:none}
.theme-tg i{position:absolute;left:3px;top:3px;width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#E4E4DF);box-shadow:-2px 3px 6px rgba(0,0,0,.25);display:grid;place-items:center;transition:transform .45s cubic-bezier(.5,1.6,.4,1),background .3s}
.theme-tg svg{width:15px;height:15px;color:#0E0E0E}
.theme-tg .moon{display:none}
[data-theme="dark"] .theme-tg{background:#2E2E2B;box-shadow:inset 0 2px 5px rgba(0,0,0,.5)}
[data-theme="dark"] .theme-tg i{transform:translateX(26px);background:radial-gradient(circle at 35% 30%,#F8FF9A,#E3F234 55%,#C3D30F)}
[data-theme="dark"] .theme-tg .sun{display:none}
[data-theme="dark"] .theme-tg .moon{display:block}
