.custom-html-assist {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: var(--space-5);
    color: var(--studio-text-primary);
    font-family: var(--studio-font-sans);
}

.custom-html-assist header {
    margin-bottom: var(--space-4);
}

.custom-html-assist h2 {
    margin: 0;
    font-size: var(--studio-type-dialog-title-size);
    line-height: var(--studio-type-dialog-title-line-height);
}

.custom-html-assist header p {
    margin: var(--space-1) 0 0;
    color: var(--studio-text-muted);
    font-size: var(--studio-type-body-compact-size);
}

.custom-html-assist__steps {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: var(--space-4) 0 0;
    padding: 0;
    color: var(--studio-text-muted);
    font-size: var(--studio-type-meta-size);
    list-style: none;
}

.custom-html-assist__steps li { display: flex; gap: var(--space-1); align-items: center; }
.custom-html-assist__steps li.is-current { color: var(--studio-text-accent); }
.custom-html-assist__steps span { font-variant-numeric: tabular-nums; }

.custom-html-assist [data-assist-content] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--space-3);
    min-height: 0;
    overflow: auto;
}

.custom-html-assist label {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    color: var(--studio-text-secondary);
    font-size: var(--studio-type-field-label-size);
    letter-spacing: var(--studio-type-field-label-letter-spacing);
    text-transform: uppercase;
}

.custom-html-assist textarea,
.custom-html-assist select {
    width: 100%;
    padding: var(--space-3);
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-small);
    background: var(--color-bg-input);
    color: var(--studio-text-primary);
    font: inherit;
    font-size: var(--studio-type-body-compact-size);
    resize: vertical;
}

.custom-html-assist button,
.custom-html-editor__actions button {
    min-height: 36px;
    padding: 0 var(--space-3);
    border: 1px solid var(--color-accent-border);
    border-radius: var(--radius-small);
    background: var(--color-accent-soft);
    color: var(--studio-text-accent);
    font: inherit;
    font-size: var(--studio-type-ui-label-size);
    font-weight: var(--studio-font-weight-medium);
    cursor: pointer;
}

.custom-html-assist button:hover:not(:disabled),
.custom-html-editor__actions button:hover:not(:disabled) {
    background: var(--color-accent);
    color: #06090c;
}

.custom-html-assist button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.custom-html-assist-secondary { background: transparent !important; }
.custom-html-assist-providers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.custom-html-assist-providers a { display: flex; align-items: center; justify-content: center; min-height: 36px; padding: 0 var(--space-3); border: 1px solid var(--color-accent-border); border-radius: var(--radius-small); background: var(--color-accent-soft); color: var(--studio-text-accent); font-size: var(--studio-type-ui-label-size); font-weight: var(--studio-font-weight-medium); text-align: center; text-decoration: none; }
.custom-html-assist-providers a:hover { background: var(--color-accent); color: #06090c; }
.custom-html-assist-provider-label { margin: var(--space-2) 0 0; color: var(--studio-text-secondary); font-size: var(--studio-type-field-label-size); letter-spacing: var(--studio-type-field-label-letter-spacing); text-transform: uppercase; }
.custom-html-editor__hint { margin: 0; color: var(--studio-text-muted); font-size: var(--studio-type-meta-size); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 640px) { .custom-html-assist-providers { grid-template-columns: 1fr; } }

.custom-html-assist footer,
.custom-html-assist-actions,
.custom-html-editor__actions {
    display: flex;
    gap: var(--space-2);
    margin-top: var(--space-4);
}

.custom-html-assist-preview,
.custom-html-editor__preview iframe {
    width: 100%;
    margin-top: var(--space-3);
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-small);
    background: #fff;
}

.custom-html-assist__workspace-title { margin: 0; font-size: var(--studio-type-body-size); }
.custom-html-assist-hint { margin: 0; color: var(--studio-text-muted); font-size: var(--studio-type-meta-size); }
.custom-html-assist-success { padding: var(--space-4); border: 1px solid var(--color-accent-border); border-radius: var(--radius-small); background: var(--color-accent-soft); }
.custom-html-assist-success h3,
.custom-html-assist-success p { margin-top: 0; }

.custom-html-assist-error,
.custom-html-editor__validation {
    margin: 0;
    color: var(--studio-text-danger);
    font-size: var(--studio-type-meta-size);
    line-height: var(--studio-type-meta-line-height);
}