body {
    margin: 0;
    font-family: var(--dm-font-family-base);
    font-size: var(--dm-font-size-body);
    line-height: var(--dm-line-height-body);
    font-weight: var(--dm-font-weight-body);
    color: var(--dm-text-primary);
    background-color: var(--dm-surface-page);
}

a {
    color: var(--dm-text-link);
}

.dm-text-secondary { color: var(--dm-text-secondary); }
.dm-text-muted { color: var(--dm-text-muted); }
.dm-surface-page { background-color: var(--dm-surface-page); }

.dm-h1 { font-size: var(--dm-font-size-h1); line-height: var(--dm-line-height-h1); font-weight: var(--dm-font-weight-h1); }
.dm-h2 { font-size: var(--dm-font-size-h2); line-height: var(--dm-line-height-h2); font-weight: var(--dm-font-weight-h2); }
.dm-h3 { font-size: var(--dm-font-size-h3); line-height: var(--dm-line-height-h3); font-weight: var(--dm-font-weight-h3); }
.dm-caption { font-size: var(--dm-font-size-caption); line-height: var(--dm-line-height-caption); }
.dm-label { font-size: var(--dm-font-size-label); line-height: var(--dm-line-height-label); font-weight: var(--dm-font-weight-label); }

.dm-card {
    background: var(--dm-surface-card);
    border: var(--dm-card-border);
    border-radius: var(--dm-card-radius);
    padding: var(--dm-card-padding);
}

.dm-card-elevated { box-shadow: var(--dm-shadow-md); }

.dm-btn {
    --bs-btn-border-radius: var(--dm-button-radius);
    --bs-btn-font-weight: 600;
    min-height: var(--dm-button-height-md);
    padding: 0 var(--dm-space-sm);
}

.dm-btn-sm { min-height: var(--dm-button-height-sm); }
.dm-btn-lg { min-height: var(--dm-button-height-lg); }

.btn.dm-btn-primary {
    --bs-btn-color: var(--dm-text-inverse);
    --bs-btn-bg: var(--dm-color-primary-600);
    --bs-btn-border-color: var(--dm-color-primary-600);
    --bs-btn-hover-bg: var(--dm-color-primary-500);
    --bs-btn-hover-border-color: var(--dm-color-primary-500);
}

.btn.dm-btn-secondary {
    --bs-btn-color: var(--dm-color-primary-600);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--dm-color-primary-600);
    --bs-btn-hover-color: var(--dm-text-inverse);
    --bs-btn-hover-bg: var(--dm-color-primary-600);
    --bs-btn-hover-border-color: var(--dm-color-primary-600);
}

.btn.dm-btn-ghost {
    --bs-btn-color: var(--dm-color-primary-600);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: rgba(79, 70, 229, 0.08);
}

.form-control.dm-input,
.form-select.dm-input {
    min-height: var(--dm-input-height-md);
    border-radius: var(--dm-input-radius);
    border-color: var(--dm-surface-input-border);
    color: var(--dm-text-primary);
}

.form-control.dm-input-sm,
.form-select.dm-input-sm { min-height: var(--dm-input-height-sm); }
.form-control.dm-input-lg,
.form-select.dm-input-lg { min-height: var(--dm-input-height-lg); }

.form-control.dm-input:focus,
.form-select.dm-input:focus {
    border-color: var(--dm-color-primary-500);
    box-shadow: 0 0 0 .2rem rgba(99, 102, 241, .18);
}

.dm-badge {
    display: inline-flex;
    align-items: center;
    border-radius: var(--dm-radius-pill);
    padding: 2px 10px;
    font-size: var(--dm-font-size-caption);
    font-weight: 600;
}

.dm-badge-neutral { background: var(--dm-color-neutral-200); color: var(--dm-text-secondary); }
.dm-badge-success { background: rgba(34, 197, 94, .12); color: #15803d; }
.dm-badge-warning { background: rgba(245, 158, 11, .14); color: #b45309; }
.dm-badge-danger { background: rgba(239, 68, 68, .12); color: #b91c1c; }

.dm-alert {
    border-radius: var(--dm-radius-sm);
    border-width: 1px;
    border-style: solid;
    padding: var(--dm-space-sm);
}

.dm-alert-info { background: rgba(79, 70, 229, .08); border-color: rgba(79, 70, 229, .2); color: #3730a3; }
.dm-alert-success { background: rgba(34, 197, 94, .10); border-color: rgba(34, 197, 94, .2); color: #166534; }
.dm-alert-warning { background: rgba(245, 158, 11, .12); border-color: rgba(245, 158, 11, .3); color: #92400e; }
.dm-alert-error { background: rgba(239, 68, 68, .10); border-color: rgba(239, 68, 68, .2); color: #991b1b; }

.dm-navbar,
.dm-topbar {
    min-height: var(--dm-topbar-height);
    background: var(--dm-surface-card);
    border-bottom: 1px solid var(--dm-surface-border);
}

.dm-sidebar {
    width: var(--dm-sidebar-width-desktop);
    background: var(--dm-surface-card);
    border-right: 1px solid var(--dm-surface-border);
}

.dm-bottom-nav {
    border-top: 1px solid var(--dm-surface-border);
    background: var(--dm-surface-card);
}

.dm-list-item + .dm-list-item {
    border-top: 1px solid var(--dm-surface-border);
}

.dm-skeleton {
    background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 37%, #f3f4f6 63%);
    background-size: 400% 100%;
    animation: dm-skeleton-shimmer 1.4s ease infinite;
    border-radius: var(--dm-radius-sm);
}

@keyframes dm-skeleton-shimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

@media (max-width: 991.98px) {
    .dm-sidebar {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid var(--dm-surface-border);
    }
}