/* DevChat widget + lead form — дополняет стили страницы разработки (nx-dev-*). */
.nx-devchat { max-width: 760px; margin: 0 auto; }
.nx-devchat__step { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 14px 0; }
.nx-devchat__step[hidden] { display: none; }
.nx-devchat__step .nx-dev-field { flex: 1 1 240px; margin: 0; }
.nx-devchat__step[data-step="chat"] { display: block; }
.nx-devchat__step[data-step="chat"][hidden] { display: none; }
.nx-devchat__log { height: 360px; overflow-y: auto; padding: 12px; border-radius: 12px; background: rgba(0, 0, 0, .04); display: flex; flex-direction: column; gap: 8px; }
.nx-devchat__msg { max-width: 85%; padding: 9px 13px; border-radius: 14px; line-height: 1.45; white-space: pre-wrap; word-wrap: break-word; font-size: 15px; }
.nx-devchat__msg--user { align-self: flex-end; background: #2b6cff; color: #fff; border-bottom-right-radius: 4px; }
.nx-devchat__msg--assistant { align-self: flex-start; background: #fff; color: #1d2433; border: 1px solid rgba(0, 0, 0, .08); border-bottom-left-radius: 4px; }
.nx-devchat__compose { display: flex; gap: 8px; margin-top: 10px; }
.nx-devchat__compose textarea { flex: 1; resize: vertical; min-height: 48px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, .15); padding: 8px 10px; font: inherit; }
.nx-devchat__tools { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.nx-devchat__spec { margin-top: 12px; max-height: 360px; overflow: auto; white-space: pre-wrap; background: #f7f8fb; border-radius: 10px; padding: 12px; font-size: 13px; }
.nx-devchat__status { min-height: 1.4em; margin: 8px 0 0; font-size: 14px; }
.nx-devchat-or { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.nx-devchat-or .nx-dev-field { flex: 1 1 200px; }
.nx-devchat-or__sep { padding-bottom: 12px; opacity: .6; font-size: 13px; }
.nx-devchat-teaser h3 { margin: 8px 0 12px; }
@media (max-width: 600px) { .nx-devchat__log { height: 300px; } .nx-devchat__msg { max-width: 95%; } }

/* dc2: шаг «первое сообщение» и закрытые ворота */
.nx-devchat__step[data-step="intro"] .nx-dev-field { flex-basis: 100%; }
.nx-devchat__step[data-step="intro"] textarea { width: 100%; }
.nx-devchat__step[data-step="closed"] p { flex-basis: 100%; margin: 0; }
/* чат внутри правой карточки #nx-dev-voice (/development) */
.nx-dev-voice .nx-devchat--in-slot { width: 100%; max-width: none; margin: 0; text-align: left; }

/* ==========================================================================
   dc4: визуальная полировка чата в правой карточке (тёмная тема nx-dev-*).
   Все правила ограничены .nx-devchat / .nx-dev-voice — остальная страница не затрагивается.
   ========================================================================== */
.nx-devchat__root {
    --dc-accent: var(--nx-dev-accent, #8b93ff);
    --dc-accent-2: var(--nx-dev-accent-2, #c08bff);
    --dc-text: var(--nx-dev-text, #e9ebf3);
    --dc-muted: var(--nx-dev-muted, #9aa0b4);
    --dc-off: var(--nx-dev-off, #6b7186);
    --dc-line: var(--nx-dev-line, rgba(255, 255, 255, .08));
    --dc-warn: var(--nx-dev-warn, #f3b44f);
    --dc-ok: var(--nx-dev-ok, #43d39e);
    color: var(--dc-text);
}
.nx-dev-voice .nx-devchat--in-slot .nx-dev-h2 { font-size: clamp(24px, 2.3vw, 32px); line-height: 1.15; margin: 0 0 10px; }
.nx-dev-voice .nx-devchat--in-slot .nx-dev-h2 + .nx-dev-muted { margin: 0 0 4px; font-size: 15px; line-height: 1.55; }

/* шаги: поле на всю ширину, кнопки — ровный ряд одинаковой высоты */
.nx-devchat .nx-devchat__step { gap: 10px; align-items: stretch; margin: 18px 0 0; }
.nx-devchat .nx-devchat__step .nx-dev-field { flex: 1 1 100%; }
.nx-devchat .nx-devchat__step > .nx-dev-btn { flex: 1 1 auto; min-height: 46px; margin: 0; }
.nx-devchat .nx-devchat__step > small { flex-basis: 100%; margin-top: -4px; color: var(--dc-off); font-size: 12.5px; }
.nx-devchat .nx-devchat__step[data-step="code"] > .nx-dev-btn--primary { flex-basis: 100%; }
.nx-devchat .nx-devchat__step[data-step="code"] input[name="code"] { letter-spacing: .35em; font-variant-numeric: tabular-nums; font-size: 18px; text-align: center; }

/* кнопки: disabled / focus-visible */
.nx-devchat .nx-dev-btn[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; transform: none; filter: saturate(.6); }
.nx-devchat .nx-dev-btn:focus-visible,
.nx-devchat__tts:focus-visible { outline: 2px solid var(--dc-accent); outline-offset: 2px; }
.nx-devchat .nx-dev-btn:focus:not(:focus-visible) { outline: none; }

/* лента сообщений */
.nx-devchat .nx-devchat__log {
    height: clamp(280px, 46vh, 440px);
    padding: 14px 12px;
    gap: 10px;
    border-radius: 16px;
    background: rgba(0, 0, 0, .22);
    border: 1px solid var(--dc-line);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    scroll-behavior: smooth;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 147, 255, .35) transparent;
}
.nx-devchat .nx-devchat__log::-webkit-scrollbar { width: 6px; }
.nx-devchat .nx-devchat__log::-webkit-scrollbar-track { background: transparent; }
.nx-devchat .nx-devchat__log::-webkit-scrollbar-thumb { background: rgba(139, 147, 255, .3); border-radius: 6px; }
.nx-devchat .nx-devchat__log:empty::before { content: 'Здесь появится диалог с ассистентом'; margin: auto; color: var(--dc-off); font-size: 13px; }

.nx-devchat .nx-devchat__msg { max-width: 86%; padding: 10px 14px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; animation: nx-dc-in .22s ease-out both; }
.nx-devchat .nx-devchat__msg--user {
    background: linear-gradient(135deg, var(--dc-accent), var(--dc-accent-2));
    color: #fff; border: 0; border-bottom-right-radius: 6px;
    box-shadow: 0 6px 18px -8px rgba(139, 147, 255, .55);
}
.nx-devchat .nx-devchat__msg--assistant {
    background: rgba(255, 255, 255, .055); color: var(--dc-text);
    border: 1px solid var(--dc-line); border-bottom-left-radius: 6px;
}
.nx-devchat .nx-devchat__msg a { color: var(--dc-accent); text-decoration: underline; text-underline-offset: 2px; }
@keyframes nx-dc-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* кнопка «прослушать» */
.nx-devchat .nx-devchat__tts {
    display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    margin-top: 8px; padding: 3px 10px; min-height: 26px;
    border: 1px solid var(--dc-line); border-radius: 999px;
    background: rgba(255, 255, 255, .04); color: var(--dc-muted);
    font: inherit; font-size: 12.5px; line-height: 1.3; cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
}
.nx-devchat .nx-devchat__tts:hover { background: rgba(139, 147, 255, .14); border-color: rgba(139, 147, 255, .4); color: var(--dc-text); }
.nx-devchat .nx-devchat__tts[disabled] { opacity: .5; cursor: progress; }

/* индикатор «Ассистент думает…» — место зарезервировано, только opacity (без скачков) */
.nx-devchat .nx-devchat__thinking {
    display: flex; align-items: center; gap: 10px;
    height: 30px; margin: 8px 2px 0; padding: 0 2px;
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .4s ease, visibility 0s linear .4s;
}
.nx-devchat .nx-devchat__thinking.is-on { opacity: 1; visibility: visible; transition: opacity .2s ease, visibility 0s; }
.nx-devchat .nx-devchat__wave { display: inline-flex; align-items: center; gap: 3px; height: 18px; }
.nx-devchat .nx-devchat__wave i {
    display: block; width: 3px; height: 6px; border-radius: 3px;
    background: linear-gradient(180deg, var(--dc-accent-2), var(--dc-accent));
    box-shadow: 0 0 8px rgba(139, 147, 255, .55);
    animation: nx-dc-wave 1.2s ease-in-out infinite;
}
.nx-devchat .nx-devchat__wave i:nth-child(2) { animation-delay: .12s; }
.nx-devchat .nx-devchat__wave i:nth-child(3) { animation-delay: .24s; }
.nx-devchat .nx-devchat__wave i:nth-child(4) { animation-delay: .36s; }
.nx-devchat .nx-devchat__wave i:nth-child(5) { animation-delay: .48s; }
.nx-devchat .nx-devchat__thinking-text {
    font-size: 13px; font-weight: 500; letter-spacing: .01em;
    background: linear-gradient(90deg, var(--dc-muted) 0%, #fff 45%, var(--dc-accent-2) 55%, var(--dc-muted) 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent;
    animation: nx-dc-shimmer 2.2s linear infinite;
}
@keyframes nx-dc-wave { 0%, 100% { height: 5px; opacity: .55; } 50% { height: 17px; opacity: 1; } }
@keyframes nx-dc-shimmer { from { background-position: 120% 0; } to { background-position: -120% 0; } }

/* поле ввода + «Отправить» */
.nx-devchat .nx-devchat__compose { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; margin-top: 6px; align-items: stretch; }
.nx-devchat .nx-devchat__compose textarea {
    width: 100%; min-height: 52px; max-height: 160px; resize: none;
    padding: 13px 14px; border-radius: 14px;
    background: rgba(0, 0, 0, .25); color: var(--dc-text);
    border: 1px solid var(--dc-line); font: inherit; font-size: 14.5px; line-height: 1.45;
    transition: border-color .2s, box-shadow .2s;
}
.nx-devchat .nx-devchat__compose textarea::placeholder { color: var(--dc-off); }
.nx-devchat .nx-devchat__compose textarea:focus { outline: none; border-color: rgba(139, 147, 255, .55); box-shadow: 0 0 0 3px rgba(139, 147, 255, .18); }
.nx-devchat .nx-devchat__compose .nx-dev-btn { width: auto; min-height: 52px; padding-left: 22px; padding-right: 22px; margin: 0; }

/* вторичные действия */
.nx-devchat .nx-devchat__tools { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.nx-devchat .nx-devchat__tools .nx-dev-btn { width: 100%; min-height: 42px; font-size: 14px; margin: 0; }

/* ТЗ */
.nx-devchat .nx-devchat__spec {
    margin: 12px 0 0; max-height: 340px; padding: 14px 16px;
    background: rgba(0, 0, 0, .28); color: var(--dc-text);
    border: 1px solid var(--dc-line); border-left: 3px solid var(--dc-accent); border-radius: 12px;
    font: 13px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    scrollbar-width: thin; scrollbar-color: rgba(139, 147, 255, .35) transparent;
}

/* «вход недоступен» */
.nx-devchat .nx-devchat__step[data-step="closed"] p {
    padding: 14px 16px; border-radius: 14px;
    background: rgba(243, 180, 79, .07); border: 1px solid rgba(243, 180, 79, .22);
    color: var(--dc-text); font-size: 14.5px; line-height: 1.5;
}

/* статус / ошибки / 429 */
.nx-devchat .nx-devchat__status { min-height: 1.5em; margin: 12px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--dc-muted); }
.nx-devchat .nx-devchat__status:empty { margin-top: 6px; }
.nx-devchat .nx-devchat__status.is-error { color: var(--dc-warn); padding-left: 12px; border-left: 2px solid var(--dc-warn); }
.nx-devchat .nx-devchat__status.is-ok { color: var(--dc-ok); }
.nx-devchat .nx-dev-form__privacy { margin: 6px 0 0; font-size: 12px; line-height: 1.5; color: var(--dc-off); }

@media (max-width: 600px) {
    .nx-devchat .nx-devchat__log { height: clamp(260px, 52vh, 380px); }
    .nx-devchat .nx-devchat__msg { max-width: 92%; }
    .nx-devchat .nx-devchat__compose { grid-template-columns: 1fr; }
    .nx-devchat .nx-devchat__compose .nx-dev-btn { width: 100%; min-height: 48px; }
    .nx-devchat .nx-devchat__step > .nx-dev-btn { flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .nx-devchat .nx-devchat__msg { animation: none; }
    .nx-devchat .nx-devchat__wave { display: none; }
    .nx-devchat .nx-devchat__thinking-text { animation: none; background: none; color: var(--dc-muted); -webkit-background-clip: border-box; background-clip: border-box; }
    .nx-devchat .nx-devchat__thinking, .nx-devchat .nx-devchat__thinking.is-on { transition: none; }
    .nx-devchat .nx-devchat__log { scroll-behavior: auto; }
}
/* dc5: подписи вторичных кнопок не переносятся на узких экранах */
.nx-devchat .nx-devchat__tools .nx-dev-btn { white-space: nowrap; padding-left: 12px; padding-right: 12px; }
@media (max-width: 380px) { .nx-devchat .nx-devchat__tools .nx-dev-btn { font-size: 13px; } }

/* ==========================================================================
   dc6: панель действий под ответом ассистента (Phosphor regular; fill — только активные 👍/👎).
   Панель СНАРУЖИ пузыря, сразу под ним, по левому краю; высота зарезервирована — только opacity.
   ========================================================================== */
@font-face {
    font-family: "Phosphor-Fill";
    src: url("../../vendor/fonts/phosphor-icons/fill/Phosphor-Fill.woff2") format("woff2");
    font-weight: normal; font-style: normal; font-display: block;
}
.nx-devchat i.ph-fill { font-family: "Phosphor-Fill" !important; font-style: normal; font-weight: normal; line-height: 1; speak: never; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.nx-devchat i.ph-fill.ph-thumbs-up:before { content: "\e48e"; }
.nx-devchat i.ph-fill.ph-thumbs-down:before { content: "\e48c"; }

.nx-devchat .nx-devchat__turn { align-self: flex-start; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; max-width: 86%; position: relative; }
.nx-devchat .nx-devchat__turn > .nx-devchat__msg { max-width: 100%; }
.nx-devchat .nx-devchat__turn.is-stale > .nx-devchat__msg { opacity: .45; transition: opacity .2s; }
.nx-devchat .nx-devchat__turn.is-target > .nx-devchat__msg { box-shadow: 0 0 0 2px rgba(139, 147, 255, .55); transition: box-shadow .3s; }

.nx-devchat .nx-devchat__actions {
    position: relative; display: flex; align-items: center; gap: 2px;
    height: 28px; margin: 0; padding: 0; background: transparent;
    opacity: 0; transition: opacity .22s ease;
}
.nx-devchat .nx-devchat__turn:hover .nx-devchat__actions,
.nx-devchat .nx-devchat__turn:focus-within .nx-devchat__actions,
.nx-devchat .nx-devchat__turn.is-target .nx-devchat__actions { opacity: 1; }
.nx-devchat .nx-devchat__log > .nx-devchat__turn:not(:last-child) [data-action="m-regen"] { display: none; }

.nx-devchat .nx-devchat__act {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; padding: 0; margin: 0;
    border: 0; border-radius: 8px; background: transparent;
    color: var(--dc-off); font-size: 16px; line-height: 1; cursor: pointer;
    transition: color .15s, opacity .15s; box-shadow: none; outline: none; -webkit-tap-highlight-color: transparent;
}
.nx-devchat .nx-devchat__act i { font-size: 16px; line-height: 1; display: block; }
.nx-devchat .nx-devchat__act:hover { color: var(--dc-text); background: transparent; }
.nx-devchat .nx-devchat__act:active { background: transparent; opacity: .75; }
.nx-devchat .nx-devchat__act:focus-visible { outline: 2px solid var(--dc-accent); outline-offset: 1px; color: var(--dc-text); }
.nx-devchat .nx-devchat__act.is-active { color: var(--dc-accent); }
.nx-devchat .nx-devchat__act.is-done { color: var(--dc-ok); }
.nx-devchat .nx-devchat__act[disabled] { opacity: .45; cursor: default; background: transparent; }
.nx-devchat .nx-devchat__act.is-busy i { animation: nx-dc-spin .9s linear infinite; }
@keyframes nx-dc-spin { to { transform: rotate(360deg); } }

.nx-devchat .nx-devchat__menu {
    position: absolute; top: calc(100% + 4px); z-index: 5; width: max-content; min-width: 200px; padding: 6px; white-space: nowrap;
    background: #161925; border: 1px solid rgba(255, 255, 255, .1); border-radius: 12px;
    box-shadow: 0 14px 34px -12px rgba(0, 0, 0, .7);
    animation: nx-dc-in .14s ease-out both;
}
.nx-devchat .nx-devchat__menu.is-up { top: auto; bottom: calc(100% + 4px); }
.nx-devchat .nx-devchat__menu-item {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 8px 10px; border: 0; border-radius: 8px; background: transparent;
    color: var(--dc-text); font: inherit; font-size: 13.5px; line-height: 1.3; text-align: left; cursor: pointer;
}
.nx-devchat .nx-devchat__menu-item i { font-size: 16px; color: var(--dc-muted); }
.nx-devchat .nx-devchat__menu-item:hover, .nx-devchat .nx-devchat__menu-item:focus-visible { background: rgba(255, 255, 255, .07); outline: none; }

.nx-devchat .nx-devchat__step[data-step="chat"] { position: relative; }
.nx-devchat .nx-devchat__toast {
    position: absolute; left: 50%; top: 14px; z-index: 6; transform: translate(-50%, -4px);
    padding: 7px 14px; border-radius: 999px; pointer-events: none;
    background: rgba(22, 25, 37, .96); border: 1px solid rgba(139, 147, 255, .3); color: var(--dc-text);
    font-size: 13px; box-shadow: 0 10px 26px -10px rgba(0, 0, 0, .7);
    opacity: 0; transition: opacity .2s, transform .2s;
}
.nx-devchat .nx-devchat__toast.is-on { opacity: 1; transform: translate(-50%, 0); }

@media (hover: none) {
    .nx-devchat .nx-devchat__actions { opacity: .6; }
    .nx-devchat .nx-devchat__turn:focus-within .nx-devchat__actions { opacity: 1; }
    .nx-devchat .nx-devchat__act { width: 32px; height: 32px; }
    .nx-devchat .nx-devchat__actions { height: 32px; }
}
@media (max-width: 600px) { .nx-devchat .nx-devchat__turn { max-width: 92%; } }
@media (prefers-reduced-motion: reduce) {
    .nx-devchat .nx-devchat__actions, .nx-devchat .nx-devchat__toast { transition: none; }
    .nx-devchat .nx-devchat__menu { animation: none; }
    .nx-devchat .nx-devchat__act.is-busy i { animation: none; }
}

/* dc6: только иконки — без фона/рамки/«пилюли» ни в каком состоянии (в т.ч. озвучка) */
.nx-devchat .nx-devchat__actions .nx-devchat__act,
.nx-devchat .nx-devchat__actions .nx-devchat__act:hover,
.nx-devchat .nx-devchat__actions .nx-devchat__act:focus,
.nx-devchat .nx-devchat__actions .nx-devchat__act:active,
.nx-devchat .nx-devchat__actions .nx-devchat__act[disabled] { background: none !important; border: 0 !important; box-shadow: none !important; }
.nx-devchat .nx-devchat__actions .nx-devchat__act:focus-visible { outline: 1px dotted var(--dc-accent); outline-offset: 2px; }

/* ==========================================================================
   dc7: экран «Вы вышли» + «Вернуться в чат» (токен возврата в HttpOnly cookie).
   ========================================================================== */
.nx-devchat .nx-devchat__out { gap: 10px; }
.nx-devchat .nx-devchat__out-card {
    flex-basis: 100%; display: flex; gap: 14px; align-items: flex-start;
    padding: 16px 18px; border-radius: 16px;
    background: linear-gradient(135deg, rgba(139, 147, 255, .10), rgba(192, 139, 255, .06));
    border: 1px solid rgba(139, 147, 255, .24);
}
.nx-devchat .nx-devchat__out-ico {
    flex: 0 0 40px; width: 40px; height: 40px; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--dc-accent), var(--dc-accent-2)); color: #fff; font-size: 21px;
    box-shadow: 0 6px 18px rgba(139, 147, 255, .28);
}
.nx-devchat .nx-devchat__out-body strong { display: block; font-size: 16px; line-height: 1.3; color: var(--dc-text); margin: 1px 0 4px; }
.nx-devchat .nx-devchat__out-body p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--dc-muted); }
.nx-devchat .nx-devchat__out > .nx-dev-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.nx-devchat .nx-devchat__out > .nx-dev-btn i { font-size: 18px; line-height: 1; }
.nx-devchat .nx-devchat__out > .nx-dev-btn--primary { flex-basis: 100%; }
.nx-devchat .nx-devchat__out-forget {
    flex-basis: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    margin: 2px 0 0; padding: 6px 8px; border: 0; background: none; cursor: pointer;
    color: var(--dc-off); font: inherit; font-size: 12.5px; line-height: 1.4;
}
.nx-devchat .nx-devchat__out-forget:hover { color: var(--dc-text); }
.nx-devchat .nx-devchat__out-forget:focus-visible { outline: 2px solid var(--dc-accent); outline-offset: 2px; border-radius: 8px; }
.nx-devchat .nx-devchat__out-forget[disabled] { opacity: .45; cursor: not-allowed; }