/* =========================================================
   OKKwork CSS structure (readability-only refactor)
   - Tokens (vars/colors/fonts)
   - Layout (positioning/containers)
   - Components (buttons/fields/menus)
   - States (hover/focus/active/open)
   Note: rules order is preserved to avoid visual changes.
   ========================================================= */

/*
  CSS TOC (quick navigation)
  00. Reset / base
  01. Tokens (CSS variables)
  02. Page layout (canvas/containers)
  03. Header / top navigation
  04. Dropdowns / menus / tooltips
  05. Forms / fields / pills / checkboxes
  06. Stage-specific blocks (topblock, fieldhost, etc.)
  07. Popups / modals
  08. Helpers / utilities
*/


/* ===== 00. Reset / base ===================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

ol,ul,menu {
  padding-inline-start: 0;
  list-style: none;
}

ol li::marker, ul li::before {
  letter-spacing: 0;
}

.scroll-container > div {
  width: 100%;
}



/* ===== 02. Page layout (canvas/containers) ===================================== */
.container > div {
  width: 100%;
}

.Pixso-canvas-0_1 > div {
  width: 100%;
}

html {
  width: 100%;
  height: 100%;
  /* Резерв под вертикальный скроллбар: меньше сдвига макета и «дрожи» при прокрутке */
  scrollbar-gutter: stable;
}

body { 
  width: 100%;
  height: 100%;
  margin: 0;
  background-color: white;
}
    
span {
  word-break: break-word;
}

.container {
  width: 100%;
  height: 100%;
}

.scroll-container {
  height: 100%;
  width: 100%;
  overflow: auto;
  padding-bottom: 32px;
}

.Pixso-canvas-0_1 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
}

.Pixso-frame-219_2 {
  width: 100%;
  height: 1606px;
  position: relative;
  flex-shrink: 0;
}

.Pixso-frame-219_3 {
  width: 1920px;
  height: 72px !important;
  min-height: 0 !important;
  max-height: 72px !important;
  overflow: visible;
  position: absolute;
  left: 0px;
  top: 0px;
  background: transparent !important;
  pointer-events: none;
  z-index: 20000;
}

.Pixso-frame-219_3 > * {
  pointer-events: auto;
}

.Pixso-rectangle-129_38 {
  width: 1920px;
  height: 70px;
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: #dce7f2;
  background-image: none;
}

.Pixso-paragraph-219_4 {
  font-size: clamp(22px, 4vw, 32px);
  font-family: "Rubik", sans-serif;
  font-weight: 800;
  letter-spacing: 0;
  color: #0658a2;
  width: auto;
  height: auto;
  position: absolute;
  left: 28px;
  top: 7px;
  white-space: pre;
  flex-grow: 0;
}

.Pixso-paragraph-219_5 {
  font-size: 14px;
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: #0658a2;
  width: auto;
  height: auto;
  position: absolute;
  left: 28px;
  top: 40px;
  white-space: pre;
  flex-grow: 0;
}

.Pixso-vector-219_6 {
  position: absolute;
  inset: -10.909090909090908% -18.181818181818183% -25.454545454545453% -18.181818181818183% ;
  background-image: url("../icon/Ellipse1.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.vector-wrapper-219_6 {
  position: absolute;
  left: 1830px;
  top: 9px;
  width: 50px;
  height: 50px;
}

.Pixso-vector-219_11 {
  width: 1750 px;
  height: 2px;
  background-image: url("../icon/Vector1.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  left: 0px;
  top: 70px;
}

/* OKKwork: Pixso-vector-219_11 скрыт (единый стиль с этапом 4/2) */
.Pixso-vector-219_11 { display: none; }

/* =========================================================
   OKKwork — Stage 1 migration plan
   1. Theme tokens
   2. Stage cards navigation
   3. Shared containers / controls
   4. Buttons and headings
   ========================================================= */

/* 2. Replace icon stepper with stage cards */
.Pixso-frame-219_13{ display: none !important; }
.Pixso-frame-219_17{ display: none !important; }
.Pixso-frame-219_22{ display: none !important; }
.Pixso-frame-219_27{ display: none !important; }
.Pixso-vector-219_21{ display: none !important; }
.Pixso-vector-219_26{ display: none !important; }
.Pixso-vector-219_31{ display: none !important; }



/* >>> OKKwork: Header / stage cards ===================================== */
.okkwork-stagecards{
  position: absolute;
  left: 60px;
  top: 86px;
  width: 1560px;
  z-index: 6;
  pointer-events: auto;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  --p1:#181F31;
  --p2:#465779;
  --p3:#778DA4;
  --p4:#99B3C6;
  --p5:#B8C6D7;
  --bg: #DCE7F2;
  --title: #0658A2;
  --text: rgba(15, 23, 42, .90);
  --muted: #3b556d;
  --stroke: rgba(15, 23, 42, .12);
  --glass: rgba(255,255,255,.62);
  --glass2: rgba(255,255,255,.42);
  --shadow: 0 18px 55px rgba(6, 88, 162, .14);
  --r: 18px;
  --acc: #00B8D9;
  --acc2:#94D82D;
  --warn:#F7B84B;
}

.okkwork-stagecards .wrap{
  background: linear-gradient(180deg, var(--bg), color-mix(in oklab, var(--bg) 72%, white));
  border:1px solid var(--stroke);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  overflow:hidden;
  backdrop-filter: blur(12px);
}

.okkwork-stagecards .layout{ display:flex; gap:12px; align-items:stretch; }
.okkwork-stagecards .grid{
  padding:14px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:12px;
  flex: 1 1 auto;
}

.okkwork-stagecards .card{
  position:relative;
  background-color: rgba(6, 88, 162, 0.14);
  background-image: none;
  border: 1px solid rgba(6, 88, 162, 0.22);
  border-radius: 16px;
  padding: 12px;
  min-height: 152px;
  cursor:pointer;
  box-shadow: 0 4px 14px rgba(6, 88, 162, 0.08);
  transition: transform .14s ease, border-color .14s ease, background-color .14s ease, box-shadow .14s ease;
  overflow:hidden;
}

.okkwork-stagecards .card:hover{
  transform: translateY(-2px);
  border-color: rgba(6, 88, 162, 0.3);
  background-color: rgba(6, 88, 162, 0.2);
  background-image: none;
  box-shadow: 0 6px 18px rgba(6, 88, 162, 0.12);
}

.okkwork-stagecards .card.is-selected{
  border-color: rgba(6, 88, 162, 0.38);
  background-color: rgba(6, 88, 162, 0.24);
  box-shadow: 0 0 0 2px rgba(6, 88, 162, 0.14), 0 6px 18px rgba(6, 88, 162, 0.12);
}

.okkwork-stagecards .card:before{
  content:"";
  position:absolute;
  inset:-1px;
  background: none;
  opacity: 0;
  pointer-events:none;
}

.okkwork-stagecards .card > *{ position:relative; }
.okkwork-stagecards .row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.okkwork-stagecards .kpi{
  font-size:12px;
  padding:4px 8px;
  border-radius: 999px;
  border:1px solid rgba(6,88,162,.24);
  color: rgba(6,88,162,.95);
  background: rgba(255,255,255,.72);
  font-weight: 600;
  white-space:nowrap;
}
.okkwork-stagecards .title{ margin:10px 0 0; font-weight: 750; letter-spacing:.2px; color: #0658a2; }
.okkwork-stagecards .desc{
  margin:8px 0 0;
  color: #3b556d;
  font-size:12.5px;
  line-height:1.35;
  font-weight:400;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
}
.okkwork-stagecards .bar{
  margin-top: 12px;
  height: 9px;
  background: rgba(6, 88, 162, 0.12);
  border:1px solid rgba(6, 88, 162, 0.18);
  border-radius: 999px;
  overflow:hidden;
}
.okkwork-stagecards .fill{
  height:100%;
  width:0%;
  transition: width .35s ease;
  background: linear-gradient(90deg, var(--acc), var(--acc2));
}
.okkwork-stagecards .status{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  color: rgba(6, 88, 162, 0.78);
  font-weight: 500;
}
.okkwork-stagecards .chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 8px;
  border-radius: 999px;
  border:1px solid rgba(6,88,162,.20);
  background: rgba(255,255,255,.72);
  color: rgba(59, 85, 109, 0.92);
  font-weight: 600;
}
.okkwork-stagecards .dot{ width:8px; height:8px; border-radius:50%; }
.okkwork-stagecards .dot.todo{ background: rgba(15,23,42,.24); }
.okkwork-stagecards .dot.active{ background: var(--warn); box-shadow: 0 0 0 5px rgba(255,210,106,.14); }
.okkwork-stagecards .dot.done{ background: linear-gradient(135deg, var(--acc), var(--acc2)); box-shadow: 0 0 0 5px rgba(0,184,217,.10); }
.okkwork-stagecards .nav{
  width: 170px;
  padding: 14px 14px 14px 0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
}
.okkwork-stagecards .btn{
  appearance:none;
  border:1px solid rgba(6,88,162,.18);
  background: rgba(255,255,255,.62);
  color: var(--title);
  padding:10px 12px;
  border-radius: 14px;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, filter .12s ease;
}
.okkwork-stagecards .btn:hover{ transform: translateY(-1px); border-color: rgba(6,88,162,.30); }
.okkwork-stagecards .btn.primary{
  border-color: rgba(6,88,162,.28);
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16));
  box-shadow: 0 14px 35px rgba(6,88,162,.16);
}

@media (max-width: 1920px){
  .okkwork-stagecards{ width: calc(100% - 120px); }
}
@media (max-width: 1100px){
  .okkwork-stagecards .grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .okkwork-stagecards .nav{ width: 160px; }
}
@media (max-width: 720px){
  .okkwork-stagecards{ left: 16px; width: calc(100% - 32px); }
  .okkwork-stagecards .grid{ grid-template-columns: 1fr; }
  .okkwork-stagecards .layout{ flex-direction:column; }
  .okkwork-stagecards .nav{
    width: auto;
    padding: 0 14px 14px;
    flex-direction:row;
  }
}

.Pixso-frame-219_13 {
  width: 219px;
  height: 128px;
  position: absolute;
  left: 92px;
  top: 106px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.frame-content-219_13 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: center;
  width: 100%;
  position: relative;
}

.Pixso-vector-219_14 {
  width: 100px;
  height: 100px;
  background-image: url("../icon/Ellipse432.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;
  flex-shrink: 0;
}

.Pixso-rectangle-219_15 {
  width: 60px;
  height: 60px;
  position: absolute;
  left: 80px;
  top: 20px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/f27accd50f03dc75874d529e19d39f2fa5582bb4.png");
}

.Pixso-paragraph-219_16 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 65%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

/* OKKwork: бейдж этапа (отдельный элемент под Pixso-paragraph-219_16) */
.okkwork-stage-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 5px;
  background: #515F6C;
  color: #F5F5F5;
  font-family: "Inter-Medium", "Inter-Regular", "Inter-Light", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
  letter-spacing: 0.02em;
}

/* OKKwork: бейджи этапов № 2, 3 и 4 — светлый фон, тёмно-серая рамка и текст */
.Pixso-frame-219_17 .okkwork-stage-badge{
  background: #E8EAED;
  color: #3D4754;
  border: 1px solid #515F6C;
  box-sizing: border-box;
}
.Pixso-frame-219_22 .okkwork-stage-badge{
  background: #E8EAED;
  color: #3D4754;
  border: 1px solid #515F6C;
  box-sizing: border-box;
}
.Pixso-frame-219_27 .okkwork-stage-badge{
  background: #E8EAED;
  color: #3D4754;
  border: 1px solid #515F6C;
  box-sizing: border-box;
}

.Pixso-frame-219_17 {
  width: 300px;
  height: 128px;
  position: absolute;
  left: 547px;
  top: 106px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.frame-content-219_17 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: center;
  width: 100%;
  position: relative;
}

.Pixso-vector-219_18 {
  width: 100px;
  height: 100px;
  background-image: url("../icon/Ellipse431.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;
  flex-shrink: 0;
}

.Pixso-rectangle-219_19 {
  width: 60px;
  height: 60px;
  position: absolute;
  left: 50%;
  top: 20px;
  transform: translateX(-50%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/70ff161f5af05501d89370d843b2a79f4b737e55.png");
}

.Pixso-paragraph-219_20 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  max-width: none;
  height: auto;
  position: relative;
  left: auto;
  top: auto;
  flex-shrink: 0;
  flex-grow: 0;
  text-align: center;
  white-space: nowrap;
}

.Pixso-vector-219_21 {
  width: 300.005859375px;
  height: 2.732666015625px;
  background-image: url("../icon/Line542.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  left: 298px;
  top: 158.6337890625px;
  /* OKKwork: базовая линия + “энергетический поток” поверх */
  overflow: visible;
  filter: drop-shadow(0 0 10px rgba(81, 95, 108, 0.30));
}

/* Futuristic “energy sweep” for stage transition line */
.Pixso-vector-219_21::before {
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  top: 50%;
  height: 6px;
  transform: translateY(-50%);
  border-radius: 999px;
  pointer-events: none;
  /* База: мягкое свечение вдоль линии */
  background:
    linear-gradient(90deg, rgba(81, 95, 108, 0.0), rgba(81, 95, 108, 0.16), rgba(81, 95, 108, 0.0));
  mix-blend-mode: screen;
  opacity: 0.95;
}

.Pixso-vector-219_21::after {
  content: "";
  position: absolute;
  left: -10%;
  top: 50%;
  width: 42%;
  height: 10px;
  transform: translateY(-50%);
  border-radius: 999px;
  pointer-events: none;
  /* Подвижный блик: яркий центр + хвосты */
  background: linear-gradient(
    90deg,
    rgba(81, 95, 108, 0) 0%,
    rgba(81, 95, 108, 0.22) 18%,
    rgba(81, 95, 108, 0.92) 50%,
    rgba(81, 95, 108, 0.22) 82%,
    rgba(81, 95, 108, 0) 100%
  );
  filter: blur(0.2px) drop-shadow(0 0 12px rgba(81, 95, 108, 0.65));
  opacity: 0;
  /* Скорость -20%: длительность +20%. Цикличность -30%: ~30% времени — пауза (см. keyframes). */
  /* Замедляем старт (через keyframes), не весь цикл */
  /* Цикл повтора в 2 раза реже: пауза дольше, пробег тот же */
  animation: okkwork-energy-sweep 3.72s linear infinite;
}



/* ===== 08. Helpers / utilities ===================================== */


/* >>> OKKwork: Helpers / animations ===================================== */
@keyframes okkwork-energy-sweep {
  /* Пауза ~50% цикла (цикл повтора в 2 раза реже) */
  0% {
    transform: translate(-30%, -50%) scaleX(0.92);
    opacity: 0;
  }
  50% {
    transform: translate(-30%, -50%) scaleX(0.92);
    opacity: 0;
  }
  /* Старт движения: замедлен примерно на 60% (первые ~60% прохода — меньшая дистанция) */
  58% {
    transform: translate(-30%, -50%) scaleX(0.95);
    opacity: 0.95;
  }
  72% {
    transform: translate(86%, -50%) scaleX(1.0);
    opacity: 0.9;
  }
  90% {
    opacity: 0.18;
  }
  100% {
    transform: translate(260%, -50%) scaleX(1.08);
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .Pixso-vector-219_21::after {
    animation: none;
    opacity: 0.55;
    transform: translate(60%, -50%);
  }
}

.Pixso-frame-219_22 {
  width: 219px;
  height: 128px;
  position: absolute;
  left: 1624px;
  top: 107px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.frame-content-219_22 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: center;
  width: 100%;
  position: relative;
}

.Pixso-vector-219_23 {
  width: 100px;
  height: 100px;
  background-image: url("../icon/Ellipse430.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;
  flex-shrink: 0;
}

.Pixso-rectangle-219_24 {
  width: 60px;
  height: 60px;
  position: absolute;
  left: 80px;
  top: 20px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/a4d39f88a1db440b803a55cabe33521fb33d8543.png");
}

.Pixso-paragraph-219_25 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  max-width: 219px;
  height: auto;
  position: relative;
  left: auto;
  top: auto;
  flex-shrink: 0;
  flex-grow: 0;
  text-align: center;
}

.Pixso-vector-219_26 {
  width: 300px;
  height: 1px;
  background-image: url("../icon/Line543.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  left: 800px;
  top: 156px;
}

.Pixso-frame-219_27 {
  width: 219px;
  height: 128px;
  position: absolute;
  left: 1099px;
  top: 107px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.frame-content-219_27 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: center;
  width: 100%;
  position: relative;
}

.Pixso-vector-219_28 {
  width: 100px;
  height: 100px;
  background-image: url("../icon/Ellipse43.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;
  flex-shrink: 0;
}

.Pixso-rectangle-219_29 {
  width: 60px;
  height: 60px;
  position: absolute;
  left: 80px;
  top: 20px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/4cecbae00201b2886ae1e259c903ae2df8a3e478.png");
}

.Pixso-paragraph-219_30 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  text-align: center;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  max-width: 219px;
  height: auto;
  position: relative;
  left: auto;
  top: auto;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-vector-219_31 {
  width: 300px;
  height: 1px;
  background-image: url("../icon/Line544.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  left: 1320px;
  top: 157px;
}

/* >>> OKKwork: Dropdowns / menus ===================================== */
/* ===== 04. Dropdowns / menus / tooltips ===================================== */
.okkwork-stage4-dropdown-search-wrap {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 10px 12px 8px;
  background: linear-gradient(180deg, #fff 0%, #fff 85%, rgba(255, 255, 255, 0) 100%);
  border-bottom: 1px solid rgba(217, 224, 227, 0.95);
}

.okkwork-stage4-dropdown-search {
  width: 100%;
  box-sizing: border-box;
  height: 40px;
  border-radius: 8px;
  border: 1px solid rgba(107, 124, 128, 0.65);
  padding: 0 12px;
  font-size: 16px;
  font-family: "Inter-Regular", Inter, sans-serif;
  outline: none;
}

.okkwork-stage4-dropdown-search:focus {
  border-color: rgba(6, 88, 162, 0.75);
}

.okkwork-stage4-dropdown-scroll {
  max-height: min(300px, 42vh);
  overflow-x: hidden;
  overflow-y: auto;
}

.okkwork-stage4-business-section-title {
  font-family: "Inter-Bold", "Inter-Regular", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(6, 88, 162, 1);
  padding: 10px 16px 4px;
  margin: 0;
  background: linear-gradient(180deg, rgba(245, 248, 252, 1) 0%, rgba(255, 255, 255, 0) 100%);
  cursor: pointer;
  user-select: none;
}

.okkwork-stage4-business-section-title::after,
.okkwork-crm-dropdown-heading::after {
  content: "▾";
  float: right;
  font-size: 11px;
  opacity: 0.65;
  transition: transform 0.15s ease;
}

.okkwork-stage4-business-section-title[aria-expanded="false"]::after,
.okkwork-crm-dropdown-heading[aria-expanded="false"]::after {
  transform: rotate(-90deg);
}

.okkwork-stage4-business-dropdown.okkwork-stage4-checklist-dropdown {
  max-height: min(420px, 58vh);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}



/* ===== 06. Stage-specific blocks ===================================== */


/* ===== 06. Stage-specific blocks (topblock, fieldhost, etc.) ===================================== */


/* >>> OKKwork: Topblock (project fields) ===================================== */
.okkwork-stage1-topblock .okkwork-top-dropdown-host{
  position: absolute;
  left: 0;
  top: 0;
  width: 360px;
  z-index: 200;
}

/* Stage 1: top dropdowns must be above any popups (e.g. specialist desc) */
#okkwork-top-business-dropdown-host,
#okkwork-top-crm-dropdown-host{
  z-index: 13060;
}
#okkwork-top-business-dropdown,
#okkwork-top-crm-dropdown{
  z-index: 13061;
}

.okkwork-stage1-topblock .okkwork-top-dropdown-host[aria-hidden="true"]{
  display: none;
}

.okkwork-stage1-topblock .okkwork-top-dropdown-host .okkwork-crm-dropdown,
.okkwork-stage1-topblock .okkwork-top-dropdown-host .okkwork-stage4-checklist-dropdown,
.okkwork-stage1-topblock .okkwork-top-dropdown-host .okkwork-stage4-business-dropdown{
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  width: 100%;
  max-width: 100%;
}

.okkwork-stage4-business-item-list {
  list-style: none;
  margin: 0;
  padding: 0 0 8px;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option{
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  background: transparent;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  margin: 0;
  cursor: pointer;
  text-align: left;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  color: rgba(15, 23, 42, 0.92);
  border-radius: 12px;
  transition:
    background-color 0.12s ease,
    box-shadow 0.12s ease,
    color 0.12s ease,
    transform 0.10s ease;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option:hover{
  background: rgba(6, 88, 162, 0.08);
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option:active{
  transform: translateY(0.5px);
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option:focus{
  outline: none;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option:focus-visible{
  box-shadow: 0 0 0 3px rgba(6, 88, 162, 0.22);
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option-icon{
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #0658A2;
  background: rgba(6, 88, 162, 0.12);
  border-radius: 10px;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option-icon svg{
  width: 18px;
  height: 18px;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-checklist-option-label{
  display: block;
  white-space: normal;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-business-item-list li{
  padding: 0;
}

.okkwork-stage1-topblock #okkwork-top-business-dropdown .okkwork-stage4-business-item-list li + li{
  margin-top: 2px;
}

.okkwork-business-section[hidden] {
  display: none !important;
}

.okkwork-stage4-field-autowidth {
  width: auto;
  min-width: 330px;
  max-width: min(900px, 96vw);
}

.Pixso-rectangle-219_40 {
  width: 25px;
  height: 25px;
  position: absolute;
  left: 420px;
  top: 38px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/04708502a9118a68fc18f94d4fcd56824f31793e.png");
}

.Pixso-frame-219_41 {
  width: 456px;
  min-height: 94px;
  height: auto;
  position: absolute;
  left: 62px;
  top: 675px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_41 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_42 {
  font-size: 18px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_43 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

/* ===== 05. Forms / fields / pills / checkboxes ===================================== */
.stroke-wrapper-219_43 {
  position: relative;
  width: 100%;
  height: 68px;
  flex-shrink: 0;
}

.stroke-219_43 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_44 {
  font-size: 24px;
  font-family: "Inter-Bold";
  font-weight: 700;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  min-height: 29px;
  position: absolute;
  left: 20px;
  right: 20px;
  width: auto;
  top: 48px;
  z-index: 1;
}

.Pixso-paragraph-219_44::placeholder {
  color: rgba(72, 87, 101, 0.5);
}

input.Pixso-paragraph-219_44 {
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
}

.Pixso-frame-219_46 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 840px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_46 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_47 {
  font-size: 14px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_48 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_48 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_48 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
  transition:
    border-width 0.22s cubic-bezier(0.2, 0.9, 0.2, 1),
    border-color 0.18s ease,
    background-color 0.15s ease;
}

.Pixso-paragraph-219_49 {
  font-size: 18px;
  font-family: "Inter-Semi Bold";
  font-weight: 500;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 31px;
  z-index: 1;
}

.Pixso-frame-219_50 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 921px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_50 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_51 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_52 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_52 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_52 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_53 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_54 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1009px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_54 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_55 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_56 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_56 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_56 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_57 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_58 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1090px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_58 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_59 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_60 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_60 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_60 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_61 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_62 {
  width: 456px;
  min-height: 94px;
  height: auto;
  position: absolute;
  left: 621px;
  top: 675px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_62 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_63 {
  font-size: 18px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.okkwork-subdivision-heading {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}

.okkwork-subdivision-heading__text {
  min-width: 0;
  flex: 1 1 auto;
}

.okkwork-subdivision-count {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: rgba(217, 224, 227, 1);
  color: rgba(72, 87, 101, 1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-Bold", "Inter-Regular", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}

.Pixso-rectangle-219_64 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_64 {
  position: relative;
  width: 100%;
  height: 50px;
  flex-shrink: 0;
}

.stroke-219_64 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
  transition:
    border-width 0.22s cubic-bezier(0.2, 0.9, 0.2, 1),
    border-color 0.18s ease,
    background-color 0.15s ease;
}

.Pixso-paragraph-219_65 {
  font-size: 18px;
  font-family: "Inter-Bold";
  font-weight: 550;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  min-height: 29px;
  position: absolute;
  left: 18px;
  right: 18px;
  width: auto;
  top: 40px;
  z-index: 1;
}

.Pixso-paragraph-219_65::placeholder {
  color: rgba(72, 87, 101, 0.5);
}

input.Pixso-paragraph-219_65 {
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
}

.Pixso-frame-219_67 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 650px;
  top: 840px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_67 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_68 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_69 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_69 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_69 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
  transition:
    border-width 0.22s cubic-bezier(0.2, 0.9, 0.2, 1),
    border-color 0.18s ease,
    background-color 0.15s ease;
}

.Pixso-paragraph-219_70 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_71 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 650px;
  top: 921px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_71 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_72 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_73 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_73 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_73 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_74 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_75 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 650px;
  top: 1009px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_75 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_76 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_77 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_77 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_77 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_78 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_79 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 650px;
  top: 1090px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_79 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_80 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_81 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_81 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_81 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_82 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_83 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1178px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_83 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_84 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_85 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_85 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_85 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_86 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_87 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1259px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_87 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_88 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_89 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_89 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_89 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_90 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_91 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1347px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_91 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_92 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_93 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_93 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_93 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_94 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

.Pixso-frame-219_95 {
  width: 456px;
  height: 68px;
  position: absolute;
  left: 105px;
  top: 1428px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.frame-content-219_95 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  width: 100%;
  position: relative;
}

.Pixso-paragraph-219_96 {
  font-size: 16px;
  font-family: "Inter-Light";
  font-weight: 300;
  letter-spacing: 0em;
  color: rgba(0, 0, 0, 1);
  width: 100%;
  height: auto;
  position: relative;
  flex-shrink: 0;
  flex-grow: 0;
}

.Pixso-rectangle-219_97 {
  width: 100%;
  height: 100%;
  position: relative;
  flex-shrink: 0;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(245, 245, 245, 1);
}

.stroke-wrapper-219_97 {
  position: relative;
  width: 414px;
  height: 45px;
  flex-shrink: 0;
}

.stroke-219_97 {
  position: absolute;
  inset: 0px;
  border-radius: 10px 10px 10px 10px;
  pointer-events: none;
  border-width: 0.5px 0.5px 0.5px 0.5px;
  border-style: solid;
  box-sizing: border-box;
  border-color: rgba(107, 124, 128, 1);
}

.Pixso-paragraph-219_98 {
  font-size: 20px;
  font-family: "Inter-Semi Bold";
  font-weight: 600;
  letter-spacing: 0em;
  color: rgba(72, 87, 101, 1);
  height: 29px;
  position: absolute;
  left: 13px;
  right: 13px;
  width: auto;
  top: 33px;
  z-index: 1;
}

input.Pixso-paragraph-219_49{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_53{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_57{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_61{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_70{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_74{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_78{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_82{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_86{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_90{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_94{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}
input.Pixso-paragraph-219_98{
  border: none;
  background: transparent;
  outline: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  width: auto;
  left: 13px;
  right: 13px;
  min-width: 0;
  max-width: none;
}

.Pixso-paragraph-219_49::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_53::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_57::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_61::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_70::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_74::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_78::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_82::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_86::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_90::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_94::placeholder{ color: rgba(72, 87, 101, 0.5); }
.Pixso-paragraph-219_98::placeholder{
  color: rgba(72, 87, 101, 0.5);
}

/* OKKwork: (удалено) старые элементы создания подразделений/специалистов */

.Pixso-rectangle-219_101{
  width: 22px;
  height: 22px;
  position: relative;
  left: auto;
  top: auto;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/8980f29dd113de607ba00ae705eb7a8bdb501283.png");
  filter: brightness(0) invert(1);
}
.Pixso-rectangle-219_103{
  width: 22px;
  height: 22px;
  position: relative;
  left: auto;
  top: auto;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/8980f29dd113de607ba00ae705eb7a8bdb501283.png");
  filter: brightness(0) invert(1);
}

.Pixso-paragraph-219_102{
  position: relative;
  left: auto;
  top: auto;
  width: auto;
  height: auto;
}
.Pixso-paragraph-219_104{
  position: relative;
  left: auto;
  top: auto;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-family: "Rubik-Bold/Black", "Rubik-Medium", sans-serif;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 1);
  white-space: nowrap;
  flex-grow: 0;
}

.Pixso-frame-219_105 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 333px;
  top: 677px;
  display: flex;
  flex-direction: row;
  gap: 9px;
  align-items: center;
}

.Pixso-rectangle-219_106 {
  width: 20px;
  height: 20px;
  position: relative;
  flex-shrink: 0;
  border-radius: 3px 3px 3px 3px;
  background-color: rgba(81, 95, 108, 1);
}

.Pixso-paragraph-219_107 {
  font-size: 14px;
  font-family: "Inter-Medium";
  font-weight: 500;
  letter-spacing: 0em;
  color: rgba(255, 255, 255, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 5px;
  top: 1px;
  white-space: pre;
  flex-grow: 0;
}

.Pixso-frame-219_108 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 894px;
  top: 677px;
  display: flex;
  flex-direction: row;
  gap: 9px;
  align-items: center;
}

.Pixso-rectangle-219_109 {
  width: 20px;
  height: 20px;
  position: relative;
  flex-shrink: 0;
  border-radius: 3px 3px 3px 3px;
  background-color: rgba(81, 95, 108, 1);
}

.Pixso-paragraph-219_110 {
  font-size: 14px;
  font-family: "Inter-Medium";
  font-weight: 500;
  letter-spacing: 0em;
  color: rgba(255, 255, 255, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 5px;
  top: 1px;
  white-space: pre;
  flex-grow: 0;
}

/* OKKwork: колонка «Следующий шаг» + прозрачный спейсер той же ширины/высоты под кнопкой */
.okkwork-next-step-stack {
  position: absolute;
  left: 1636px;
  top: 1536px;
  width: 195px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.Pixso-frame-219_113 {
  width: 195px;
  height: 39px;
  position: relative;
  left: auto;
  top: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  border-radius: 3px 3px 3px 3px;
  background-color: rgba(81, 95, 108, 1);
  flex-shrink: 0;
}

a.Pixso-frame-219_113 {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  box-sizing: border-box;
}

a.Pixso-frame-219_113:focus-visible {
  outline: 2px solid rgba(6, 88, 162, 0.65);
  outline-offset: 2px;
}

.okkwork-next-step-spacer {
  width: 195px;
  height: 39px;
  flex-shrink: 0;
  background: transparent;
  pointer-events: none;
}

.frame-content-219_113 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
  padding: 2px 3px 2px 3px;
  width: 100%;
  height: 100%;
  position: relative;
}

.Pixso-paragraph-219_114 {
  font-size: 20px;
  font-family: "Rubik-SemiBold";
  font-weight: 600;
  letter-spacing: 0em;
  line-height: 110.00000238418579%;
  color: rgba(255, 255, 255, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 12px;
  top: 8.5px;
  white-space: pre;
  flex-grow: 0;
}


/* OKKwork: toolbar шапки — дочерние #219_2, как на этапе 2 */
.Pixso-frame-219_2 > .Pixso-frame-129_23,
.Pixso-frame-219_2 > .Pixso-frame-129_35,
.Pixso-frame-219_2 > .Pixso-frame-129_19 {
  z-index: 20001;
  pointer-events: auto;
}
.Pixso-frame-129_23 {
  width: 433px;
  height: 45px;
  position: absolute;
  left: 1084px;
  top: 13px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.frame-content-129_23 {
  display: flex;
  flex-direction: row;
  gap: 19px;
  align-items: center;
  width: 100%;
  position: relative;
}

.Pixso-frame-129_24 {
  width: auto;
  height: auto;
  position: relative;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
}

/* Обёртка: подсказка (::after) на хосте без transform — качается только иконка внутри */


/* ===== 03. Header / top navigation ===================================== */
.okkwork-header-icon-host {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
}

.okkwork-header-icon-host--28 {
  width: 28px;
  height: 28px;
}

.Pixso-rectangle-129_25 {
  width: 30px;
  height: 30px;
  position: relative;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/ab14a020d9de7daab12d6792ccbfb432a12e867b.png");
  transform-origin: 50% 0%;
  pointer-events: none;
}

.okkwork-header-icon-host:hover .Pixso-rectangle-129_25,
.okkwork-header-icon-host:hover .Pixso-rectangle-129_26,
.okkwork-header-icon-host:hover .Pixso-rectangle-129_27,
.okkwork-header-icon-host:hover .okkwork-header-icon-img {
  animation: okkwork-bell-ring 0.6s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

@keyframes okkwork-bell-ring {
  0% {
    transform: rotate(0deg);
  }
  12% {
    transform: rotate(15deg);
  }
  24% {
    transform: rotate(-13deg);
  }
  36% {
    transform: rotate(10deg);
  }
  48% {
    transform: rotate(-7deg);
  }
  60% {
    transform: rotate(4deg);
  }
  72% {
    transform: rotate(-2deg);
  }
  84% {
    transform: rotate(1deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .okkwork-header-icon-host:hover .Pixso-rectangle-129_25,
  .okkwork-header-icon-host:hover .okkwork-header-icon-img,
  .okkwork-header-icon-host:hover .Pixso-rectangle-129_26,
  .okkwork-header-icon-host:hover .Pixso-rectangle-129_27 {
    animation: none;
  }
}

.Pixso-rectangle-129_26 {
  width: 28px;
  height: 28px;
  position: relative;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/c9a9f3e0ed77796b4dd18c1d44314bccc4c5de98.png");
  transform-origin: 50% 0%;
  pointer-events: none;
}

.Pixso-rectangle-129_27 {
  width: 28px;
  height: 28px;
  position: relative;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/90096685e5a863347f32c379625c5b796e98df05.png");
  transform-origin: 50% 0%;
  pointer-events: none;
}

.okkwork-tooltip-host {
  position: relative;
}

.okkwork-tooltip-host:focus-visible {
  outline: 2px solid rgba(6, 88, 162, 0.55);
  outline-offset: 3px;
  border-radius: 8px;
}

.okkwork-tooltip-host::after {
  content: attr(data-okkwork-tooltip);
  position: absolute;
  left: 60%;
  top: calc(100% + 8px);
  transform: translateX(-50%);
  background: #b8cce0;
  background-color: #b8cce0;
  border: 0.5px solid #7a9fbe;
  color: #0658a2;
  border-radius: 8px;
  padding: 6px 10px;
  font-family: "Inter-Medium", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 10px 28px rgba(6, 88, 162, 0.18);
  opacity: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  pointer-events: none;
  transition: opacity 0.12s ease, transform 0.12s ease;
  z-index: 200000;
}
/* Подсказка только на иконке ℹ️ (без второго tooltip на тексте заголовка) */
#okkwork-stage4-pointdesc .okkwork-info-tip.okkwork-tooltip-host{
  position: relative;
}
#okkwork-stage4-pointdesc .okkwork-info-tip.okkwork-tooltip-host::after {
  left: 50%;
  top: calc(100% + 10px);
  transform: translateX(-50%);
  white-space: normal;
  box-sizing: border-box;
  max-width: min(640px, calc(100vw - 56px));
  width: clamp(260px, 52vw, 640px);
  word-break: normal;
  overflow-wrap: anywhere;
}
#okkwork-stage4-pointdesc .okkwork-info-tip.okkwork-tooltip-host:hover::after,
#okkwork-stage4-pointdesc .okkwork-info-tip.okkwork-tooltip-host:focus-visible::after {
  transform: translateX(-50%) translateY(-2px);
}
/* Иконка-подсказка рядом с заголовком */
#okkwork-stage4-pointdesc .okkwork-caption-with-info{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#okkwork-stage4-pointdesc .okkwork-info-tip{
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: rgba(220, 231, 242, 1);
  color: rgba(6, 88, 162, 1);
  box-shadow: 0 2px 8px rgba(6, 88, 162, 0.15);
  cursor: help;
}
#okkwork-stage4-pointdesc .okkwork-info-tip svg{
  width: 12px;
  height: 12px;
  display: block;
}
/* Заголовок «Рейтинг» не должен перекрывать выпадающий список «Уровень» выше по макету */
#okkwork-stage4-pointdesc #okkwork-caption-rating { z-index: 8; }

/* Выпадающие списки уровень/должность поверх текстов следующих блоков */
#okkwork-stage4-pointdesc #okkwork-pointdesc-level-panel,
#okkwork-stage4-pointdesc #okkwork-pointdesc-position-panel {
  z-index: 520;
}

/* Комбо-блок «Уровень» чуть выше обычного, чтобы выпадал поверх смежных подписей при пересечении */
#okkwork-stage4-pointdesc #okkwork-pointdesc-level-wrap{
  z-index: 460;
}

.okkwork-tooltip-host:hover::after{
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}
.okkwork-tooltip-host:focus-visible::after {
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}

/* Баланс: подсказка «Пополнить баланс» — по центру над строкой суммы (над Pixso-paragraph-129_31) */
#129_29.okkwork-tooltip-host::after {
  left: 50%;
  transform: translateX(-50%);
}

#129_29.okkwork-tooltip-host:hover::after{
  transform: translateX(-50%) translateY(-2px);
}
#129_29.okkwork-tooltip-host:focus-visible::after {
  transform: translateX(-50%) translateY(-2px);
}

/* OKKwork: тёмная подсказка (для «В разработке ⚙️») */
.okkwork-tooltip-host.okkwork-tooltip-host--dev::after {
  background: #41413e;
  color: #dbdcdb;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
}

.Pixso-vector-129_28 {
  width: 1px;
  height: 46px;
  background-image: url("../icon/Vector85.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;
  flex-shrink: 0;
}

/* OKKwork: единый фрейм баланса — три дочерних слоя внутри; подсказка через .okkwork-tooltip-host */
.Pixso-frame-129_29 {
  width: 158px;
  min-width: 158px;
  height: 32px;
  position: relative;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 8px;
}

.Pixso-paragraph-129_31 {
  font-size: 23px;
  font-family: "Inter-Bold";
  font-weight: 700;
  display: flex;
  flex-direction: column;
  justify-content: center;
  letter-spacing: 0em;
  color: rgba(6, 88, 162, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 50px;
  top: 4px;
  white-space: pre;
  flex-grow: 0;
}

.Pixso-rectangle-129_32 {
  width: 24px;
  height: 24px;
  position: absolute;
  left: 130px;
  top: 6px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/3510e1ff975e407910217e0374019f5c0b5fb0ef.png");
}

.Pixso-rectangle-129_30 {
  width: 27px;
  height: 27px;
  position: absolute;
  left: 14px;
  top: 4px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/81a449869c61bc7e94c3fb4d7291c62b8d5d9df4.png");
  transform-origin: 50% 0%;
}

/* Колокольчик на иконке кошелька только при наведении на иконку */
.Pixso-rectangle-129_30,
.okkwork-header-balance-wallet {
  cursor: pointer;
}

.Pixso-rectangle-129_30:hover,
.okkwork-header-balance-wallet:hover {
  animation: okkwork-bell-ring 0.6s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

@media (prefers-reduced-motion: reduce) {
  .Pixso-rectangle-129_30:hover,
  .okkwork-header-balance-wallet:hover {
    animation: none;
  }
}

.Pixso-frame-129_33 {
  width: 140px;
  height: 32px;
  position: absolute;
  left: 330px;
  top: 8px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(6, 88, 162, 1);
  overflow: hidden;
  cursor: pointer;
  transition: background-color 0.35s ease;
}

.Pixso-frame-129_33:hover{
  background-color: #067e10;
}
.Pixso-frame-129_33:focus-within {
  background-color: #067e10;
}

.Pixso-frame-129_33:focus-visible {
  outline: 2px solid rgba(245, 245, 245, 0.85);
  outline-offset: 2px;
}

.frame-content-129_33 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  padding: 2px 4px 2px 4px;
  width: 100%;
  height: 100%;
  position: relative;
}

/* OKKwork: срок лицензии — переворот «листа» снизу вверх + индикатор оставшихся дней */
.okkwork-license-countdown__flip {
  position: relative;
  width: 100%;
  height: 100%;
  perspective: 520px;
  transform: translateZ(0);
}

.okkwork-license-countdown__face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  box-sizing: border-box;
  border-radius: 10px;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: transform 0.48s cubic-bezier(0.34, 1.2, 0.64, 1), opacity 0.18s ease;
  transform-origin: 50% 100%;
  will-change: transform, opacity;
}

.okkwork-license-countdown__face--date {
  transform: rotateX(0deg);
  z-index: 2;
  opacity: 1;
}

.okkwork-license-countdown__face--days {
  transform: rotateX(90deg);
  z-index: 1;
  opacity: 0;
  color: #f5f5f5;
  font-size: 16px;
  font-family: "Inter-Bold", "Inter-Regular", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
  text-align: center;
  line-height: 1.15;
  white-space: nowrap;
}

.Pixso-frame-129_33:hover .okkwork-license-countdown__face--date{
  transform: rotateX(-90deg);
  opacity: 0;
}
.Pixso-frame-129_33:focus-within .okkwork-license-countdown__face--date {
  transform: rotateX(-90deg);
  opacity: 0;
}

.Pixso-frame-129_33:hover .okkwork-license-countdown__face--days{
  transform: rotateX(0deg);
  opacity: 1;
}
.Pixso-frame-129_33:focus-within .okkwork-license-countdown__face--days {
  transform: rotateX(0deg);
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .okkwork-license-countdown__face {
    transition: opacity 0.15s ease;
    transform: none !important;
  }

  .okkwork-license-countdown__face--date {
    opacity: 1;
  }

  .okkwork-license-countdown__face--days {
    opacity: 0;
  }

  .Pixso-frame-129_33:hover .okkwork-license-countdown__face--date{
    opacity: 0;
  }
.Pixso-frame-129_33:focus-within .okkwork-license-countdown__face--date{
    opacity: 0;
  }


  .Pixso-frame-129_33:hover .okkwork-license-countdown__face--days{
    opacity: 1;
  }
.Pixso-frame-129_33:focus-within .okkwork-license-countdown__face--days{
    opacity: 1;
  }

}

.Pixso-paragraph-129_34 {
  font-size: 16px;
  font-family: "Inter-Bold";
  font-weight: 700;
  display: flex;
  flex-direction: column;
  justify-content: center;
  letter-spacing: 0em;
  color: rgba(245, 245, 245, 1);
  width: auto;
  height: auto;
  position: static;
  left: auto;
  top: auto;
  white-space: pre;
  flex-grow: 0;
  margin: 0;
  text-align: center;
}

.Pixso-frame-129_35 {
  --okkwork-help-search-width: 350px;
  width: var(--okkwork-help-search-width);
  height: 41px;
  position: absolute;
  left: 372px;
  top: 16px;
  display: flex;
  flex-direction: row;
  align-items: center;
  border-radius: 10px 10px 10px 10px;
  background-color: rgba(6, 88, 162, 0.14000000059604645);
  z-index: 400;
  box-sizing: border-box;
  transition: width 0.28s cubic-bezier(0.2, 0.9, 0.2, 1);
}

/* Расширение вправо в 2×: левый край (left) неизменен; увод курсора или снятие фокуса — обратно */
.Pixso-frame-129_35:hover{
  width: calc(var(--okkwork-help-search-width) * 2);
}
.Pixso-frame-129_35:focus-within {
  width: calc(var(--okkwork-help-search-width) * 2);
}

@media (prefers-reduced-motion: reduce) {
  .Pixso-frame-129_35 {
    transition: none;
  }
}

.frame-content-129_35 {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  padding: 9px 5px 9px 5px;
  width: 100%;
  height: 100%;
  position: relative;
}

.okkwork-help-search-input {
  position: absolute;
  left: 36px;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  height: 28px;
  border: none;
  background: transparent;
  outline: none;
  font-size: 16px;
  font-family: "Inter-Medium", sans-serif;
  font-weight: 500;
  letter-spacing: 0em;
  box-sizing: border-box;
}

.okkwork-help-search-input::placeholder {
  color: rgba(6, 88, 162, 1);
}

.okkwork-help-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}

.okkwork-help-search-results {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  max-height: min(50vh, 320px);
  overflow: auto;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(6, 88, 162, 1);
  border: 1px solid rgba(6, 88, 162, 1);
  z-index: 500;
}

.okkwork-help-search-results[hidden] {
  display: none !important;
}

.okkwork-help-result-btn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 14px;
  border: none;
  background: transparent;
  cursor: pointer;
  font: inherit;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.okkwork-help-result-btn:last-child {
  border-bottom: none;
}

.okkwork-help-result-btn:hover{
  background: rgba(6, 88, 162, 0.08);
  outline: none;
}
.okkwork-help-result-btn:focus-visible {
  background: rgba(6, 88, 162, 0.08);
  outline: none;
}

.okkwork-help-result-title {
  font-weight: 600;
  color: rgba(72, 87, 101, 1);
  font-size: 14px;
}

.okkwork-help-result-excerpt {
  font-size: 12px;
  color: rgba(72, 87, 101, 0.65);
  margin-top: 3px;
  line-height: 1.35;
}

.okkwork-help-empty {
  padding: 12px 14px;
  font-size: 13px;
  color: rgba(72, 87, 101, 0.75);
  line-height: 1.4;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.Pixso-paragraph-129_37 {
  font-size: 16px;
  font-family: "Inter-Medium";
  font-weight: 500;
  display: flex;
  flex-direction: column;
  justify-content: center;
  letter-spacing: 0em;
  color: rgba(6, 88, 162, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 36px;
  top: 9.5px;
  white-space: pre;
  flex-grow: 0;
}

.Pixso-rectangle-129_36 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 10px;
  top: 10.5px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/cf559b7417b0e7b527509c7f1f72d4e476ee03b4.png");
}

.Pixso-frame-129_19 {
  width: 178px;
  height: 32px;
  position: absolute;
  left: 1600px;
  top: 20px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  overflow: visible;
  z-index: 1;
}

.Pixso-frame-129_19.okkwork-support-host.is-open {
  z-index: 400;
}

/* OKKwork: блок «Поддержка» — открывает выпадающий список (#okkwork-support-menu) */
.frame-content-129_19 {
  display: flex;
  flex-direction: row;
  gap: 3px;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  position: relative;
  cursor: pointer;
}

.Pixso-rectangle-129_20 {
  width: 25px;
  height: 25px;
  position: absolute;
  left: -2px;
  top: 4px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/800a33fa762bbcec16777a0a847bb479fe3eebbc.png");
}

.Pixso-rectangle-129_21 {
  width: 25px;
  height: 25px;
  position: absolute;
  left: 159px;
  top: 3px;
  transform: rotateY(180deg) rotateX(180deg) rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/46116e31a3a1609f0df85e759c6ab87edc6d3409.png");
}

.okkwork-support-host.is-open .Pixso-rectangle-129_21 {
  transform: rotateY(180deg) rotateX(180deg) rotate(180deg);
}

.Pixso-paragraph-129_22 {
  font-size: 20px;
  font-family: "Rubik-Medium";
  font-weight: 500;
  letter-spacing: 0.05000000074505806em;
  color: rgba(6, 88, 162, 1);
  width: auto;
  height: auto;
  position: absolute;
  left: 27px;
  top: 3px;
  white-space: pre;
  flex-grow: 0;
}

/* --- OKKwork: масштаб по ширине окна, макет 1920px заполняет 100vw (без лишних боковых полей) --- */


/* ===== 01. Tokens (CSS variables) ===================================== */
:root {
  --okkwork-design-height: 1606;
  --okkwork-canvas-width: 1920;
  /* Масштаб макета: 100vw (как в исходных версиях). 100% в calc() здесь давал ошибочный коэффициент
     из‑за разрешения процентов в контексте кастом‑свойства — интерфейс ужимался почти до нуля. */
  --okkwork-field-muted: rgba(72, 87, 101, 0.5);
  --okkwork-field-filled: rgba(72, 87, 101, 1);
}

#219_2 input.okkwork-field-tone:not([readonly]) {
  transition: color 0.12s ease;
}

#219_2 input.okkwork-field-tone:not([readonly]).okkwork-field-tone--muted {
  color: var(--okkwork-field-muted) !important;
}

#219_2 input.okkwork-field-tone:not([readonly]).okkwork-field-tone--filled {
  color: var(--okkwork-field-filled) !important;
}

#219_2 input.okkwork-field-tone::placeholder {
  color: var(--okkwork-field-muted);
}

.scroll-container {
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.Pixso-canvas-0_1 {
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  --okkwork-scale: min(1, calc(100vw / (var(--okkwork-canvas-width) * 1px)));
}

.Pixso-frame-219_2 {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: calc(var(--okkwork-canvas-width) * 1px) !important;
  flex-shrink: 0;
  transform-origin: top center;
  /* translateZ(0) — отдельный композитный слой; уменьшает субпиксельные рывки при scroll + scale */
  transform: scale(var(--okkwork-scale)) translateZ(0) !important;
  height: calc(var(--okkwork-design-height) * 1px * var(--okkwork-scale)) !important;
  backface-visibility: hidden;
}

@keyframes okkwork-crm-panel-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.okkwork-crm-dropdown {
  position: absolute;
  left: 0;
  width: 100%;
  top: 80px;
  z-index: 50;
  margin: 0;
  padding: 0;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(107, 124, 128, 1);
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.12),
    0 2px 8px rgba(0, 0, 0, 0.06);
  max-height: min(380px, 52vh);
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

.okkwork-crm-dropdown[hidden] {
  display: none !important;
}

.okkwork-crm-dropdown-section + .okkwork-crm-dropdown-section {
  border-top: 1px solid rgba(217, 224, 227, 0.95);
}

.okkwork-crm-dropdown-heading {
  font-family: "Inter-Bold", "Inter-Regular", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(6, 88, 162, 1);
  padding: 12px 16px 6px;
  background: linear-gradient(
    180deg,
    rgba(245, 248, 252, 1) 0%,
    rgba(255, 255, 255, 0) 100%
  );
  cursor: pointer;
  user-select: none;
}

.okkwork-crm-dropdown-list {
  list-style: none;
  margin: 0;
  padding: 4px 0 10px;
}

.okkwork-crm-option {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-Bold", "Inter-Regular", sans-serif;
  font-size: 18px;
  font-weight: 550;
  letter-spacing: 0;
  color: rgba(72, 87, 101, 1);
  padding: 8px 16px 8px 14px;
  line-height: 1.25;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.okkwork-crm-option__logo {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow:
    0 0 0 1px rgba(107, 124, 128, 0.2),
    0 1px 2px rgba(0, 0, 0, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.96);
}

.okkwork-crm-option__logo img {
  width: 36px;
  height: 36px;
  object-fit: cover;
  display: block;
}

.okkwork-crm-option__label {
  flex: 1;
  min-width: 0;
  text-align: left;
}

/* Логотип выбранной системы в поле (слева от текста) — фон как у поля, без белой плашки */
.okkwork-crm-selected-logo {
  position: absolute;
  left: 18px;
  top: 36px;
  z-index: 2;
  pointer-events: none;
  width: 28px;
  height: 28px;
  border-radius: 7px;
  overflow: hidden;
  /* «Граница» того же цвета, что и фон поля — без отдельной светлой/синей рамки */
  box-shadow: 0 0 0 1px rgba(245, 245, 245, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(245, 245, 245, 1);
}

.okkwork-crm-selected-logo img {
  width: 28px;
  height: 28px;
  object-fit: cover;
  display: block;
}


.okkwork-crm-option:hover{
  background: rgba(6, 88, 162, 0.08);
  color: rgba(6, 88, 162, 1);
  outline: none;
}
.okkwork-crm-option:focus-visible {
  background: rgba(6, 88, 162, 0.08);
  color: rgba(6, 88, 162, 1);
  outline: none;
}

.okkwork-crm-option:hover .okkwork-crm-option__logo{
  box-shadow:
    0 0 0 1px rgba(6, 88, 162, 0.35),
    0 2px 6px rgba(6, 88, 162, 0.12);
}
.okkwork-crm-option:focus-visible .okkwork-crm-option__logo {
  box-shadow:
    0 0 0 1px rgba(6, 88, 162, 0.35),
    0 2px 6px rgba(6, 88, 162, 0.12);
}

.okkwork-crm-option:active {
  background: rgba(6, 88, 162, 0.14);
}

/* OKKwork: выпадающее меню поддержки (макет «5. Меню поддрежки», список, не modal) */
@keyframes okkwork-support-menu-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.okkwork-support-menu {
  position: absolute;
  right: 20;
  left: auto;
  top: calc(100% + 8px);
  width: 290px;
  margin: 0;
  padding: 0;
  list-style: none;
  z-index: 2;
  filter: drop-shadow(0 10px 28px rgba(0, 0, 0, 0.12)) drop-shadow(0 2px 8px rgba(0, 0, 0, 0.06));
}

.okkwork-support-host.is-open .okkwork-support-menu {
  animation: okkwork-support-menu-in 0.2s ease forwards;
}

.okkwork-support-menu[hidden] {
  display: none !important;
}

.okkwork-support-menu__inner {
  position: relative;
  width: 230px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(107, 124, 128, 0.35);
  box-sizing: border-box;
  overflow: hidden;
}

.okkwork-support-menu__list {
  margin: 0;
  padding: 6px 0;
  list-style: none;
}

.okkwork-support-menu__item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 8px 14px 8px 16px;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-family: "Rubik-Medium", "Rubik", "Inter-Medium", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  box-sizing: border-box;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.okkwork-support-menu__item:hover{
  background: rgba(6, 88, 162, 0.08);
  color: rgba(6, 88, 162, 1);
  outline: none;
}
.okkwork-support-menu__item:focus-visible {
  background: rgba(6, 88, 162, 0.08);
  color: rgba(6, 88, 162, 1);
  outline: none;
}

.okkwork-support-menu__icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-support-icon-chat.png");
}

.okkwork-support-menu__icon--doc {
  background-image: url("../icon/okkwork-support-icon-doc.png");
}

.okkwork-support-menu__icon-img {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
  pointer-events: none;
}

.okkwork-support-menu__label {
  flex: 1;
  min-width: 0;
  line-height: 1.25;
}

/* OKKwork: меню пользователя; иконки — ./icon/okkwork-user-menu-icons/ (копия из «Иконки Меню пользователя (new)») */
.vector-wrapper-219_6.okkwork-user-menu-host {
  cursor: pointer;
  overflow: hidden;
  border-radius: 50%;
  z-index: 60;
}

/* кликабельная зона — круг аватара (макет), не только обёртка */
.vector-wrapper-219_6.okkwork-user-menu-host .Pixso-vector-219_6{
  cursor: pointer;
  pointer-events: auto;
}
.vector-wrapper-219_6.okkwork-user-menu-host .okkwork-user-header-avatar {
  cursor: pointer;
  pointer-events: auto;
}

.vector-wrapper-219_6.okkwork-user-menu-host.is-open {
  z-index: 20010;
}

.okkwork-user-header-avatar {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  z-index: 2;
  display: none;
}

.okkwork-user-menu-host.has-user-avatar .okkwork-user-header-avatar {
  display: block;
}

.okkwork-user-menu-host.has-user-avatar .okkwork-user-header-fallback {
  opacity: 0;
}

/* Меню профиля выносится в body (JS) — fixed поверх формы этапа 1 */
.okkwork-user-menu {
  position: absolute;
  top: 65px;
  right: 40px;
  left: auto;
  width: 290px;
  z-index: 20020;
  filter: none;
}

.okkwork-user-menu.is-floating {
  position: fixed !important;
  z-index: 99999 !important;
}

.okkwork-user-menu[hidden] {
  display: none !important;
}

.okkwork-user-menu .Pixso-frame-281_116 {
  width: 290px;
  height: 284px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
  background-color: rgba(255, 255, 255, 0);
}

.okkwork-user-menu .Pixso-rectangle-281_118 {
  width: 290px;
  height: 284px;
  position: absolute;
  left: 0px;
  top: 0px;
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(220, 235, 250, 0.98) 0%, rgba(236, 245, 252, 0.96) 42%, rgba(255, 255, 255, 1) 100%);
  border: 1px solid rgba(6, 88, 162, 0.14);
  box-shadow: 0 16px 40px rgba(6, 88, 162, 0.16);
  z-index: 0;
  overflow: visible;
}

/* Иконки пунктов — поверх фона карточки */
.okkwork-user-menu .Pixso-rectangle-281_125{ z-index: 2; }
.okkwork-user-menu .Pixso-rectangle-281_126{ z-index: 2; }
.okkwork-user-menu .Pixso-rectangle-281_131{ z-index: 2; }
.okkwork-user-menu .Pixso-rectangle-281_133{ z-index: 2; }
.okkwork-user-menu .Pixso-rectangle-281_135{ z-index: 2; }
.okkwork-user-menu .Pixso-rectangle-281_141{ z-index: 2; }
.okkwork-user-menu .Pixso-vector-281_144{ z-index: 2; }

.okkwork-user-menu .Pixso-vector-281_119 {
  position: absolute;
  inset: 0% -4.444444444444445% -8.88888888888889% -4.444444444444445%;
  background-image: url("../icon/okkwork-user-menu-icons/Ellipse2.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.okkwork-user-menu .vector-wrapper-281_119 {
  position: absolute;
  left: 192px;
  top: 17px;
  width: 90px;
  height: 90px;
}

.okkwork-user-menu .vector-wrapper-281_119.okkwork-user-avatar-wrap {
  z-index: 3;
}

.okkwork-user-menu .okkwork-user-avatar-viewport {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
}

.okkwork-user-menu .okkwork-user-avatar-img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(-50%, -50%) scale(var(--okkwork-user-avatar-scale, 1));
  transform-origin: center center;
}

.okkwork-user-menu .okkwork-user-avatar-img[hidden] {
  display: none !important;
}

.okkwork-user-menu .okkwork-user-avatar-btn {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: rgba(6, 88, 162, 1);
  color: #fff;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  z-index: 4;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.okkwork-user-menu .okkwork-user-avatar-btn:hover {
  filter: brightness(1.08);
}

.okkwork-user-menu .Pixso-paragraph-281_122{
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 92px;
  height: auto;
  position: absolute;
  left: 35px;
  top: 78px;
}
.okkwork-user-menu a.okkwork-user-profile-link.Pixso-paragraph-281_122 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 92px;
  height: auto;
  position: absolute;
  left: 35px;
  top: 78px;
}

.okkwork-user-menu a.okkwork-user-profile-link.Pixso-paragraph-281_122 {
  display: inline-block;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
}

.okkwork-user-menu .Pixso-text-281_124 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0em;
  color: rgb(200, 48, 48);
  width: 103px;
  height: auto;
  position: absolute;
  left: 206px;
  top: 252px;
  cursor: pointer;
}

/* OKKwork: pop up подтверждения выхода */
.okkwork-logout-confirm {
  position: fixed;
  inset: 0;
  z-index: 9100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}

.okkwork-logout-confirm[hidden] {
  display: none !important;
}

.okkwork-logout-confirm__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
}

.okkwork-logout-confirm__panel {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.2);
  padding: 18px 18px 14px;
  font-family: "Rubik-Medium", "Inter-Medium", sans-serif;
}

.okkwork-logout-confirm__title {
  font-size: 18px;
  font-weight: 500;
  color: rgba(81, 95, 108, 1);
  margin: 0 0 14px;
}

.okkwork-logout-confirm__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.okkwork-logout-confirm__actions button {
  font-family: inherit;
  font-size: 15px;
  padding: 8px 16px;
  border-radius: 8px;
  border: 0;
  cursor: pointer;
}

.okkwork-logout-confirm__cancel {
  background: #eef2f6;
  color: rgba(81, 95, 108, 1);
}

.okkwork-logout-confirm__yes {
  background: rgba(6, 88, 162, 1);
  color: #fff;
}

.okkwork-user-menu .Pixso-paragraph-281_124_0 {
  line-height: 19px;
  position: relative;
  flex-shrink: 0;
}

.okkwork-user-menu .Pixso-span-281_124_0_1 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  color: rgb(200, 48, 48);
  position: relative;
  flex-shrink: 0;
}

.okkwork-user-menu .Pixso-paragraph-281_124_1 {
  line-height: 19px;
  position: relative;
  flex-shrink: 0;
}

.okkwork-user-menu .Pixso-span-281_124_1_1 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  color: rgb(200, 48, 48);
  position: relative;
  flex-shrink: 0;
}

.okkwork-user-menu .Pixso-rectangle-281_125 {
  width: 22px;
  height: 22px;
  position: absolute;
  left: 258px;
  top: 250px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/c9e46b6a52637bc2a6b41513caa33750ac1fc303.png");
  z-index: 3;
}

.okkwork-user-menu .Pixso-rectangle-281_126 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 11px;
  top: 78px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/07365eb145a31140b318edabce560798cd90f250.png");
}

.okkwork-user-menu .Pixso-paragraph-281_127 {
  font-size: 14px;
  font-family: "Rubik-Bold", "Rubik", sans-serif;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: rgba(6, 88, 162, 1);
  width: 197px;
  height: auto;
  position: absolute;
  left: 12px;
  top: 23px;
}

.okkwork-user-menu .Pixso-paragraph-281_128 {
  font-size: 12px;
  font-family: "Rubik-Light", "Rubik", sans-serif;
  font-weight: 300;
  letter-spacing: 0.03em;
  color: rgba(6, 88, 162, 1);
  width: 112px;
  height: auto;
  position: absolute;
  left: 12px;
  top: 43px;
}

.okkwork-user-menu .Pixso-paragraph-281_130 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 149px;
  height: auto;
  position: absolute;
  left: 35px;
  top: 108px;
}

.okkwork-user-menu .Pixso-rectangle-281_131 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 11px;
  top: 108px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/aa8c8b064e5525a4da544486d3dd9d35f687df51.png");
}

.okkwork-user-menu .Pixso-paragraph-281_132 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 170px;
  height: auto;
  position: absolute;
  left: 35px;
  top: 140px;
}

.okkwork-user-menu .Pixso-rectangle-281_133 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 11px;
  top: 140px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/okkwork-menu-marketplace.png");
}

.okkwork-user-menu .Pixso-paragraph-281_134 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 170px;
  height: auto;
  position: absolute;
  left: 35px;
  top: 173px;
}

.okkwork-user-menu .Pixso-rectangle-281_135 {
  width: 21px;
  height: 21px;
  position: absolute;
  left: 11px;
  top: 173px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/okkwork-menu-birzha-zakazov.png");
}

.okkwork-user-menu .Pixso-paragraph-281_140 {
  font-size: 16px;
  font-family: "Rubik-Medium", "Rubik", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgba(81, 95, 108, 1);
  width: 214px;
  height: 20px;
  position: absolute;
  left: 40px;
  top: 223px;
}

.okkwork-user-menu .Pixso-rectangle-281_141 {
  width: 21px;
  height: 21px;
  position: absolute;
  left: 15px;
  top: 223px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icon/okkwork-user-menu-icons/92eaa6cabb72b6b7802c45c40822363c70792c20.png");
}

.okkwork-user-menu .okkwork-user-menu__icon-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.okkwork-user-menu .Pixso-vector-281_144 {
  width: 241.5px;
  height: 0;
  background: none;
  border-top: 1px dashed rgba(6, 88, 162, 0.28);
  position: absolute;
  left: 21.5px;
  top: 209.5px;
}

.okkwork-avatar-editor {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}

.okkwork-avatar-editor[hidden] {
  display: none !important;
}

.okkwork-avatar-editor__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

.okkwork-avatar-editor__panel {
  position: relative;
  z-index: 1;
  width: min(360px, 100%);
  padding: 20px 22px 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.2);
  font-family: "Rubik-Medium", "Inter-Medium", sans-serif;
}

.okkwork-avatar-editor__preview-wrap {
  width: 200px;
  height: 200px;
  margin: 0 auto 16px;
  border-radius: 50%;
  overflow: hidden;
  background: #eef2f6;
  position: relative;
}

.okkwork-avatar-editor__preview-img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(-50%, -50%) scale(var(--okkwork-avatar-editor-scale, 1));
  transform-origin: center center;
}

.okkwork-avatar-editor__scale-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
}

.okkwork-avatar-editor__scale-row label {
  font-size: 14px;
  color: rgba(81, 95, 108, 1);
}

.okkwork-avatar-editor__scale-row input[type="range"] {
  width: 100%;
}

.okkwork-avatar-editor__actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.okkwork-avatar-editor__actions button {
  font-family: inherit;
  font-size: 15px;
  padding: 8px 16px;
  border-radius: 8px;
  cursor: pointer;
  border: 0;
}

.okkwork-avatar-editor__cancel {
  background: #eef2f6;
  color: rgba(81, 95, 108, 1);
}

.okkwork-avatar-editor__apply {
  background: rgba(6, 88, 162, 1);
  color: #fff;
}

/* 1 / 3 / 4. Theme tokens + shared visual layer from Stage 2 */
:root{
  --okk-bg: #DCE7F2;
  --okk-title: #0658A2;
  --okk-text: rgba(15, 23, 42, .90);
  --okk-muted: rgba(59, 85, 109, .92);
  --okk-stroke: rgba(15, 23, 42, .12);
  --okk-glass: rgba(255,255,255,.62);
  --okk-glass2: rgba(255,255,255,.42);
  --okk-shadow: 0 18px 55px rgba(6, 88, 162, .14);
  --okk-acc: #00B8D9;
  --okk-acc2: #94D82D;
  --okk-warn: #F7B84B;
  --okk-brand-title-font: "Rubik", sans-serif;
  --okk-brand-title-size: clamp(22px, 4vw, 32px);
  --okk-brand-title-weight: 800;
  --okk-brand-title-spacing: 0;
  --okk-brand-title-line-height: 1;
}

body{
  background: #ffffff;
  color: var(--okk-text);
}

.Pixso-frame-219_3{
  /* Фон шапки только у .Pixso-rectangle-129_38 — не заливаем весь фрейм белым */
  background: transparent !important;
  height: 72px !important;
  min-height: 0 !important;
  max-height: 72px !important;
}

.Pixso-rectangle-129_38{
  background: #dce7f2;
  background-image: none;
  border-bottom: 1px solid rgba(6, 88, 162, 0.14);
  box-shadow: 0 10px 26px rgba(6, 88, 162, 0.12);
}

.okkwork-brand__title,
.okkwork-brand__tagline {
  color: #0658a2 !important;
}

.Pixso-paragraph-219_33{ color: var(--okk-title) !important; }
.Pixso-paragraph-219_42{ color: var(--okk-title) !important; }
.Pixso-paragraph-219_63{ color: var(--okk-title) !important; }
.Pixso-paragraph-219_107{ color: var(--okk-title) !important; }
.Pixso-paragraph-219_110{ color: var(--okk-title) !important; }

.Pixso-frame-219_105{
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: var(--okk-shadow) !important;
}
.Pixso-frame-219_108{
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: var(--okk-shadow) !important;
}

/* OKKwork: карточки подразделений — без фоновой "рамки" и тени */
.Pixso-frame-219_62{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

input[type="text"]:not(.okkwork-help-search-input){
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}
input[type="search"]:not(.okkwork-help-search-input){
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}
.stroke-wrapper-219_34{
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, 1) !important;
  color: var(--okk-text) !important;
}
.stroke-wrapper-219_43{
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}
.stroke-wrapper-219_64{
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}
.stroke-wrapper-219_106{
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}
.stroke-wrapper-219_109{
  border-radius: 14px !important;
  border: 1px solid var(--okk-stroke) !important;
  background: linear-gradient(180deg, var(--okk-glass), var(--okk-glass2)) !important;
  box-shadow: 0 10px 28px rgba(6, 88, 162, .10) !important;
  color: var(--okk-text) !important;
}

/* OKKwork: Stage 1 — поле-хост (Подразделения/Специалисты).
   Цель: короткие селекторы, единый неймспейс, минимум специфичности. */


/* >>> OKKwork: Fieldhost (subdivisions/specialists) ===================================== */
.okkwork-s1-fieldhost{
  position: absolute;
  left: 62px;
  top: 570px;
  width: 1060px;
  z-index: 4;
  pointer-events: auto;

  /* локальные переменные (не трогаем глобальный :root) */
  --okk-s1-block-h: 50px;
  --okk-s1-spec-h: 40px;
  --okk-s1-points-indent: 44px;
  --okk-s1-points-line-x: 15px;
  --okk-s1-points-line-color: rgba(200, 210, 220, 1);
  --okk-s1-filled-blue: rgba(6, 88, 162, 1);
  --okk-s1-muted-blue: rgba(6, 88, 162, 0.48);
  --okk-s1-surface-idle: rgba(220, 231, 242, 1);
  --okk-s1-surface-committed: rgba(6, 88, 162, 0.14);
  --okk-s1-border-filled: rgba(4, 62, 113, 1); /* темнее rgb(6,88,162), к градиенту committed */
  --okk-s1-radius: 10px;
}

/* Скругление поверхности поля (Pixso рисует 2 слоя) */
.okkwork-s1-fieldhost :where(.stroke-219_34, .Pixso-rectangle-219_34){
  border-radius: var(--okk-s1-radius) !important;
}

/* Заголовок подразделения */
.okkwork-s1-fieldhost .Pixso-paragraph-219_33{ font-weight: 700 !important; }

/* Инверсия фона по состоянию committed */
.okkwork-s1-fieldhost
  :where(.okkwork-stage4-s1-company-field__field, .okkwork-stage4-s1-point):not(.okkwork-company-committed)
  :where(.stroke-219_34, .Pixso-rectangle-219_34){
  background: var(--okk-s1-surface-idle);
}
.okkwork-s1-fieldhost
  :where(.okkwork-stage4-s1-company-field__field, .okkwork-stage4-s1-point).okkwork-company-committed
  :where(.stroke-219_34, .Pixso-rectangle-219_34){
  background: var(--okk-s1-surface-committed);
}

/* В новой зоне фон рисует stroke, поэтому input всегда прозрачный */
.okkwork-s1-fieldhost input[type="text"]{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.okkwork-s1-fieldhost input[type="search"]{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.okkwork-s1-fieldhost input.Pixso-paragraph-219_35{
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
  background: transparent !important;
}
.okkwork-s1-fieldhost input.Pixso-paragraph-219_35:focus{
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
  background: transparent !important;
}
.okkwork-s1-fieldhost input.Pixso-paragraph-219_35:focus-visible{
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
  background: transparent !important;
}

/* Тон текста/placeholder как на этапе 4 */
.okkwork-s1-fieldhost input.okkwork-field-tone.okkwork-field-tone--filled{ color: var(--okk-s1-filled-blue) !important; }
.okkwork-s1-fieldhost input.okkwork-field-tone.okkwork-field-tone--muted{ color: var(--okk-s1-muted-blue) !important; }
.okkwork-s1-fieldhost input.okkwork-field-tone::placeholder{ color: var(--okk-s1-muted-blue) !important; }

/* Колонка подразделений */
.okkwork-s1-fieldhost .okkwork-stage1-add-subdivision-fieldhost{
  position: relative;
  left: 0;
  top: 0;
  width: 520px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  z-index: 1;
  pointer-events: auto;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field{ width: 100%; position: relative; }

/* «+» под полем не должен наезжать на следующий заголовок */
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-company-field--points-collapsed, .okkwork-stage4-s1-company-field--no-points){
  padding-bottom: 52px;
}
.okkwork-s1-fieldhost .okkwork-stage1-add-subdivision-fieldhost > .okkwork-stage4-s1-company-field--no-points{ margin-bottom: 12px; }

.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-left: 8px;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field{ position: relative; }

/* Строка заголовка (Pixso иногда “прибивает” позиционирование инлайном) */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .Pixso-paragraph-219_33{
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  margin: 0 0 6px 0 !important;
  width: 100% !important;
}

/* Stroke-wrapper геометрия */
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke, .okkwork-stage4-s1-point__stroke){
  position: relative;
  width: 100%;
}
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke){ height: var(--okk-s1-block-h); }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__stroke{ height: var(--okk-s1-spec-h); }

.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .Pixso-rectangle-219_34{
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: 100% !important;
  height: 100% !important;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .stroke-219_34{ position: absolute !important; inset: 0 !important; }

/* Поля подразделения / специалиста: синяя рамка (как этап 4), без серой обводки .stroke-wrapper */
.okkwork-s1-fieldhost .stroke-wrapper-219_34{
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:not(.okkwork-company-committed) .stroke-219_34,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .okkwork-stage4-s1-point:not(.okkwork-company-committed) .stroke-219_34{
  border-width: 1px !important;
  border-style: solid !important;
  border-color: rgba(6, 88, 162, 0.42) !important;
  box-sizing: border-box !important;
  transition: border-color 0.18s ease;
}

/* Поле «Блок/подразделение»: пустое — светлый фон (idle); рамка как 169_191 */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) .stroke-219_34{
  border-color: rgba(6, 88, 162, 0.45) !important;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field.okkwork-company-committed:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) .stroke-219_34{
  border-color: rgba(6, 88, 162, 0.45) !important;
}

/* Input по центру по вертикали */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field input.Pixso-paragraph-219_35{
  font-size: 16px;
  font-family: "Inter-Bold";
  font-weight: 400;
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 1 !important;
}
/* Поле подразделения: справа 2 иконки (заметка + свернуть) */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) input.Pixso-paragraph-219_35{ right: 52px !important; }

/* Иконки блока под полем */
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-company-field__icon-right, .okkwork-stage4-s1-company-field__icon-bl){
  position: absolute;
  bottom: -33px;
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0.92;
  transition: opacity 0.12s ease, transform 0.12s ease;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__icon-right{ right: 10px; top: auto; transform: none; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__icon-bl{ left: 10px; }
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-company-field__icon-right, .okkwork-stage4-s1-company-field__icon-bl):hover{ opacity: 1; transform: scale(1.04); }
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-company-field__icon-right, .okkwork-stage4-s1-company-field__icon-bl):active{ transform: scale(0.98); }
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-company-field__icon-right, .okkwork-stage4-s1-company-field__icon-bl):focus-visible{
  outline: 2px solid rgba(6, 88, 162, 0.30);
  outline-offset: 2px;
  border-radius: 6px;
}

/* Зона специалистов: внешний блок — анимация высоты через grid 1fr / 0fr (плавнее max-height) */
.okkwork-s1-fieldhost .okkwork-stage1-s1-subdivision__specialists{
  margin-top: 36px;
  margin-left: 100px;
  padding-left: 0;
  position: relative;
  display: grid;
  grid-template-rows: 1fr;
  transition:
    grid-template-rows 0.45s cubic-bezier(0.33, 1, 0.32, 1),
    margin-top 0.4s cubic-bezier(0.33, 1, 0.32, 1);
}
.okkwork-s1-fieldhost .okkwork-stage1-s1-subdivision__specialists-inner{
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 22px;
  position: relative;
  padding-left: var(--okk-s1-points-indent);
  /* Иконка «Удалить» у специалиста позиционирована ниже поля (bottom: -29px) и не влияет на высоту строки —
     без отступа overflow:hidden последней строки обрезает кнопку */
  padding-bottom: 38px;
}
.okkwork-s1-fieldhost .okkwork-stage1-s1-subdivision__specialists-inner::before{
  content: "";
  position: absolute;
  left: var(--okk-s1-points-line-x);
  top: 0;
  bottom: 0;
  border-left: 2px dashed var(--okk-s1-points-line-color);
  pointer-events: none;
}
.okkwork-s1-fieldhost .okkwork-stage1-s1-spec-countcap{
  position: absolute;
  left: var(--okk-s1-points-line-x);
  bottom: 0px;
  transform: translateX(-50%);
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 2px dashed var(--okk-s1-points-line-color);
  background: rgba(245, 245, 245, 1);
  display: grid;
  place-items: center;
  color: rgba(120, 130, 140, 1);
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  user-select: none;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce){
  .okkwork-s1-fieldhost .okkwork-stage1-s1-subdivision__specialists{
    transition-duration: 0.01ms;
  }
}

/* OKKwork: индикатор "скрыто" — на одной линии между «+» и «удалить» */
.okkwork-s1-fieldhost .okkwork-stage4-s1-hidden-points-indicator{
  position: absolute;
  left: 50%;
  top: calc(26px + var(--okk-s1-block-h) + 22px);
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  height: 22px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(160, 170, 180, 0.75);
  background: rgba(245, 245, 245, 1);
  box-shadow: none;
  color: rgba(120, 130, 140, 1);
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  user-select: none;
  pointer-events: none;
  z-index: 4;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-hidden-points-indicator[hidden]{ display: none !important; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__point{ position: relative; width: 100%; left: auto; top: auto; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point{ position: relative; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__main{ min-width: 0; }

.okkwork-s1-fieldhost .okkwork-stage4-s1-point__head{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin-bottom: 6px;
}
.okkwork-s1-fieldhost :where(.okkwork-stage4-s1-point__label, .okkwork-specialist-title){
  font-family: "Inter-Light", "Inter-Regular", sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: rgba(6, 88, 162, 1);
  line-height: 1;
  margin-left: 8px;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__field{ position: relative; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__field::before{
  content: "";
  position: absolute;
  left: calc(-1 * (var(--okk-s1-points-indent) - var(--okk-s1-points-line-x)));
  top: 50%;
  width: 22px;
  border-top: 2px dashed var(--okk-s1-points-line-color);
  transform: translateY(-50%);
  pointer-events: none;
}

/* Правая зона иконок специалиста */
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__right{
  position: absolute;
  right: 16px;
  top: auto;
  bottom: -29px;
  transform: none;
  display: flex;
  align-items: center;
  gap: 0;
}

/* Иконка описания специалиста (внутри поля) */
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__inner-icon{
  position: absolute;
  right: 8px;
  top: 8px;
  width: 21px;
  height: 21px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0.9;
  transition: opacity 0.12s ease, transform 0.12s ease;
  z-index: 2;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__inner-icon.is-complete{
  filter: brightness(0.92) saturate(2.2) hue-rotate(175deg);
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__inner-icon:hover{ opacity: 1; transform: scale(1.04); }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__inner-icon:active{ transform: scale(0.98); }

/* Баллы убраны (okkwork-stage4-s1-point__score) */

/* Удалить специалиста */
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__del{
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0.92;
  transition: opacity 0.12s ease, transform 0.12s ease;
  margin-top: 0;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__del:hover{ opacity: 1; transform: scale(1.04); }
.okkwork-s1-fieldhost .okkwork-stage4-s1-point__del:active{ transform: scale(0.98); }

/* Введён текст: темно-синяя рамка при committed (толщина 1px) */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field.okkwork-company-committed .stroke-219_34{
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--okk-s1-border-filled);
  box-sizing: border-box;
  transition: border-color 0.18s ease;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .okkwork-stage4-s1-point.okkwork-company-committed .stroke-219_34{
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--okk-s1-border-filled);
  box-sizing: border-box;
  transition: border-color 0.18s ease;
}

/* Иконка заметки блока */
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__inner-icon{
  position: absolute;
  right: 8px;
  top: 5px;
  width: 21px;
  height: 21px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0.9;
  transition: opacity 0.12s ease, transform 0.12s ease, filter 0.12s ease;
  z-index: 2;
}
/* Без hue-rotate: прежний фильтр давал оранжевый оттенок; «готово» — вторая картинка (синяя) из JS */
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__inner-icon.is-complete{
  filter: none;
  opacity: 1;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__inner-icon:hover{ opacity: 1; transform: scale(1.04); }
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__inner-icon:active{ transform: scale(0.98); }

/* Свернуть/развернуть специалистов блока — тот же размер, что у заметки */
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__collapse-toggle{
  position: absolute;
  right: 36px;
  top: 5px;
  width: 21px;
  height: 21px;
  border: none;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../icon/46116e31a3a1609f0df85e759c6ab87edc6d3409.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0.9;
  z-index: 12;
  display: inline-block;
  visibility: visible;
  transform: none;
  box-shadow: none;
  transition: opacity 0.12s ease;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__collapse-toggle .okkwork-s1-chevron-img--collapse{
  transform: rotate(0deg);
  transform-origin: center center;
  transition: transform 0.22s ease;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__collapse-toggle:hover{ opacity: 1; }
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__collapse-toggle:hover .okkwork-s1-chevron-img--collapse{
  transform: scale(1.04);
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-block__collapse-toggle:active .okkwork-s1-chevron-img--collapse{
  transform: scale(0.98);
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed .okkwork-stage4-s1-block__collapse-toggle .okkwork-s1-chevron-img--collapse{
  transform: rotate(180deg);
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed .okkwork-stage4-s1-block__collapse-toggle:hover .okkwork-s1-chevron-img--collapse{
  transform: rotate(180deg) scale(1.04);
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed .okkwork-stage4-s1-block__collapse-toggle:active .okkwork-s1-chevron-img--collapse{
  transform: rotate(180deg) scale(0.98);
}

/* Развернуто: не режем по X — иначе пропадут кнопки */
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field > .okkwork-stage1-s1-subdivision__specialists{
  overflow-x: visible;
  overflow-y: visible;
  visibility: visible;
  opacity: 1;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed > .okkwork-stage1-s1-subdivision__specialists{
  display: none !important;
  margin-top: 0 !important;
  pointer-events: none;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed .okkwork-stage4-s1-company-field__point,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field--points-collapsed .okkwork-stage1-s1-subdivision__specialists-inner::before{
  display: none !important;
}


.okkwork-avatar-editor__apply{
  border: 1px solid rgba(6,88,162,.28) !important;
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16)) !important;
  box-shadow: 0 14px 35px rgba(6,88,162,.16) !important;
  color: var(--okk-title) !important;
}
.okkwork-stagecards .btn.primary:not(#okkwork-stagecards-next):not(.okkwork-stagecards-next-btn){
  border: 1px solid rgba(6,88,162,.28) !important;
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16)) !important;
  box-shadow: 0 14px 35px rgba(6,88,162,.16) !important;
  color: var(--okk-title) !important;
}

.okkwork-stagecards .btn.primary:not(#okkwork-stagecards-next):not(.okkwork-stagecards-next-btn):hover{
  filter: brightness(1.03);
}

.okkwork-avatar-editor__cancel{
  border: 1px solid rgba(6,88,162,.18) !important;
  background: rgba(255,255,255,.62) !important;
  color: var(--okk-title) !important;
}

/* Верхний блок страницы этапа 1 (поля проекта + выпадающие списки) */
:root{
  --okk-stage1-manual-shift: 235px;
}

.okkwork-stage1-topblock{
  position: absolute;
  left: 61px;
  top: 300px;
  width: 1800px;
  /* Выше внутристраничных описаний блока/специалиста (~12051); иначе дочерние z-index выпадающих
     списков не могут выйти «из-под» контекста этого блока. Глобальные fixed-оверлеи (выход ~9100,
     редактор аватара ~9000) остаются поверх этого слоя. */
  z-index: 12100;
  overflow: visible;
}

.okkwork-stage1-topblock .Pixso-frame-169_174{
  width: 1800px;
  height: 181px;
  position: relative;
  overflow: visible;
}

.okkwork-stage1-topblock .stroke-wrapper-169_175{
  position: absolute;
  left: 0;
  top: 0;
  width: 1800px;
  height: 139px;
}

.okkwork-stage1-topblock .Pixso-rectangle-169_175{
  width: 100%;
  height: 100%;
  position: relative;
  border-radius: 10px;
  background: #dce7f2;
}

.okkwork-stage1-topblock .stroke-169_175{
  position: absolute;
  inset: 0;
  border-radius: 10px;
  pointer-events: none;
  border: 1px solid rgba(6, 88, 162, 0.14);
  box-sizing: border-box;
}

.okkwork-stage1-topblock .okkwork-stage4-checklist-stats{
  position: absolute;
  left: 50%;
  top: 139px;
  transform: translateX(-50%) rotate(0deg) !important;
  z-index: 7;
  display: flex;
  justify-content: center;
  align-items: stretch;
}

.okkwork-stage1-topblock .okkwork-stage4-checklist-stats__inner{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  background: linear-gradient(110deg, #DCE7F2 0%, #EAF2FA 55%, #F7FAFD 100%) !important;
  border: 1px solid rgba(6, 88, 162, 0.14);
  border-top: 0;
  border-radius: 0 0 26px 26px;
  box-shadow: 0 12px 28px rgba(6, 88, 162, 0.10);
}

.okkwork-stage1-topblock .okkwork-stage4-checklist-stats__content{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 22px;
  padding: 8px 26px 10px;
  color: rgba(15, 23, 42, .88) !important;
  font-family: "Rubik-Light", "Inter-Regular", sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.okkwork-stage1-topblock .okkwork-stage4-checklist-stats__seg strong{
  font-family: "Rubik-Medium", "Inter-Medium", sans-serif;
  font-weight: 700;
  color: var(--okk-title);
}

.okkwork-stage1-topblock .okkwork-stage4-checklist-stats__sep{
  width: 1px;
  height: 16px;
  background: rgba(6, 88, 162, 0.18);
  flex: none;
}

.okkwork-stage1-topblock .Pixso-frame-171_11{
  width: 360px;
  height: 94px;
  position: absolute;
  top: 18px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.okkwork-stage1-topblock .Pixso-frame-171_10{
  width: 360px;
  height: 94px;
  position: absolute;
  top: 18px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.okkwork-stage1-topblock .Pixso-frame-169_178{
  width: 360px;
  height: 94px;
  position: absolute;
  top: 18px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.okkwork-stage1-topblock .Pixso-frame-171_11{ left: 28px; }
.okkwork-stage1-topblock .Pixso-frame-171_10{ left: 420px; }
.okkwork-stage1-topblock .Pixso-frame-169_178{ left: 812px; }

.okkwork-stage1-topblock .frame-content-171_11{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  position: relative;
}
.okkwork-stage1-topblock .frame-content-171_10{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  position: relative;
}
.okkwork-stage1-topblock .frame-content-169_178{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  position: relative;
}

.okkwork-stage1-topblock .Pixso-paragraph-169_176{
  color: #0658A2;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 750;
  letter-spacing: 0.01em;
  padding-left: 8px;
}
.okkwork-stage1-topblock .Pixso-paragraph-169_193{
  color: #0658A2;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 750;
  letter-spacing: 0.01em;
  padding-left: 8px;
}
.okkwork-stage1-topblock .Pixso-paragraph-169_179_0{
  color: #0658A2;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 750;
  letter-spacing: 0.01em;
  padding-left: 8px;
}

.okkwork-stage1-topblock .Pixso-paragraph-169_176{
  font-size: 14px;
  position: relative;
  top: 2px;
  margin-bottom: 8px;
}
.okkwork-stage1-topblock .Pixso-paragraph-169_193{
  font-size: 14px;
  position: relative;
  top: 2px;
  margin-bottom: 8px;
}
.okkwork-stage1-topblock .Pixso-paragraph-169_179_0{
  font-size: 14px;
  position: relative;
  top: 2px;
  margin-bottom: 8px;
}

.okkwork-stage1-topblock .Pixso-span-169_179_0_2{
  font-size: 14px;
  color: rgba(59,85,109,.92);
  font-weight: 600;
}

.okkwork-stage1-topblock .stroke-wrapper-169_191{
  position: relative;
  width: 360px;
  height: 46px;
}
.okkwork-stage1-topblock .stroke-wrapper-169_192{
  position: relative;
  width: 360px;
  height: 46px;
}
.okkwork-stage1-topblock .stroke-wrapper-169_180{
  position: relative;
  width: 360px;
  height: 46px;
}

.okkwork-stage1-topblock .Pixso-rectangle-169_191{
  width: 100%;
  height: 100%;
  position: relative;
  border-radius: 10px;
  background: rgba(220, 231, 242, 1);
}
.okkwork-stage1-topblock .Pixso-rectangle-169_192{
  width: 100%;
  height: 100%;
  position: relative;
  border-radius: 10px;
  background: rgba(220, 231, 242, 1);
}
.okkwork-stage1-topblock .Pixso-rectangle-169_180{
  width: 100%;
  height: 100%;
  position: relative;
  border-radius: 10px;
  background: rgba(220, 231, 242, 1);
}

.okkwork-stage1-topblock .stroke-169_191{
  position: absolute;
  inset: 0;
  border-radius: 10px;
  pointer-events: none;
  border: 1px solid rgba(6, 88, 162, 0.45);
  box-sizing: border-box;
}
.okkwork-stage1-topblock .stroke-169_192{
  position: absolute;
  inset: 0;
  border-radius: 10px;
  pointer-events: none;
  border: 1px solid rgba(6, 88, 162, 0.45);
  box-sizing: border-box;
}
.okkwork-stage1-topblock .stroke-169_180{
  position: absolute;
  inset: 0;
  border-radius: 10px;
  pointer-events: none;
  border: 1px solid rgba(6, 88, 162, 0.45);
  box-sizing: border-box;
}

.okkwork-stage1-topblock .okkwork-stage4-subdivision-input{
  position: absolute;
  left: 12px;
  right: 56px;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  border: 0;
  background: transparent;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: rgba(6, 88, 162, 1);
  outline: none;
  cursor: pointer;
}
.okkwork-stage1-topblock .okkwork-stage4-template-input{
  position: absolute;
  left: 12px;
  right: 56px;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  border: 0;
  background: transparent;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: rgba(6, 88, 162, 1);
  outline: none;
  cursor: pointer;
}
.okkwork-stage1-topblock .okkwork-stage4-scoring-input{
  position: absolute;
  left: 12px;
  right: 56px;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  border: 0;
  background: transparent;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: rgba(6, 88, 162, 1);
  outline: none;
  cursor: pointer;
}

.okkwork-stage1-topblock #okkwork-top-company-input{
  cursor: text;
}

.okkwork-stage1-topblock #okkwork-top-company-input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* OKKwork: верхние поля — синий текст при выбранном/введённом значении */
.okkwork-stage1-topblock #okkwork-top-company-input{
  color: rgba(72, 87, 101, 0.78) !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input{
  color: rgba(72, 87, 101, 0.78) !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input{
  color: rgba(72, 87, 101, 0.78) !important;
}

/* OKKwork: верхние поля — фон/текст по состоянию (как на скринах) */
.okkwork-stage1-topblock :is(.stroke-wrapper-169_191, .stroke-wrapper-169_192, .stroke-wrapper-169_180):has(input.okkwork-field-tone--filled)
:is(.Pixso-rectangle-169_191, .Pixso-rectangle-169_192, .Pixso-rectangle-169_180){
  background: rgba(6, 88, 162, 0.14) !important;
}

.okkwork-stage1-topblock :is(#okkwork-top-company-input, #okkwork-top-business-input, #okkwork-top-crm-input).okkwork-field-tone--filled{
  color: rgba(6, 88, 162, 1) !important;
  font-weight: 600 !important;
  font-family: "Inter-SemiBold", "Inter-Medium", "Inter-Regular", sans-serif !important;
}

.okkwork-stage1-topblock :is(#okkwork-top-company-input, #okkwork-top-business-input, #okkwork-top-crm-input).okkwork-field-tone--muted{
  color: rgba(6, 88, 162, 0.48) !important;
  font-weight: 500 !important;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif !important;
}

.okkwork-stage1-topblock #okkwork-top-company-input::placeholder{
  color: rgba(6, 88, 162, 0.48) !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input::placeholder{
  color: rgba(6, 88, 162, 0.48) !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input::placeholder{
  color: rgba(6, 88, 162, 0.48) !important;
}

.okkwork-stage1-topblock #okkwork-top-company-input:placeholder-shown{
  color: rgba(6, 88, 162, 0.48) !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input:placeholder-shown{
  color: rgba(6, 88, 162, 0.48) !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input:placeholder-shown{
  color: rgba(6, 88, 162, 0.48) !important;
}

.okkwork-stage1-topblock .okkwork-top-business-edit-link{
  position: absolute;
  right: 6px;
  top: 50px;
  bottom: -18px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #3b556d;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.okkwork-stage1-topblock .okkwork-top-business-edit-link:focus-visible{
  outline: 2px solid rgba(6, 88, 162, 0.28);
  outline-offset: 2px;
  border-radius: 6px;
}

.okkwork-stage1-topblock #okkwork-top-company-input:not(:placeholder-shown){
  color: #0658A2 !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input:not(:placeholder-shown){
  color: #0658A2 !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input:not(:placeholder-shown){
  color: #0658A2 !important;
}
.okkwork-stage1-topblock #okkwork-top-company-input.okkwork-field-tone--filled{
  color: #0658A2 !important;
}
.okkwork-stage1-topblock #okkwork-top-business-input.okkwork-field-tone--filled{
  color: #0658A2 !important;
}
.okkwork-stage1-topblock #okkwork-top-crm-input.okkwork-field-tone--filled{
  color: #0658A2 !important;
}

.okkwork-stage1-topblock .okkwork-top-selected-icon{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(6, 88, 162, 1);
  pointer-events: none;
}

.okkwork-stage1-topblock .okkwork-top-crm-selected-logo{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.okkwork-stage1-topblock .okkwork-top-crm-selected-logo img{
  width: 28px;
  height: 28px;
  display: block;
  object-fit: contain;
}

.okkwork-stage1-topblock .stroke-wrapper-169_192.has-selected-icon .okkwork-stage4-template-input{
  left: 44px;
}

.okkwork-stage1-topblock .stroke-wrapper-169_180.has-selected-logo .okkwork-stage4-scoring-input{
  left: 48px;
}

.okkwork-stage1-topblock .Pixso-vector-171_12{
  width: 1px;
  height: 80px;
  background: rgba(6, 88, 162, 1);
  position: absolute;
  left: 400px;
  top: 10px;
  opacity: 0.9;
  pointer-events: none;
}

.okkwork-stage1-topblock .okkwork-stage1-ops-toolbar{
  position: absolute;
  left: 420px;
  top: 16px;
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  pointer-events: auto;
}

/* OKKwork: панель иконок операций (50×50), подпись над иконкой (как на этапе №4) */


/* >>> OKKwork: Operations icons ===================================== */
.okkwork-stage1-topblock .okkwork-header-icon-host.okkwork-stage4-ops-icon{
  width: 86px;
  height: auto;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  border-radius: 10px;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
}

.okkwork-stage1-topblock .okkwork-stage4-ops-icon__face{
  width: 50px;
  height: 50px;
  display: block;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  border-radius: 8px;
}

.okkwork-stage1-topblock .okkwork-stage4-ops-icon__label{
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  color: rgba(6, 88, 162, 1);
  text-align: center;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.okkwork-stage1-topblock .okkwork-header-icon-host.okkwork-stage4-ops-icon:focus-visible{
  outline: 2px solid rgba(6, 88, 162, 0.35);
  outline-offset: 2px;
}

.okkwork-stage1-topblock .okkwork-stage4-ops-icon.okkwork-tooltip-host::after {
  left: 50%;
  top: calc(100% + 6px);
  transform: translateX(-50%);
  white-space: normal;
  max-width: 220px;
  width: max-content;
  text-align: left;
  line-height: 1.35;
  padding: 8px 12px;
}

.okkwork-stage1-topblock .okkwork-stage4-ops-icon.okkwork-tooltip-host:hover::after,
.okkwork-stage1-topblock .okkwork-stage4-ops-icon.okkwork-tooltip-host:focus-visible::after {
  transform: translateX(-50%) translateY(-2px);
}

/* OKKwork: Stage 1 import modal (по примеру этапа 4) */
.okkwork-stage1-import-help{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.55);
  z-index: 20000;
}
.okkwork-stage1-import-help.is-open{ display:flex; }
.okkwork-stage1-import-help__panel{
  width: min(820px, 94vw);
  background:
    radial-gradient(900px 220px at 14% 0%, rgba(6, 88, 162, 0.18), transparent 60%),
    radial-gradient(800px 220px at 86% 0%, rgba(0, 184, 217, 0.14), transparent 62%),
    linear-gradient(110deg, #DCE7F2 0%, #EAF2FA 55%, #F7FAFD 100%);
  border-radius: 18px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  box-shadow: 0 26px 80px rgba(6, 88, 162, 0.22), 0 18px 60px rgba(0,0,0,0.18);
  overflow: hidden;
}
.okkwork-stage1-integration-help{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.55);
  z-index: 20000;
}
.okkwork-stage1-integration-help.is-open{ display:flex; }
.okkwork-stage1-integration-help__panel{
  width: min(820px, 94vw);
  background:
    radial-gradient(900px 220px at 14% 0%, rgba(6, 88, 162, 0.18), transparent 60%),
    radial-gradient(800px 220px at 86% 0%, rgba(0, 184, 217, 0.14), transparent 62%),
    linear-gradient(110deg, #DCE7F2 0%, #EAF2FA 55%, #F7FAFD 100%);
  border-radius: 18px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  box-shadow: 0 26px 80px rgba(6, 88, 162, 0.22), 0 18px 60px rgba(0,0,0,0.18);
  overflow: hidden;
}
.okkwork-stage1-integration-help__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(6, 88, 162, 0.14);
}
.okkwork-stage1-integration-help__title{
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: rgba(6, 88, 162, 1);
  font-size: 18px;
}
.okkwork-stage1-integration-help__close{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  background: rgba(255,255,255,0.85);
  color: rgba(6,88,162,1);
  cursor: pointer;
}
.okkwork-stage1-integration-help__body{ padding: 14px 16px 16px; color: rgba(59,85,109,1); font-family: "Inter-Medium","Inter-Regular",sans-serif; }
.okkwork-stage1-integration-help__dev{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 145, 60, 0.55);
  background: rgba(255, 245, 235, 0.95);
  color: rgba(160, 85, 10, 1);
  font-weight: 800;
  font-size: 12px;
  margin-bottom: 10px;
}
.okkwork-stage1-integration-help__hint{ font-size: 13px; opacity: 0.95; margin-bottom: 12px; }
.okkwork-stage1-integration-help__list{
  max-height: min(420px, 56vh);
  overflow: auto;
  padding: 2px;
  display: grid;
  gap: 8px;
}
.okkwork-stage1-integration-help__list .okkwork-crm-option{
  width: 100%;
}
.okkwork-stage1-import-help__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(6, 88, 162, 0.14);
}
.okkwork-stage1-import-help__title{
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: rgba(6, 88, 162, 1);
  font-size: 18px;
}
.okkwork-stage1-import-help__close{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  background: rgba(255,255,255,0.85);
  color: rgba(6,88,162,1);
  cursor: pointer;
}
.okkwork-stage1-import-help__body{ padding: 14px 16px 6px; color: rgba(59,85,109,1); font-family: "Inter-Medium","Inter-Regular",sans-serif; }
.okkwork-stage1-import-help__steps{ display:grid; gap:10px; }
.okkwork-stage1-import-help__step{
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(6, 88, 162, 0.14);
  background: rgba(255,255,255,0.68);
}
.okkwork-stage1-import-help__files{ display:flex; flex-wrap: wrap; gap:10px; margin-top: 12px; }
.okkwork-stage1-import-help__file{
  appearance: none;
  border: 1px solid rgba(6,88,162,.22);
  background: rgba(255,255,255,0.70);
  color: rgba(6,88,162,1);
  border-radius: 14px;
  padding: 10px 12px;
  cursor: pointer;
  font-family: "Inter-Medium","Inter-Regular",sans-serif;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 10px 26px rgba(6, 88, 162, 0.10);
}
.okkwork-stage1-import-help__file:hover{ filter: brightness(1.03); }
.okkwork-stage1-import-help__file:focus-visible{
  outline: 2px solid rgba(0, 184, 217, 0.8);
  outline-offset: 2px;
}
.okkwork-stage1-import-help__hint{
  margin-top: 10px;
  font-size: 13px;
  opacity: 0.95;
}
.okkwork-stage1-import-help__picked{
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(6,88,162,0.18);
  background: rgba(255,255,255,0.75);
  color: rgba(15,23,42,.88);
  font-weight: 650;
}
.okkwork-stage1-import-help__actions{
  padding: 12px 16px 16px;
  display:flex;
  justify-content:flex-end;
}
.okkwork-stage1-import-help__btn{
  font-family: "Inter-Medium","Inter-Regular",sans-serif;
  font-size: 14px;
  font-weight: 800;
  padding: 11px 16px;
  border-radius: 14px;
  cursor: pointer;
  border: 1px solid rgba(6,88,162,.28);
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16));
  box-shadow: 0 14px 35px rgba(6,88,162,.16);
  color: rgba(6,88,162,1);
}

/* OKKwork: Stage 1 undo history modal */
.okkwork-stage1-undo-help{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.55);
  z-index: 20000;
}
.okkwork-stage1-undo-help.is-open{ display:flex; }
.okkwork-stage1-undo-help__panel{
  width: min(900px, 94vw);
  background:
    radial-gradient(900px 220px at 14% 0%, rgba(6, 88, 162, 0.18), transparent 60%),
    radial-gradient(800px 220px at 86% 0%, rgba(0, 184, 217, 0.14), transparent 62%),
    linear-gradient(110deg, #DCE7F2 0%, #EAF2FA 55%, #F7FAFD 100%);
  border-radius: 18px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  box-shadow: 0 26px 80px rgba(6, 88, 162, 0.22), 0 18px 60px rgba(0,0,0,0.18);
  overflow: hidden;
}
.okkwork-stage1-undo-help__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(6, 88, 162, 0.14);
}
.okkwork-stage1-undo-help__title{
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Inter", sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: rgba(6, 88, 162, 1);
  font-size: 18px;
}
.okkwork-stage1-undo-help__close{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  background: rgba(255,255,255,0.85);
  color: rgba(6,88,162,1);
  cursor: pointer;
}
.okkwork-stage1-undo-help__body{ padding: 14px 16px 16px; color: rgba(59,85,109,1); font-family: "Inter-Medium","Inter-Regular",sans-serif; }
.okkwork-stage1-undo-help__hint{ font-size: 13px; opacity: 0.95; margin-bottom: 10px; }
.okkwork-stage1-undo-help__list{
  max-height: min(520px, 62vh);
  overflow: auto;
  display: grid;
  gap: 10px;
}
.okkwork-stage1-undo-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px solid rgba(6, 88, 162, 0.14);
  background: rgba(255,255,255,0.72);
}
.okkwork-stage1-undo-item__meta{ display:flex; flex-direction:column; gap:4px; }
.okkwork-stage1-undo-item__label{ font-weight: 800; color: rgba(15,23,42,.92); }
.okkwork-stage1-undo-item__time{ font-size: 12px; opacity: 0.8; }
.okkwork-stage1-undo-item__btn{
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(235, 80, 80, 0.55);
  background: rgba(255, 236, 236, 1);
  box-shadow: 0 10px 26px rgba(235, 80, 80, 0.12);
  cursor: pointer;
  display:grid;
  place-items:center;
}
.okkwork-stage1-undo-item__dot{
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(235, 80, 80, 1);
  box-shadow: 0 0 0 4px rgba(235, 80, 80, 0.12);
}
.okkwork-stage1-undo-empty{
  padding: 14px 12px;
  border-radius: 16px;
  border: 1px dashed rgba(6, 88, 162, 0.22);
  background: rgba(255,255,255,0.60);
  color: rgba(72,87,101,.95);
}

/* OKKwork: Stage 1 confirm popup (Да/Нет) — like stage 4 */
.okkwork-stage1-confirm{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  z-index: 21000;
}
.okkwork-stage1-confirm.is-open{ display:flex; }
.okkwork-stage1-confirm__panel{
  width: min(720px, 92vw);
  background:
    radial-gradient(800px 220px at 12% 0%, rgba(235, 80, 80, 0.14), transparent 62%),
    radial-gradient(900px 240px at 88% 0%, rgba(6, 88, 162, 0.14), transparent 64%),
    linear-gradient(110deg, #DCE7F2 0%, #EAF2FA 55%, #F7FAFD 100%);
  border-radius: 18px;
  border: 1px solid rgba(6, 88, 162, 0.18);
  box-shadow: 0 26px 80px rgba(6, 88, 162, 0.22), 0 18px 60px rgba(0,0,0,0.18);
  overflow: hidden;
}
.okkwork-stage1-confirm__body{
  padding: 18px 18px 14px;
  font-family: "Inter-Medium","Inter-Regular",sans-serif;
  color: rgba(6, 88, 162, 1);
  font-weight: 800;
  line-height: 1.35;
}
.okkwork-stage1-confirm__actions{
  display:flex;
  justify-content:flex-end;
  gap: 10px;
  padding: 0 18px 18px;
}
.okkwork-stage1-confirm__actions button{
  font-family: "Inter-Medium","Inter-Regular",sans-serif;
  font-size: 14px;
  font-weight: 800;
  padding: 11px 16px;
  border-radius: 14px;
  cursor: pointer;
  border: 1px solid rgba(6,88,162,.18);
  background: rgba(255,255,255,0.85);
  color: rgba(6,88,162,1);
}
.okkwork-stage1-confirm__yes{
  border: 1px solid rgba(235, 80, 80, 0.55) !important;
  background: rgba(255, 236, 236, 1) !important;
  color: rgba(235, 80, 80, 1) !important;
}
.okkwork-stage1-confirm__actions button:focus-visible{
  outline: 2px solid rgba(0, 184, 217, 0.8);
  outline-offset: 2px;
}

.okkwork-stage1-topblock .okkwork-top-business-arrow,
.okkwork-stage1-topblock .okkwork-top-crm-arrow,
.okkwork-stage1-topblock .Pixso-rectangle-169_196,
.okkwork-stage1-topblock .Pixso-rectangle-169_181,
.okkwork-stage1-topblock .Pixso-rectangle-169_194 {
  width: 28px;
  height: 28px;
  position: absolute;
  right: 8px;
  z-index: 8;
  border: none;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../icon/46116e31a3a1609f0df85e759c6ab87edc6d3409.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: rotate(180deg);
  transform-origin: center center;
  transition: transform 0.22s ease, opacity 0.12s ease;
  box-shadow: none;
}

.okkwork-stage1-topblock .okkwork-top-business-arrow.is-open,
.okkwork-stage1-topblock .okkwork-top-crm-arrow.is-open,
.okkwork-stage1-topblock .Pixso-rectangle-169_196.is-open,
.okkwork-stage1-topblock .Pixso-rectangle-169_181.is-open {
  transform: rotate(0deg);
}

.okkwork-stage1-topblock .stroke-wrapper-169_192 ~ .okkwork-top-business-arrow,
.okkwork-stage1-topblock .stroke-wrapper-169_192 ~ .Pixso-rectangle-169_196 {
  top: 34px;
}

.okkwork-stage1-topblock .stroke-wrapper-169_180 ~ .okkwork-top-crm-arrow,
.okkwork-stage1-topblock .stroke-wrapper-169_180 ~ .Pixso-rectangle-169_181 {
  top: 34px;
}

.okkwork-stage1-topblock .okkwork-stage4-add-subdivision-center{
  position: absolute;
  left: 50%;
  top: 210px;
  transform: translateX(-50%);
  z-index: 10;
}

.okkwork-stage1-topblock .okkwork-stage4-panel-btn{
  font-family: "Inter-Medium", "Inter-Regular", sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 18px;
  border-radius: 10px;
  cursor: pointer;
  border: 1px solid rgba(107, 124, 128, 0.35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  appearance: none;
}

.okkwork-stage1-topblock .okkwork-stage4-panel-btn:active{
  transform: translateY(1px);
}

.okkwork-stage1-topblock .okkwork-stage4-panel-btn:focus-visible{
  outline: 2px solid rgba(6, 88, 162, 0.35);
  outline-offset: 2px;
}

.okkwork-stage1-topblock .okkwork-stage4-panel-btn--primary{
  border: 1px solid rgba(6, 88, 162, 0.45);
  background: linear-gradient(180deg, rgba(232, 243, 255, 1) 0%, rgba(220, 236, 255, 0.98) 100%);
  color: rgba(6, 88, 162, 1);
  box-shadow: 0 2px 8px rgba(6, 88, 162, 0.14);
}

.okkwork-stage1-topblock .okkwork-stage4-panel-btn--primary:hover{
  background: rgba(220, 236, 255, 1);
  box-shadow: 0 4px 12px rgba(6, 88, 162, 0.18);
}

.okkwork-stage1-topblock .okkwork-stage4-add-subdivision-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 22px;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(232, 243, 255, 1) 0%, rgba(220, 236, 255, 0.98) 100%);
  border: 1px solid rgba(6, 88, 162, 0.45);
  color: rgba(6, 88, 162, 1);
  box-shadow: none;
  transition: none !important;
  animation: none !important;
  filter: none !important;
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  appearance: none;
}

.okkwork-stage1-topblock .okkwork-stage4-add-subdivision-btn:hover{
  /* без белого "блика": фон не меняем на плоский */
  background: linear-gradient(180deg, rgba(232, 243, 255, 1) 0%, rgba(220, 236, 255, 0.98) 100%);
  box-shadow:
    0 18px 56px rgba(6, 88, 162, 0.10),
    0 3px 14px rgba(0, 0, 0, 0.05);
  transition: none !important;
  animation: none !important;
  filter: none !important;
}

.okkwork-stage1-topblock .okkwork-stage4-add-subdivision-btn__icon{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: rgba(6, 88, 162, 0.14);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  line-height: 1;
}

.Pixso-frame-219_41{ transform: translateY(var(--okk-stage1-manual-shift)) !important; }
.Pixso-frame-219_50{ transform: translateY(var(--okk-stage1-manual-shift)) !important; }
.Pixso-frame-219_58{ transform: translateY(var(--okk-stage1-manual-shift)) !important; }
.Pixso-frame-219_105{ transform: translateY(var(--okk-stage1-manual-shift)) !important; }
.Pixso-frame-219_108{ transform: translateY(var(--okk-stage1-manual-shift)) !important; }
.okkwork-next-step-stack{
  transform: translateY(var(--okk-stage1-manual-shift)) !important;
}

/* OKKwork: кнопка "Добавить блок" над новой структурой (как этап 4) */
/* (кнопка перенесена на okkwork-stage4-add-subdivision) */

/* OKKwork: popup-формы описаний (перенос стилей этапа 4) */
.Pixso-frame-171_149 {
  width: 865px;
  height: 656px;
  position: relative;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.frame-content-171_149 {
  display: block;
  width: 100%;
  height: 656px;
  position: relative;
  overflow: visible;
}
#okkwork-stage4-pointdesc .frame-content-171_149 {
  height: 800px;
  isolation: isolate;
  transform: translateZ(0);
}
.Pixso-paragraph-171_150{
  font-size: 16px;
  font-family: "Rubik-Medium";
  font-weight: 500;
  color: rgba(6, 88, 162, 1);
  position: absolute;
  margin: 0;
  left: 12px;
  top: -25px;
}
.Pixso-paragraph-171_153{
  font-size: 14px;
  font-family: "Rubik-Regular";
  font-weight: 400;
  color: rgba(72, 87, 101, 0.5);
  position: absolute;
  margin: 0;
  top: 14px;
  text-align: right;
  right: 12px;
  left: auto;
  max-width: min(440px, 52vw);
  z-index: 16;
}
/* Пояснение уровень/рейтинг — один ряд с ID, слева от него */
#okkwork-stage4-pointdesc #okkwork-pointdesc-private-notice.okkwork-pointdesc-top-note {
  position: absolute !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 8px 0 0 !important;
  margin: 0 !important;
  left: 12px !important;
  right: calc(12px + min(460px, 54%)) !important;
  top: 20px !important;
  max-width: none !important;
  width: auto !important;
  text-align: left;
  white-space: nowrap !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  color: rgba(115, 125, 135, 0.95) !important;
  z-index: 15;
}
.Pixso-rectangle-171_151{ width: 100%; height: 100%; position: relative; border-radius: 18px; background: rgba(245,245,245,1); }
.stroke-wrapper-171_151{ position: absolute; left: 0; top: 0; width: 100%; height: 656px; }
#okkwork-stage4-pointdesc .stroke-wrapper-171_151 { height: 800px !important; }
.stroke-171_151{ position:absolute; inset:0; border-radius:18px; border:0.5px solid rgba(6,88,162,.28); pointer-events:none; box-shadow: 0 0 0 1px rgba(255,255,255,0.2) inset; }

.Pixso-rectangle-171_156{
  position: absolute;
  border-radius: 18px;
  background: rgba(255,255,255,1);
}
.Pixso-rectangle-171_158{
  position: absolute;
  border-radius: 18px;
  background: rgba(255,255,255,1);
}
.Pixso-rectangle-171_159{
  position: absolute;
  border-radius: 18px;
  background: rgba(255,255,255,1);
}
.Pixso-rectangle-171_160{
  position: absolute;
  border-radius: 18px;
  background: rgba(255,255,255,1);
}

/* ===== 07. Popups / modals ===================================== */


/* >>> OKKwork: Popups (descriptions) ===================================== */
.okkwork-stage4-pointdesc {
  position: fixed;
  width: 865px;
  height: 800px;
  display: none !important;
  z-index: 12050; /* поверх всего макета */
  pointer-events: auto;
  max-width: calc(100vw - 20px);
  max-height: calc(100vh - 20px);
}
.okkwork-stage4-pointdesc.is-open { display: flex !important; }
.okkwork-stage4-pointdesc.is-open{ pointer-events: auto !important; }
.okkwork-stage4-pointdesc.is-open * { pointer-events: auto !important; }
.okkwork-stage4-pointdesc.Pixso-frame-171_149 { position: fixed; left: 0; top: 0; }
/* Градиент формы (как этап 4) */
#okkwork-stage4-pointdesc .Pixso-rectangle-171_151{
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16)) !important;
  position: relative;
  z-index: 1; /* подложка */
}

.okkwork-stage4-blockdesc {
  position: fixed;
  width: 865px;
  height: 540px;
  display: none !important;
  z-index: 12051; /* поверх всего макета */
  pointer-events: auto;
  max-width: calc(100vw - 20px);
  max-height: calc(100vh - 20px);
}
.okkwork-stage4-blockdesc.is-open { display: flex !important; }
.okkwork-stage4-blockdesc.is-open{ pointer-events: auto !important; }
.okkwork-stage4-blockdesc.is-open * { pointer-events: auto !important; }
.okkwork-stage4-blockdesc.Pixso-frame-171_149 { position: fixed; left: 0; top: 0; height: 540px !important; }

/* OKKwork: гарантированно показывать только одну форму описания за раз */
.okkwork-stage4-pointdesc.is-open ~ .okkwork-stage4-blockdesc.is-open { display: none !important; }
/* Градиент формы блока */
#okkwork-stage4-blockdesc .Pixso-rectangle-171_151{
  background: linear-gradient(110deg, rgba(6,88,162,.16), rgba(0,184,217,.16), rgba(148,216,45,.16)) !important;
  position: relative;
  z-index: 1; /* подложка */
}

/* OKKwork: вернуть белые поля в popup на передний план (скрин 5) */
#okkwork-stage4-pointdesc [id="171_156"]{
  display: none !important;
}
#okkwork-stage4-pointdesc [id="171_158"]{
  position: absolute;
  z-index: 10 !important;
  background: transparent !important;
  pointer-events: none;
}
/* Координаты формы специалиста — из HTML в CSS (без !important) */
#okkwork-stage4-pointdesc #171_156 { left: 12px; top: 131px; width: 842px; height: 96px; }
#okkwork-stage4-pointdesc #171_158 { left: 12px; top: 57px; width: 842px; height: 43px; border-radius: 10px; }
#okkwork-stage4-pointdesc #171_159 { left: 12px; top: 277px; width: 842px; height: 96px; }
#okkwork-stage4-pointdesc #171_160 { left: 12px; top: 425px; width: 842px; height: 96px; }
#okkwork-stage4-pointdesc #okkwork-caption-level { top: 110px; }
#okkwork-stage4-pointdesc #okkwork-pointdesc-level-wrap { top: 127px; }
/* gap 5px между низом поля «Уровень» (127+43) и заголовком «Рейтинг» */
#okkwork-stage4-pointdesc #okkwork-caption-rating { top: 185px; }
#okkwork-stage4-pointdesc #okkwork-pointdesc-rating-wrap { top: 200px; }
#okkwork-stage4-pointdesc #okkwork-caption-strong { top: 300px; }
#okkwork-stage4-pointdesc #okkwork-pointdesc-exceptions {
  left: 12px;
  top: 320px;
  right: 11px;
  width: auto;
  height: 84px;
}
#okkwork-stage4-pointdesc #okkwork-caption-weak { top: 442px; }
#okkwork-stage4-pointdesc #okkwork-pointdesc-examples {
  left: 12px;
  top: 460px;
  right: 11px;
  width: auto;
  height: 82px;
}
#okkwork-stage4-pointdesc #okkwork-spec-attach-strip { top: 612px; }
/* Три поля: Фамилия, Имя, расширенная Должность (без Отчества) */
#okkwork-stage4-pointdesc .okkwork-pointdesc-title-row {
  position: absolute;
  left: 12px;
  right: 11px;
  width: auto;
  top: 52px;
  height: 43px;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 5px;
  /* Выше блока «Уровень», чтобы выпадающий список «Должность» перекрывал его */
  z-index: 700;
  box-sizing: border-box;
  overflow: visible;
}
#okkwork-stage4-pointdesc #okkwork-pointdesc-surname {
  flex: 1 1 18%;
}
#okkwork-stage4-pointdesc #okkwork-pointdesc-firstname {
  flex: 1 1 18%;
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-pos-combo-root {
  flex: 3 1 55%;
  min-width: 0;
}
/* Единый «матовый» фон полей (как на скрине у «Фамилия»): полупрозрачное белое + лёгкое размытие */
#okkwork-stage4-pointdesc .okkwork-pointdesc-title-row .okkwork-pointdesc-title-field,
#okkwork-stage4-pointdesc .okkwork-pointdesc-level-input {
  flex: 1 1 0;
  min-width: 0;
  height: 43px;
  box-sizing: border-box;
  margin: 0;
  padding: 10px 10px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  outline: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 6px rgba(6, 88, 162, 0.08);
  color: rgba(72, 87, 101, 1);
  font-family: "Rubik-Regular", system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.2;
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-title-row .okkwork-pointdesc-title-field::placeholder {
  color: rgba(160, 170, 180, 1);
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-title-row .okkwork-pointdesc-title-field:focus,
#okkwork-stage4-pointdesc .okkwork-pointdesc-level-input:focus {
  border-color: rgba(6, 88, 162, 0.45);
  box-shadow: 0 0 0 1px rgba(6, 88, 162, 0.2);
}
#okkwork-pointdesc-level-hit:focus-visible,
#okkwork-pointdesc-position-hit:focus-visible {
  outline: 2px solid rgba(6, 88, 162, 0.28);
  outline-offset: 1px;
  border-radius: 8px;
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-input-bordered:focus {
  border-color: rgba(6, 88, 162, 0.45);
  box-shadow: 0 0 0 1px rgba(6, 88, 162, 0.2);
}
#okkwork-stage4-pointdesc [id="171_159"]{
  display: none !important;
}
#okkwork-stage4-pointdesc [id="171_160"]{
  display: none !important;
}
/* Белые заглушки Pixso скрыты — те же поля «стекла», что и у описания специалиста */
#okkwork-stage4-blockdesc [id="bd_156"],
#okkwork-stage4-blockdesc [id="bd_158"]{
  display: none !important;
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-input{ z-index: 11 !important; }
#okkwork-stage4-blockdesc .okkwork-pointdesc-input{ z-index: 11 !important; }

#okkwork-stage4-blockdesc .okkwork-pointdesc-input-bordered {
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 6px rgba(6, 88, 162, 0.08);
  padding-top: 10px;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-input--single.okkwork-pointdesc-input-bordered {
  padding-top: 11px;
  white-space: nowrap;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-input-bordered:focus {
  border-color: rgba(6, 88, 162, 0.45);
  box-shadow: 0 0 0 1px rgba(6, 88, 162, 0.2), 0 1px 6px rgba(6, 88, 162, 0.08);
}
#okkwork-blockdesc-desc {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
/* Многострочный пример-плейсхолдер только в описании блока */
#okkwork-blockdesc-desc.okkwork-pointdesc-input[contenteditable="true"]:empty:before {
  white-space: pre-wrap;
  max-height: none;
}

/* Тулбар форматирования в модалке подразделения (над текстом описания) */
#okkwork-stage4-blockdesc .okkwork-pointdesc-bottom-icons {
  position: absolute;
  right: 12px;
  left: 12px;
  bottom: auto;
  top: 100px;
  width: auto;
  max-width: none;
  justify-content: flex-end;
}
/* Вторая панель — под полем описания; высота поля чуть уменьшена, чтобы не наезжать на «Сохранить» */
#okkwork-stage4-blockdesc .okkwork-blockdesc-richbar--below {
  top: 438px;
  bottom: auto;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-bottom-btn {
  transform: translateZ(0);
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-bottom-btn img {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-palette,
#okkwork-stage4-blockdesc .okkwork-pointdesc-emoji {
  position: absolute;
  z-index: 80;
}

/* Счётчик у поля описания («мало информации» и т.д.) — два сегмента прогресса у названия не показываем */
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter {
  position: absolute;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-family: "Rubik-Medium", "Rubik-Regular", sans-serif;
  font-size: 12px;
  letter-spacing: 0.02em;
  white-space: nowrap;
  color: rgba(40, 48, 56, 1);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(120, 120, 120, 0.22);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.14);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  user-select: none;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-2px);
  transition: opacity 0.14s ease, transform 0.14s ease, box-shadow 0.14s ease;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0px);
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.03);
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter__num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter__label { opacity: 0.9; }
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-low {
  border-color: rgba(235, 80, 80, 0.45);
  box-shadow: 0 10px 26px rgba(235, 80, 80, 0.12), 0 0 0 1px rgba(235, 80, 80, 0.08) inset;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-low .okkwork-pointdesc-counter__dot { background: rgba(235, 80, 80, 1); }
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-mid {
  border-color: rgba(255, 145, 60, 0.55);
  box-shadow: 0 10px 26px rgba(255, 145, 60, 0.14), 0 0 0 1px rgba(255, 145, 60, 0.1) inset;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-mid .okkwork-pointdesc-counter__dot { background: rgba(255, 145, 60, 1); }
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-high {
  border-color: rgba(45, 190, 115, 0.55);
  box-shadow: 0 10px 26px rgba(45, 190, 115, 0.14), 0 0 0 1px rgba(45, 190, 115, 0.1) inset;
}
#okkwork-stage4-blockdesc .okkwork-pointdesc-counter.is-high .okkwork-pointdesc-counter__dot { background: rgba(45, 190, 115, 1); }

/* Мини-стили для rich-text полей */
.okkwork-pointdesc-input {
  position: absolute;
  z-index: 3;
  border: none;
  outline: none;
  background: transparent;
  color: rgba(72, 87, 101, 1);
  font-family: "Rubik-Regular";
  font-size: 14px;
  line-height: 1.2;
  padding: 10px 12px;
  box-sizing: border-box;
  overflow: hidden;
  white-space: pre-wrap;
  word-break: break-word;
}
.okkwork-pointdesc-input--single { padding-top: 11px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.okkwork-pointdesc-input[contenteditable="true"]:empty:before {
  content: attr(data-placeholder);
  color: rgba(160, 170, 180, 1);
}
.okkwork-pointdesc-input a { color: rgba(6, 88, 162, 1); text-decoration: underline; }
.okkwork-pointdesc-input ol { list-style-position: inside; padding-left: 18px; margin: 0; }
.okkwork-pointdesc-input ul { list-style-position: inside; padding-left: 18px; margin: 0; }
.okkwork-pointdesc-input ol { list-style-type: decimal !important; }
.okkwork-pointdesc-input ul { list-style-type: disc !important; }

.okkwork-pointdesc-field-caption {
  position: absolute;
  left: 14px;
  margin: 0;
  font-size: 12px;
  font-family: "Rubik-Medium", "Rubik-Regular", sans-serif;
  font-weight: 500;
  color: rgba(6, 88, 162, 0.92);
  z-index: 12;
}
.okkwork-pointdesc-qc-disclaimer {
  position: absolute;
  left: 12px;
  right: 11px;
  margin: 0;
  padding: 8px 10px;
  box-sizing: border-box;
  font-size: 12px;
  line-height: 1.35;
  font-family: "Rubik-Regular", sans-serif;
  color: rgba(6, 88, 162, 0.95);
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid rgba(6, 88, 162, 0.2);
  border-radius: 10px;
  z-index: 12;
}
.okkwork-pointdesc-pos-combo-root {
  position: relative;
  min-width: 0;
}
.okkwork-pointdesc-pos-inner {
  position: relative;
  height: 43px;
  width: 100%;
}
.okkwork-pointdesc-pos-inner .okkwork-pointdesc-title-field {
  width: 100%;
  flex: unset !important;
  padding-right: 34px !important;
}
/* Кнопка-иконка списка (уровень / должность) */
.okkwork-pointdesc-hit-suggest {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 8px;
  padding: 0;
  margin: 0;
  display: grid;
  place-items: center;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.55);
}
.okkwork-pointdesc-hit-suggest:hover {
  background: rgba(255, 255, 255, 0.85);
}
.okkwork-pointdesc-hit-icon {
  width: 14px;
  height: 14px;
  object-fit: contain;
  display: block;
  pointer-events: none;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
.okkwork-pointdesc-level-combo {
  position: absolute;
  left: 12px;
  right: 11px;
  width: auto;
  height: auto;
  z-index: 20;
}
.okkwork-pointdesc-level-inner {
  position: relative;
  height: 43px;
  width: 100%;
}
.okkwork-pointdesc-level-inner .okkwork-pointdesc-level-input {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  flex: unset;
  width: 100%;
  height: 43px !important;
  padding-right: 38px !important;
  padding-left: 10px !important;
  border-radius: 10px !important;
}
.okkwork-pointdesc-level-inner .okkwork-pointdesc-hit-suggest {
  z-index: 2;
}
/* Без второго браузерного выпадающего списка: list убран в разметке */
.okkwork-pointdesc-level-input,
.okkwork-pointdesc-pos-inner .okkwork-pointdesc-title-field {
  appearance: none;
  -webkit-appearance: none;
}
.okkwork-pointdesc-level-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(43px + 6px);
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 10px;
  border: 1px solid rgba(200, 210, 225, 0.65);
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 28px rgba(6, 88, 162, 0.15);
  z-index: 90;
  padding: 4px 0;
  box-sizing: border-box;
}
.okkwork-pointdesc-level-panel[hidden] {
  display: none !important;
}
.okkwork-pointdesc-level-option {
  padding: 8px 12px;
  font-size: 13px;
  font-family: "Rubik-Regular", system-ui, sans-serif;
  color: rgba(72, 87, 101, 1);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.okkwork-pointdesc-level-option:hover,
.okkwork-pointdesc-level-option.is-active {
  background: rgba(6, 88, 162, 0.1);
  color: rgba(6, 88, 162, 1);
}
.okkwork-pointdesc-level-empty {
  padding: 10px 12px;
  font-size: 12px;
  color: rgba(120, 130, 142, 0.95);
}
.okkwork-pointdesc-rating-wrap {
  position: absolute;
  left: 12px;
  right: 11px;
  z-index: 12;
}
.okkwork-pointdesc-rating-heads {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 6px;
  font-size: 11px;
  line-height: 1.25;
  color: rgba(72, 87, 101, 0.75);
  font-family: "Rubik-Regular", sans-serif;
  margin-left: 5px !important;
}
.okkwork-pointdesc-rating-ticks {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  padding: 0 6px;
  font-size: 14px;
  color: rgba(72, 87, 101, 0.55);
  font-family: "Rubik-Regular", sans-serif;
  user-select: none;
}
.okkwork-pointdesc-rating-ticks span {
  flex: 1;
  text-align: center;
}
.okkwork-rating-slider-wrap {
  position: relative;
  height: 32px;
  display: flex;
  align-items: center;
}
input[type="range"].okkwork-pointdesc-rating-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: var(--okk-rating-track-h, 6px);
  margin: 0;
  padding: 0;
  border-radius: 999px;
  background: rgba(200, 208, 216, 0.85);
  outline: none;
  --okk-thumb: 17px;
  --okk-thumb-c: rgb(148, 152, 160);
}
input[type="range"].okkwork-pointdesc-rating-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: var(--okk-thumb);
  height: var(--okk-thumb);
  border-radius: 50%;
  background: var(--okk-thumb-c);
  border: 2px solid rgba(255, 255, 255, 0.92);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  cursor: grab;
  margin-top: -5px;
}
input[type="range"].okkwork-pointdesc-rating-slider:active::-webkit-slider-thumb {
  cursor: grabbing;
}
input[type="range"].okkwork-pointdesc-rating-slider::-moz-range-thumb {
  width: var(--okk-thumb);
  height: var(--okk-thumb);
  border-radius: 50%;
  background: var(--okk-thumb-c);
  border: 2px solid rgba(255, 255, 255, 0.92);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  cursor: grab;
}
input[type="range"].okkwork-pointdesc-rating-slider::-moz-range-track {
  height: var(--okk-rating-track-h, 6px);
  border-radius: 999px;
  background: rgba(200, 208, 216, 0.85);
}

#okkwork-stage4-pointdesc .okkwork-pointdesc-input-bordered {
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 6px rgba(6, 88, 162, 0.08);
  padding-top: 10px;
}

/* Вложения (3 типа) */
.okkwork-spec-attach-strip {
  position: absolute;
  left: 12px;
  right: 11px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  z-index: 14;
}
.okkwork-spec-attach-slot {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
}
.okkwork-spec-attach-slot__pick {
  position: relative;
  min-height: 72px;
  border-radius: 12px;
  border: 1px solid rgba(160, 190, 220, 0.55);
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 8px rgba(6, 88, 162, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px;
  cursor: pointer;
  text-align: center;
  box-sizing: border-box;
}
.okkwork-spec-attach-slot__pick:hover {
  border-color: rgba(6, 88, 162, 0.45);
  background: rgba(255, 255, 255, 0.86);
}
.okkwork-spec-attach-slot__pick.has-file {
  border-style: solid;
  border-color: rgba(6, 88, 162, 0.35);
}
.okkwork-spec-attach-slot__lbl {
  font-size: 10px;
  line-height: 1.25;
  color: rgba(72, 87, 101, 0.92);
  font-family: "Rubik-Regular", sans-serif;
}
.okkwork-spec-attach-slot__fname {
  font-size: 10px;
  color: rgba(6, 88, 162, 0.92);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 4px;
}
.okkwork-spec-attach-slot__thumb {
  max-width: 100%;
  max-height: 48px;
  object-fit: cover;
  border-radius: 6px;
}
.okkwork-spec-attach-slot__del {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 3;
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.95);
  color: rgba(72, 87, 101, 0.95);
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
.okkwork-spec-attach-slot__del:hover {
  background: rgba(255, 220, 220, 1);
}

/* Палитра маркера (как на этапе 4) */
.okkwork-pointdesc-palette {
  position: absolute;
  z-index: 121; /* above bottom icons + emoji */
  display: none;
  grid-template-columns: repeat(5, 20px);
  gap: 8px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(120, 120, 120, 0.28);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}
.okkwork-pointdesc-palette.is-open { display: grid; }
.okkwork-pointdesc-palette__swatch {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  cursor: pointer;
}
.okkwork-pointdesc-palette__swatch--clear {
  background:
    linear-gradient(45deg, rgba(200,200,200,0.9) 25%, transparent 25%, transparent 75%, rgba(200,200,200,0.9) 75%, rgba(200,200,200,0.9)),
    linear-gradient(45deg, rgba(200,200,200,0.9) 25%, transparent 25%, transparent 75%, rgba(200,200,200,0.9) 75%, rgba(200,200,200,0.9));
  background-position: 0 0, 6px 6px;
  background-size: 12px 12px;
}

/* Emoji pop (как на этапе 4) */
.okkwork-pointdesc-emoji {
  position: absolute;
  right: 12px;
  top: 390px; /* над панелью инструментов */
  width: 420px;
  height: 320px;
  padding: 10px;
  display: none;
  grid-template-rows: auto 1fr auto;
  gap: 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(120, 120, 120, 0.28);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
  z-index: 90;
}
.okkwork-pointdesc-emoji.is-open { display: grid; }
.okkwork-pointdesc-emoji__search {
  height: 32px;
  width: 100%;
  border: 1px solid rgba(120, 120, 120, 0.28);
  border-radius: 10px;
  padding: 0 10px;
  outline: none;
  font-family: "Rubik-Regular", "Rubik-Medium", Rubik, sans-serif;
  font-size: 13px;
  color: rgba(72, 87, 101, 1);
  box-sizing: border-box;
}
.okkwork-pointdesc-emoji__grid {
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 4px;
  padding-right: 4px;
  grid-auto-rows: min-content;
  align-content: start;
}
.okkwork-pointdesc-emoji__cats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding-top: 4px;
}
.okkwork-pointdesc-emoji__cat {
  flex: 1 1 auto;
  height: 28px;
  border: 1px solid rgba(120, 120, 120, 0.22);
  background: rgba(255, 255, 255, 1);
  border-radius: 10px;
  cursor: pointer;
  font-size: 12px;
  font-family: "Rubik-Regular", "Rubik-Medium", Rubik, sans-serif;
  color: rgba(72, 87, 101, 1);
  -webkit-tap-highlight-color: transparent;
}
.okkwork-pointdesc-emoji__cat.is-active {
  border-color: rgba(6, 88, 162, 0.45);
  background: rgba(6, 88, 162, 0.08);
}
.okkwork-pointdesc-emoji__item {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  cursor: pointer;
  border-radius: 6px;
  font-size: 16px;
  line-height: 1;
}
.okkwork-pointdesc-emoji__item:hover { background: rgba(6, 88, 162, 0.08); }
.okkwork-pointdesc-emoji__item[data-kind="html"] {
  width: auto;
  height: auto;
  padding: 1px 2px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  grid-column: span 5;
  border-radius: 10px;
}
.okkwork-emoji-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-family: "Rubik-Medium", "Rubik-SemiBold", Rubik, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.1;
  white-space: nowrap;
  vertical-align: middle;
  user-select: none;
  pointer-events: none;
}
.okkwork-emoji-badge--danger {
  color: rgba(255, 255, 255, 1);
  background: linear-gradient(135deg, rgba(255, 77, 77, 1) 0%, rgba(255, 45, 110, 1) 55%, rgba(190, 20, 70, 1) 100%);
  border: 1px solid rgba(255, 150, 190, 0.35);
  box-shadow: 0 10px 22px rgba(255, 45, 110, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.10) inset;
}
.okkwork-emoji-badge--success {
  color: rgba(255, 255, 255, 1);
  background: linear-gradient(135deg, rgba(45, 190, 115, 1) 0%, rgba(22, 170, 92, 1) 55%, rgba(16, 120, 66, 1) 100%);
  border: 1px solid rgba(160, 255, 215, 0.34);
  box-shadow: 0 10px 22px rgba(45, 190, 115, 0.16), 0 0 0 1px rgba(255, 255, 255, 0.10) inset;
}

/* Нижняя панель + кнопка сохранить (как этап 4) */
.okkwork-pointdesc-bottom-icons{
  position: absolute;
  right: 12px;
  left: auto;
  bottom: auto;
  top: 548px;
  width: auto;
  max-width: calc(100% - 24px);
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  z-index: 60;
}
.okkwork-pointdesc-bottom-btn{
  width: 26px;
  height: 26px;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  border-radius: 8px;
  display: grid;
  place-items: center;
}
.okkwork-pointdesc-bottom-btn:hover{ background: rgba(6, 88, 162, 0.08); }
#okkwork-stage4-pointdesc .okkwork-pointdesc-bottom-btn {
  transform: translateZ(0);
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-bottom-btn img {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -ms-interpolation-mode: nearest-neighbor;
}

.okkwork-pointdesc-save-btn{
  position: absolute;
  right: 12px;
  bottom: 12px;
  height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(120, 255, 195, 0.45);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(148, 216, 45, 1) 0%, rgba(75, 210, 130, 1) 52%, rgba(46, 185, 122, 1) 100%);
  color: rgba(255, 255, 255, 1);
  font-size: 15px;
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  z-index: 6;
}
.okkwork-pointdesc-save-btn:hover{ filter: brightness(1.03) saturate(1.08); transform: translateY(-1px); }
.okkwork-pointdesc-save-btn:active{ transform: translateY(0px); }

/* OKKwork: описания специалиста и подразделения — только Rubik */
#okkwork-stage4-pointdesc,
#okkwork-stage4-blockdesc {
  font-family: "Rubik-Regular", "Rubik-Medium", "Rubik-SemiBold", Rubik, sans-serif;
}
#okkwork-stage4-pointdesc *,
#okkwork-stage4-blockdesc * {
  font-family: inherit;
}
#okkwork-stage4-pointdesc .Pixso-paragraph-171_150,
#okkwork-stage4-blockdesc .Pixso-paragraph-171_150 {
  font-family: "Rubik-Medium", Rubik, sans-serif !important;
  font-weight: 500;
}
#okkwork-stage4-pointdesc .Pixso-paragraph-171_153,
#okkwork-stage4-blockdesc .Pixso-paragraph-171_153 {
  font-family: "Rubik-Regular", Rubik, sans-serif !important;
  font-weight: 400;
}
#okkwork-stage4-pointdesc .okkwork-pointdesc-save-btn,
#okkwork-stage4-blockdesc .okkwork-pointdesc-save-btn {
  font-family: "Rubik-SemiBold", "Rubik-Medium", Rubik, sans-serif !important;
}

.Pixso-paragraph-129_31,
.Pixso-paragraph-129_34 {
  font-family: "Rubik-SemiBold", "Rubik-Medium", sans-serif !important;
  font-weight: 600;
}

/* Специалист — Rubik; подразделение в списке — Inter как верхнее поле этапа 4 */
.okkwork-stage4-subdivision-input,
.okkwork-s1-fieldhost .okkwork-stage4-s1-point input.Pixso-paragraph-219_35,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__point input.Pixso-paragraph-219_35 {
  font-family: "Rubik-Medium", sans-serif !important;
  font-weight: 400;
}

.okkwork-stage4-subdivision-input::placeholder,
.okkwork-s1-fieldhost .okkwork-stage4-s1-point input.Pixso-paragraph-219_35::placeholder,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__point input.Pixso-paragraph-219_35::placeholder {
  font-family: "Rubik-Medium", sans-serif !important;
}

.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) input.Pixso-paragraph-219_35{
  font-family: "Inter-Medium", "Inter-Regular", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: rgba(6, 88, 162, 1) !important;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) input.okkwork-field-tone--filled{
  font-weight: 600 !important;
  font-family: "Inter-SemiBold", "Inter-Medium", "Inter-Regular", sans-serif !important;
  color: rgba(6, 88, 162, 1) !important;
}
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) input.okkwork-field-tone--muted,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field__field:has(.okkwork-stage4-s1-block__stroke, .okkwork-stage1-s1-block__stroke) input.Pixso-paragraph-219_35::placeholder{
  color: rgba(6, 88, 162, 0.48) !important;
  font-weight: 500 !important;
  font-family: "Inter-Medium", "Inter-Regular", sans-serif !important;
}

.okkwork-s1-fieldhost .Pixso-paragraph-219_33,
.okkwork-s1-fieldhost .okkwork-stage4-s1-company-field .Pixso-paragraph-219_33 {
  font-family: "Rubik-SemiBold", "Rubik-Medium", sans-serif !important;
  font-weight: 600;
}