.ui-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
    box-shadow: var(--shadow-card);
}

.ui-button,
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 16px;
    border: 0;
    border-radius: var(--radius-control);
    background: var(--color-primary);
    color: var(--color-text-light);
    font-family: var(--font-base);
    font-size: var(--font-size-body);
    line-height: 1.2;
    font-weight: var(--font-weight-semibold);
    text-decoration: none;
    cursor: pointer;
}

.ui-control,
input,
select,
textarea {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    font-family: var(--font-base);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
}


.notice,
.ui-notice {
    padding: 16px;
    border-radius: var(--radius-control);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

.error {
    color: var(--color-danger);
}

.warning {
    color: var(--color-warning);
}

.button--accent {
    background: var(--color-accent);
    color: var(--color-text-light);
}

.button--accent:hover {
    background: var(--color-accent-hover);
}

.ui-button:hover,
.button:hover {
    background: var(--color-primary-hover);
}

a {
    color: var(--color-accent);
}

a:hover {
    color: var(--color-accent-hover);
}

.ok {
    color: var(--color-success);
}

/* ResponsiveFoundation v1: shared control safety */
.ui-button,
.button,
.ui-control,
input,
select,
textarea,
button {
    max-width: 100%;
}

input,
select,
textarea {
    min-width: 0;
}