.eg-button,
.eg-link,
.eg-card { -webkit-tap-highlight-color: transparent; }

.eg-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--eg-space-2);
    min-height: 44px;
    padding: 0.75rem 1.25rem;
    border: 1px solid transparent;
    border-radius: var(--eg-radius-md);
    font-family: var(--eg-font-family-base);
    font-size: 0.875rem;
    font-weight: var(--eg-weight-bold);
    line-height: 1.2;
    text-decoration: none;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background-color var(--eg-motion-base) var(--eg-motion-ease), color var(--eg-motion-base) var(--eg-motion-ease), border-color var(--eg-motion-base) var(--eg-motion-ease), box-shadow var(--eg-motion-base) var(--eg-motion-ease), transform var(--eg-motion-fast) var(--eg-motion-ease);
}
.eg-button--primary { background: var(--eg-color-primary); color: var(--eg-color-accent); }
.eg-button--secondary { background: #fff; border-color: var(--eg-color-primary); color: var(--eg-color-primary); }
.eg-button--outline { background: #fff; border-color: var(--eg-color-primary); color: var(--eg-color-primary); }
.eg-button--outline:hover:not(:disabled) { border-color: var(--eg-color-accent); color: var(--eg-color-secondary); }
.eg-button:hover:not(:disabled),
.eg-button--state-hover:not(:disabled) { box-shadow: var(--eg-shadow-sm); transform: translateY(-1px); }
.eg-button:focus-visible { outline: 3px solid var(--eg-color-focus); outline-offset: 3px; }
.eg-button:active:not(:disabled),
.eg-button--state-active:not(:disabled) { transform: translateY(0); }
.eg-button:disabled,
.eg-button--state-disabled,
.eg-button--state-loading { opacity: var(--eg-opacity-disabled); cursor: not-allowed; pointer-events: none; }
.eg-button--state-success { background: var(--eg-color-success); }
.eg-button--state-warning { background: var(--eg-color-warning); }
.eg-button--state-error { background: var(--eg-color-danger); }

.eg-link { color: var(--eg-color-primary); font-weight: var(--eg-weight-semibold); text-decoration: underline; text-decoration-color: rgba(201,162,77,0.75); text-underline-offset: 3px; }
.eg-link:hover { color: var(--eg-color-secondary); }
.eg-link:focus-visible { outline: 3px solid var(--eg-color-focus); outline-offset: 3px; border-radius: var(--eg-radius-sm); }

.eg-card {
    display: block;
    color: inherit;
    background: var(--eg-color-surface);
    border: 1px solid var(--eg-color-border);
    border-radius: var(--eg-radius-lg);
    box-shadow: var(--eg-shadow-sm);
    text-decoration: none;
    transition: border-color var(--eg-motion-base) var(--eg-motion-ease), box-shadow var(--eg-motion-base) var(--eg-motion-ease), transform var(--eg-motion-base) var(--eg-motion-ease);
}
.eg-card__body { padding: var(--eg-space-6); }
.eg-card__title { margin: 0 0 var(--eg-space-2); font-family: var(--eg-font-family-heading); font-size: var(--eg-font-size-xl); font-weight: 600; line-height: var(--eg-line-tight); color: var(--eg-color-secondary); }
.eg-card__text { margin: 0; color: var(--eg-color-text-muted); }
.eg-card--featured { border-color: var(--eg-color-accent); box-shadow: var(--eg-shadow-md); }
.eg-card--compact .eg-card__body { padding: var(--eg-space-4); }
.eg-card:hover, .eg-card--state-hover { border-color: var(--eg-color-accent); box-shadow: var(--eg-shadow-md); transform: translateY(-2px); }
.eg-card:focus-visible, .eg-card--state-focused { outline: 3px solid var(--eg-color-focus); outline-offset: 3px; }
.eg-card:active, .eg-card--state-active { transform: translateY(0); }
.eg-card--state-loading { opacity: 0.72; }
.eg-card--state-success { border-color: var(--eg-color-success); }
.eg-card--state-warning { border-color: var(--eg-color-warning); }
.eg-card--state-error { border-color: var(--eg-color-danger); }
.eg-card--state-disabled { opacity: var(--eg-opacity-disabled); pointer-events: none; }

.eg-breadcrumbs { margin-block: var(--eg-space-4); }
.eg-breadcrumbs__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--eg-space-2); margin: 0; padding: 0; list-style: none; color: var(--eg-color-text-muted); font-size: var(--eg-font-size-sm); }
.eg-breadcrumbs__item { display: inline-flex; align-items: center; }
.eg-breadcrumbs__item + .eg-breadcrumbs__item::before { content: "/"; margin-right: var(--eg-space-2); color: var(--eg-color-neutral-500); }
.eg-breadcrumbs__link { color: var(--eg-color-primary); text-decoration: none; }
.eg-breadcrumbs__link:hover { color: var(--eg-color-secondary); text-decoration: underline; text-decoration-color: var(--eg-color-accent); }
.eg-breadcrumbs__current { color: var(--eg-color-text); font-weight: var(--eg-weight-medium); }

.eg-feedback { display: flex; gap: var(--eg-space-3); align-items: flex-start; padding: var(--eg-space-4); border: 1px solid var(--eg-color-border); border-radius: var(--eg-radius-md); background: var(--eg-color-surface-muted); color: var(--eg-color-text); }
.eg-feedback__label { flex: 0 0 auto; }
.eg-feedback--information { border-color: var(--eg-color-information); }
.eg-feedback--success { border-color: var(--eg-color-success); }
.eg-feedback--warning { border-color: var(--eg-color-warning); }
.eg-feedback--error { border-color: var(--eg-color-danger); }
.eg-feedback--state-loading { opacity: 0.72; }
.eg-feedback--state-success, .eg-feedback--state-warning, .eg-feedback--state-error { border-width: 2px; }

.eg-badge { display: inline-flex; align-items: center; min-height: 28px; padding: var(--eg-space-1) var(--eg-space-3); border-radius: var(--eg-radius-pill); font-size: var(--eg-font-size-xs); font-weight: var(--eg-weight-semibold); line-height: 1; }
.eg-badge--neutral { background: var(--eg-color-neutral-200); color: var(--eg-color-neutral-700); }
.eg-badge--success { background: color-mix(in srgb, var(--eg-color-success) 12%, white); color: var(--eg-color-success); }
.eg-badge--warning { background: color-mix(in srgb, var(--eg-color-warning) 12%, white); color: var(--eg-color-warning); }
.eg-badge--error { background: color-mix(in srgb, var(--eg-color-danger) 12%, white); color: var(--eg-color-danger); }
.eg-badge--information { background: color-mix(in srgb, var(--eg-color-information) 12%, white); color: var(--eg-color-information); }

.eg-progress { display: grid; gap: var(--eg-space-2); }
.eg-progress__track { height: 8px; overflow: hidden; border-radius: var(--eg-radius-pill); background: var(--eg-color-neutral-200); }
.eg-progress__value { height: 100%; border-radius: inherit; background: var(--eg-color-primary); }
.eg-progress__label { color: var(--eg-color-text-muted); font-size: var(--eg-font-size-sm); }

@media (prefers-reduced-motion: reduce) { .eg-button, .eg-card { transition: none; } }