.dai-value-text {
    background: var(--dai-soft);
    font-size: 12px;
    line-height: 1.6;
    margin: 0;
    padding: 10px;
    white-space: pre-wrap;
}

.dai-value-list {
    display: grid;
    gap: 7px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.dai-value-list > li {
    background: var(--dai-soft);
    border-left: 3px solid #b8d9d5;
    padding: 9px 10px;
}

.dai-value-list .dai-value-list {
    margin-top: 7px;
}

.dai-value-grid {
    display: grid;
    gap: 7px;
    margin: 0;
}

.dai-value-grid > div {
    background: var(--dai-soft);
    display: grid;
    gap: 4px;
    grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr);
    padding: 9px 10px;
}

.dai-value-grid dt {
    color: var(--dai-muted);
    font-size: 11px;
    font-weight: 700;
}

.dai-value-grid dd {
    margin: 0;
    min-width: 0;
}

.dai-value-grid .dai-value-text,
.dai-value-grid .dai-value-list > li,
.dai-value-grid .dai-value-grid > div {
    background: #fff;
    padding: 7px;
}

.dai-empty-value {
    color: var(--dai-muted);
    font-size: 12px;
}

.dai-source-editor {
    border: 1px solid var(--dai-line);
    padding: 14px;
}

.dai-source-editor__head {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.dai-source-editor__head > div {
    display: grid;
    gap: 4px;
}

.dai-source-editor__head strong,
.dai-source-row legend {
    font-size: 12px;
    font-weight: 700;
}

.dai-source-editor__head small {
    color: var(--dai-muted);
    font-size: 11px;
}

.dai-button--compact {
    flex: 0 0 auto;
    font-size: 12px;
    padding: 6px 9px;
}

.dai-source-list {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.dai-source-row {
    background: var(--dai-soft);
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 12px;
    position: relative;
}

.dai-source-row__grid {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(160px, .8fr) minmax(220px, 1.2fr) minmax(140px, .55fr);
    margin-top: 10px;
}

.dai-source-row__grid label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.dai-source-row__grid label > span {
    color: var(--dai-muted);
    font-size: 11px;
    font-weight: 650;
}

.dai-source-row__grid input {
    background: #fff;
    border: 1px solid #aebac6;
    border-radius: 2px;
    box-sizing: border-box;
    font: inherit;
    min-width: 0;
    padding: 9px;
    width: 100%;
}

.dai-source-row__grid input:focus {
    outline: 3px solid rgba(23, 107, 104, .22);
    outline-offset: 2px;
}

.dai-source-remove {
    background: transparent;
    border: 0;
    color: #a53030;
    cursor: pointer;
    font: inherit;
    font-size: 11px;
    padding: 4px;
    position: absolute;
    right: 8px;
    top: 7px;
}

.dai-field textarea {
    font-family: inherit;
    font-size: inherit;
}

.dai-source-remove:disabled {
    cursor: default;
    opacity: .35;
}

.dai-dialog {
    --dai-ink: #17212b;
    --dai-muted: #617184;
    --dai-line: #d8e0e8;
    --dai-soft: #f4f7fa;
    --dai-accent: #176b68;
    border-radius: 14px;
    box-sizing: border-box;
}

.dai-dialog--generate {
    max-width: 920px;
}

.dai-dialog--generate > header {
    padding: 22px 26px 18px;
}

.dai-dialog--generate > header h2 {
    font-size: 23px;
    letter-spacing: -.02em;
}

.dai-dialog--generate .dai-form-grid {
    background: #f5f7fa;
    gap: 14px;
    padding: 18px 22px 22px;
}

.dai-form-section,
.dai-source-editor,
.dai-advanced {
    background: #fff;
    border: 1px solid #dce3ea;
    border-radius: 12px;
    box-sizing: border-box;
}

.dai-form-section {
    padding: 16px;
}

.dai-form-section__head {
    align-items: flex-start;
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

.dai-form-section__head > span {
    align-items: center;
    background: #e5f1ef;
    border-radius: 50%;
    color: #176b68;
    display: inline-flex;
    flex: 0 0 26px;
    font-size: 12px;
    font-weight: 800;
    height: 26px;
    justify-content: center;
}

.dai-form-section__head > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.dai-form-section__head strong {
    color: #21303c;
    font-size: 14px;
}

.dai-form-section__head small {
    color: #6b7888;
    font-size: 11px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.dai-form-section__grid {
    display: grid;
    gap: 13px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dai-dialog--generate .dai-field input,
.dai-dialog--generate .dai-field select,
.dai-dialog--generate .dai-field textarea,
.dai-feedback .dai-field textarea,
.dai-source-row__grid input {
    border-color: #9eacba;
    border-radius: 8px;
    color: #1f2c37;
    min-height: 44px;
}

.dai-dialog--generate .dai-field textarea,
.dai-feedback .dai-field textarea {
    font-family: inherit;
    line-height: 1.55;
    resize: vertical;
}

.dai-dialog--generate .dai-field input::placeholder,
.dai-dialog--generate .dai-field textarea::placeholder,
.dai-feedback .dai-field textarea::placeholder {
    color: #84909d;
}

.dai-dialog--generate .dai-field small {
    line-height: 1.5;
}

.dai-target-field small {
    min-height: 16px;
}

.dai-source-editor {
    padding: 16px;
}

.dai-source-empty {
    align-items: flex-start;
    background: #f6f8fa;
    border: 1px dashed #c9d2dc;
    border-radius: 9px;
    color: #687687;
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 12px;
    padding: 13px 14px;
}

.dai-source-empty[hidden] {
    display: none;
}

.dai-source-empty strong {
    color: #344351;
    font-size: 12px;
}

.dai-source-empty span {
    font-size: 11px;
    line-height: 1.55;
}

.dai-source-row {
    border: 1px solid #e0e6ec;
    border-radius: 9px;
}

.dai-advanced {
    overflow: hidden;
}

.dai-advanced > summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    list-style-position: inside;
    min-height: 48px;
    padding: 0 16px;
}

.dai-advanced > summary span {
    color: #344351;
    font-size: 12px;
    font-weight: 750;
}

.dai-advanced > summary small {
    color: #758292;
    font-size: 11px;
    font-weight: 400;
}

.dai-advanced[open] > summary {
    border-bottom: 1px solid #e1e6eb;
}

.dai-advanced__body {
    display: grid;
    gap: 13px;
    grid-template-columns: 1.25fr .75fr .75fr;
    padding: 15px 16px 17px;
}

.dai-date-choice {
    border: 0;
    display: grid;
    gap: 8px;
    margin: 0;
    min-width: 0;
    padding: 0;
}

.dai-date-choice legend {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
}

.dai-date-choice label {
    align-items: flex-start;
    border: 1px solid #d8e0e8;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    gap: 8px;
    padding: 9px 10px;
}

.dai-date-choice label:has(input:checked) {
    background: #edf7f5;
    border-color: #83bbb5;
}

.dai-date-choice input {
    accent-color: #176b68;
    margin-top: 2px;
}

.dai-date-choice label > span {
    display: grid;
    gap: 2px;
}

.dai-date-choice strong {
    color: #2e3d49;
    font-size: 11px;
}

.dai-date-choice small {
    color: #6d7a89;
    font-size: 10px;
    line-height: 1.45;
}

.dai-dialog--generate > form > footer {
    background: #fff;
    position: sticky;
    bottom: 0;
    z-index: 2;
}

.dai-dialog .dai-button,
.dai-dialog .dai-link {
    border-radius: 8px;
    min-height: 40px;
}

.dai-dialog--generate .dai-form-error {
    border: 1px solid #efc1bd;
    border-radius: 8px;
}

.dai-feedback {
    border-top: 1px solid #dfe5eb;
    margin-top: 16px;
    padding-top: 12px;
}

.dai-feedback > summary {
    color: #7d3734;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.dai-feedback form {
    display: grid;
    gap: 10px;
    padding-top: 12px;
}

.dai-feedback .dai-form-error {
    margin: 0;
}

@media (max-width: 680px) {
    .dai-value-grid > div {
        grid-template-columns: 1fr;
    }

    .dai-source-editor__head {
        align-items: stretch;
        flex-direction: column;
    }

    .dai-source-row__grid {
        grid-template-columns: 1fr;
    }

    .dai-dialog {
        border-radius: 0;
        max-width: 100vw;
        overflow-x: hidden;
    }

    .dai-dialog--generate > header {
        padding: 18px 18px 14px;
    }

    .dai-dialog--generate .dai-form-grid {
        padding: 12px;
    }

    .dai-form-section__grid,
    .dai-advanced__body {
        grid-template-columns: 1fr;
    }

    .dai-advanced > summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
        justify-content: center;
    }

    .dai-dialog .dai-button,
    .dai-dialog .dai-link {
        min-height: 44px;
    }
}
