@font-face{
  font-family:"Onest";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("/web/fonts/onest-cyrillic.woff2?v=20260811") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116
}
@font-face{
  font-family:"Onest";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("/web/fonts/onest-latin-ext.woff2?v=20260811") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,
    U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,
    U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF
}
@font-face{
  font-family:"Onest";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("/web/fonts/onest-latin.woff2?v=20260811") 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:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/web/fonts/jetbrains-mono-cyrillic.woff2?v=20260811") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116
}
@font-face{
  font-family:"Geologica";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("/web/fonts/geologica-ui.woff2?v=20260812type1") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/web/fonts/jetbrains-mono-latin-ext.woff2?v=20260811") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,
    U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,
    U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/web/fonts/jetbrains-mono-latin.woff2?v=20260811") 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{
  color-scheme:dark;
  --red:#D8503A;
  --red-hi:#F06A53;
  --red-wash:rgba(216,80,58,.11);
  --gold:#E9C079;
  --green:#78BE8B;
  --amber:#D8A657;
  --bg:#090A0B;
  --surface:#101113;
  --surface-2:#15171A;
  --surface-3:#1B1D21;
  --line:#282A2F;
  --line-strong:#3B3E45;
  --text:#F0EFEA;
  --text-2:#B8B5AE;
  --text-3:#8D8B85;
  --danger:#EF715E;
  --font:"Onest","Noto Sans CJK SC","Microsoft YaHei",sans-serif;
  --feature-font:"Geologica","Onest","Noto Sans CJK SC","Microsoft YaHei",sans-serif;
  --mono:"JetBrains Mono","Noto Sans Mono",monospace;
  --r:4px;
  --ease:cubic-bezier(.2,.65,.3,1);
  --wok-icon-chassis:url('/web/assets/wok-icon-chassis.svg?v=20260812fix1');
  --wok-security-medallion:url('/web/assets/wok-security-medallion.svg?v=20260812fix1');
  --wok-status-ok:url('/web/assets/wok-status-ok.svg?v=20260812fix1');
  --wok-status-warn:url('/web/assets/wok-status-warn.svg?v=20260812fix1');
  --wok-status-bad:url('/web/assets/wok-status-bad.svg?v=20260812fix1');
  --wok-status-idle:url('/web/assets/wok-status-idle.svg?v=20260812fix1');
  --wok-counter-seal:url('/web/assets/wok-counter-seal.svg?v=20260812fix1');
  --wok-provider-frame:url('/web/assets/wok-provider-frame.svg?v=20260812fix1');
  --wok-empty-state:url('/web/assets/wok-empty-state.svg?v=20260812fix1');
  --wok-loading-array:url('/web/assets/wok-loading-array.svg?v=20260812fix1');
}

*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 15px/1.55 var(--font);
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
*{scrollbar-width:thin;scrollbar-color:#494B50 #0A0B0D}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:#0A0B0D}
*::-webkit-scrollbar-thumb{border:3px solid #0A0B0D;border-radius:999px;background:#494B50}
*::-webkit-scrollbar-thumb:hover{background:#65676D}
button,input,select,textarea{font:inherit}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{color:inherit}
img,svg{display:block}
[hidden],.hide{display:none!important}
::selection{background:rgba(216,80,58,.35);color:var(--text)}
:focus-visible{outline:2px solid var(--red-hi);outline-offset:3px}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important}
.ti{width:1.1em;height:1.1em;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mono{font-family:var(--mono)}
.muted{color:var(--text-2)}
.quiet{color:var(--text-3)}
.num{text-align:right;font-variant-numeric:tabular-nums}

.btn{position:relative;isolation:isolate;overflow:hidden;min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--line-strong);border-radius:10px 10px 4px 10px;background:var(--surface-2);
  color:var(--text);padding:8px 14px;cursor:pointer;font-weight:650;line-height:1;
  white-space:nowrap;transition:background .16s var(--ease),border-color .16s var(--ease),
    color .16s var(--ease),transform .12s var(--ease)}
.btn::before{content:"";position:absolute;z-index:-1;right:9px;top:0;width:24px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(233,192,121,.55));opacity:.65;transition:width .22s var(--ease),opacity .22s}
.btn:hover::before{width:44px;opacity:1}
.btn:hover{background:var(--surface-3);border-color:#565961}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--red);border-color:var(--red);color:#170806}
.btn.primary:hover{background:var(--red-hi);border-color:var(--red-hi)}
.btn.danger{color:var(--danger)}
.btn.ghost{background:transparent}
.btn.small{min-height:30px;padding:5px 9px;font-size:12px}
.btn.icon-only{width:38px;padding:0}
.btn:disabled{opacity:.48;cursor:not-allowed;transform:none}

label,.field-label{display:block;color:var(--text-2);font-size:12px;font-weight:650;
  margin:0 0 6px}
input,select,textarea{width:100%;min-height:40px;border:1px solid var(--line-strong);
  border-radius:10px 10px 4px 10px;background:#0C0D0F;color:var(--text);padding:9px 11px;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease)}
input::placeholder,textarea::placeholder{color:#858681;opacity:1}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--red);
  box-shadow:0 0 0 3px var(--red-wash)}
input[type="date"]::-webkit-calendar-picker-indicator{opacity:.7;filter:invert(83%) sepia(27%) saturate(717%) hue-rotate(358deg) brightness(95%)}
select[data-ui-ready]{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;
  margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;opacity:0!important;pointer-events:none!important}
select option{background:#111216;color:var(--text)}
.select-shell{position:relative;display:block;width:100%;min-width:0}
.select-trigger{width:100%;min-height:40px;display:grid;grid-template-columns:minmax(0,1fr) 31px;align-items:center;
  border:1px solid var(--line-strong);border-radius:10px 10px 4px 10px;background:#0C0D0F;color:var(--text);
  padding:0 5px 0 11px;text-align:left;cursor:pointer;transition:border-color .16s var(--ease),background .16s var(--ease),box-shadow .16s var(--ease)}
.select-trigger:hover{border-color:#565961;background:#111216}
.select-trigger:focus-visible{outline:none;border-color:var(--red);box-shadow:0 0 0 3px var(--red-wash)}
.select-trigger:disabled{opacity:.48;cursor:not-allowed}
.select-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.select-arrow{width:31px;height:28px;display:grid;place-items:center;border-left:1px solid rgba(255,255,255,.08);color:var(--text-3)}
.select-arrow .ti{width:15px;height:15px;transition:transform .28s cubic-bezier(.16,1,.3,1),color .2s}
.select-shell:hover .select-arrow{color:var(--text-2)}
.select-shell.is-open .select-arrow .ti{transform:rotate(180deg);color:var(--red-hi)}
.select-shell:focus-within .select-arrow{color:var(--red-hi)}
.select-popover{position:fixed;z-index:160;overflow:auto;padding:6px;border:1px solid rgba(255,255,255,.18);
  border-radius:13px 13px 5px 13px;background:rgba(16,17,20,.985);color:var(--text);
  box-shadow:0 24px 70px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.055);
  transform-origin:top center;animation:select-enter .18s cubic-bezier(.16,1,.3,1) both}
.select-popover.opens-up{transform-origin:bottom center}
.select-option{width:100%;min-height:42px;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;
  gap:9px;border:0;border-radius:9px 9px 3px 9px;background:transparent;color:var(--text-2);padding:8px 8px 8px 10px;
  text-align:left;cursor:pointer;transition:background .14s var(--ease),color .14s var(--ease),transform .12s var(--ease)}
.select-option:hover,.select-option:focus-visible{outline:none;background:rgba(255,255,255,.065);color:var(--text)}
.select-option:active{transform:translateY(1px)}
.select-option[aria-selected="true"]{background:rgba(216,80,58,.13);color:var(--red-hi)}
.select-option:disabled{opacity:.42;cursor:not-allowed}
.select-check{display:grid;place-items:center;opacity:0;color:var(--gold)}
.select-check .ti{width:15px;height:15px}.select-option[aria-selected="true"] .select-check{opacity:1}
@keyframes select-enter{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:none}}

/* У выпадающего списка есть собственная геометрия, чтобы системный контрол не выбивался из интерфейса WOK. */
.select-trigger{min-height:44px;grid-template-columns:minmax(0,1fr) 38px;padding-left:13px;border-radius:12px 12px 4px 12px;
  background:linear-gradient(110deg,#0C0D10,#111116);box-shadow:inset 0 1px rgba(255,255,255,.025)}
.select-trigger::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;background:var(--red);opacity:.58}
.select-arrow{position:relative;width:34px;height:34px;border:0;background:var(--wok-icon-chassis) center/34px 34px no-repeat;color:var(--gold)}
.select-arrow .ti{width:13px;height:13px;position:relative;z-index:1}
.select-shell.is-open .select-trigger{border-color:rgba(216,80,58,.58);background:linear-gradient(110deg,#111014,#171116)}
.select-popover{padding:7px;border-color:rgba(233,192,121,.2);border-radius:15px 15px 5px 15px;background:linear-gradient(145deg,rgba(19,20,24,.995),rgba(10,11,14,.995));
  box-shadow:0 28px 80px rgba(0,0,0,.72),inset 0 1px rgba(255,255,255,.055),inset 3px 0 rgba(216,80,58,.5)}
.select-option{position:relative;min-height:44px;border:1px solid transparent;border-radius:10px 10px 3px 10px;padding-left:12px}
.select-option::before{content:"";width:5px;height:5px;position:absolute;left:0;top:50%;background:var(--gold);transform:translate(-50%,-50%) rotate(45deg);opacity:0}
.select-option:hover,.select-option:focus-visible{border-color:rgba(255,255,255,.075);background:rgba(255,255,255,.045)}
.select-option[aria-selected="true"]{border-color:rgba(216,80,58,.25);background:linear-gradient(90deg,rgba(216,80,58,.18),rgba(216,80,58,.04));color:#F5D6CF}
.select-option[aria-selected="true"]::before{opacity:1}.select-check{width:22px;height:22px;background:var(--wok-status-ok) center/22px 22px no-repeat;color:transparent}
.select-check .ti{display:none}

.skeleton{position:relative;overflow:hidden;background:#1B1D20;color:transparent!important;
  border:1px solid rgba(255,255,255,.025);border-radius:5px 5px 2px 5px;min-height:1em;
  background-image:linear-gradient(90deg,rgba(216,80,58,.08),transparent 18%),repeating-linear-gradient(90deg,#181A1E 0,#181A1E 14px,#1B1D21 14px,#1B1D21 15px)}
.skeleton::before{content:"";position:absolute;left:0;top:25%;bottom:25%;width:2px;background:rgba(216,80,58,.62)}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(233,192,121,.09),transparent);
  animation:skeleton-pass 1.25s ease-in-out infinite}
@keyframes skeleton-pass{to{transform:translateX(100%)}}
.spinner{width:20px;height:20px;border:0;border-radius:0;background:var(--wok-loading-array) center/contain no-repeat;animation:spinner-turn .8s steps(8,end) infinite}
@keyframes spinner-turn{to{transform:rotate(360deg)}}

.state{display:grid;justify-items:start;gap:8px;padding:18px;border:1px solid var(--line);
  border-radius:var(--r);background:var(--surface);color:var(--text-2)}
.state .ti{width:20px;height:20px;color:var(--text-3)}
.state strong{color:var(--text)}
.state.error{border-color:rgba(239,113,94,.45);background:rgba(239,113,94,.06)}
.state.error .ti{color:var(--danger)}
.state>.ti{box-sizing:content-box;width:21px;height:21px;padding:10px;background:var(--wok-empty-state) center/41px 41px no-repeat;color:var(--gold)}
.state.error>.ti{background-image:var(--wok-status-bad);color:#FF8A78}

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