.constants-list {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 100%;
}

/* Одна константа — компактная строка */
.constant-item {
    display: grid;

    /* имя — фиксировано в символах,
       значение — занимает всё свободное место,
       кнопки — справа */
    grid-template-columns: 14ch minmax(0, 1fr) auto 28px;

    align-items: center;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
}

/* Поля */
.constant-item input {
    min-width: 0;
    width: 100%;
    height: 30px;
    padding: 4px 7px;
    box-sizing: border-box;

    border: 1px solid #cbd5e1;
    border-radius: 4px;
    background: #fff;
    color: #1f2937;
    font-size: 13px;
    outline: none;
}

.constant-item input:focus {
    border-color: #64748b;
    box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.08);
}

/* Имя */
.constant-item input:first-child {
    font-family: Roboto monospace;
    color: #17365d;
    font-weight: 600;
    background: #f8fafc;
}

/* Сохранить — справа */
.constant-item button:first-of-type {
    height: 30px;
    padding: 0 7px;

    border: 1px solid #72c06d;
    border-radius: 4px;
    background: #72c06d;
    color: #fff;

    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;

    transition: background-color 0.15s ease;
}

.constant-item button:first-of-type:hover {
    background: #274b73;
}

/* Удалить — маленькая кнопка справа */
.constant-item button:last-of-type {
    width: 28px;
    height: 28px;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #fff;
    color: #64748b;

    font-size: 17px;
    line-height: 1;
    cursor: pointer;

    transition:
        background-color 0.15s ease,
        color 0.15s ease,
        border-color 0.15s ease;
}

.constant-item button:last-of-type:hover {
    border-color: #dc2626;
    background: #fef2f2;
    color: #dc2626;
}
/* Форма добавления */
.constant-add-form {
    display: grid;
    grid-template-columns: 14ch minmax(0, 1fr) auto;
    align-items: end;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
}

/* Группа: подпись + поле */
.constant-field {
    min-width: 0;

    display: flex;
    flex-direction: column;
    gap: 3px;
}

/* Подписи */
.constant-field label {
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    color: #17365d;
}

/* Поля */
.constant-field input {
    width: 100%;
    min-width: 0;
    height: 30px;
    padding: 4px 7px;
    box-sizing: border-box;

    border: 1px solid #cbd5e1;
    border-radius: 4px;

    background: #fff;
    color: #1f2937;
    font-size: 13px;

    outline: none;
}

.constant-field input:focus {
    border-color: #64748b;
    box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.08);
}

.constant-field input::placeholder {
    color: #9ca3af;
}

/* Кнопка */
#addConstantBtn {
    height: 30px;
    padding: 0 10px;

    border: 1px solid #72c06d;
    border-radius: 4px;

    background: #72c06d;
    color: #fff;

    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;

    cursor: pointer;

    transition:
        background-color 0.15s ease,
        border-color 0.15s ease;
}

#addConstantBtn:hover {
    background: #274b73;
    border-color: #274b73;
}

#addConstantBtn:active {
    background: #142b47;
}

/* Подсветка констант, выбранных в калькуляторе */

.constant-item input.logic-constant-operand {
    background: rgba(80, 180, 255, 0.45);
    border-color: #2196f3;
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.35);
}

.constant-item input.logic-constant-result {
    background: rgba(80, 180, 255, 0.45);
    border-color: #2196f3;
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.35);
}

/* Заголовки групп в списке констант и строки личных констант */

.constants-group-title {
    margin: 4px 0 1px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.constants-group-user {
    color: #1d6b2a;
}

.constant-item-user {
    grid-template-columns: 14ch minmax(0, 1fr);
}

.constant-item-user input {
    background: #f1f9f1;
    border-color: #b7dbb4;
    cursor: pointer;
}

.constant-item-user input:focus {
    border-color: #72c06d;
    box-shadow: none;
}

/* Константы «места» (выбранное в дереве присоединение и его подстанция/область/группа) */
.constant-item-place input {
    background: #eef5fd;
    border-color: #b6cfee;
}

.constant-item-place input:focus {
    border-color: #6aa0e0;
}