:root {
    --ui-bg: #ffffff;
    --ui-text: #111111;
    --ui-muted: #6b7280;
    --ui-border: #e5e7eb;
    --ui-border-strong: #d1d5db;
    --ui-primary: #111111;
    --ui-primary-text: #ffffff;
    --ui-danger: #6b7280;
    --ui-radius-sm: 6px;
    --ui-radius-md: 10px;
    --ui-shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.04);
    --ui-space-1: 4px;
    --ui-space-2: 8px;
    --ui-space-3: 12px;
    --ui-space-4: 16px;
    --ui-space-5: 24px;
}

.ui-card {
    background: var(--ui-bg);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-sm);
}

.ui-muted {
    color: var(--ui-muted);
}

.ui-section-title {
    letter-spacing: 0.2px;
}

.ui-empty,
.ui-loading,
.ui-error {
    border: 1px dashed var(--ui-border-strong);
    border-radius: var(--ui-radius-sm);
    padding: var(--ui-space-3);
    color: var(--ui-muted);
    background: #fcfcfc;
}

.ui-error {
    color: var(--ui-muted);
    border-color: var(--ui-border-strong);
    background: #f9fafb;
}

/* Author page polish using existing ids */
#authorSearchForm .form-control,
#authorSearchForm .btn,
#authorPrevBtn,
#authorNextBtn {
    border-radius: var(--ui-radius-sm);
}

#featuredWorks > .col-12.text-muted,
#latestArticles > .col-12.text-muted,
#authorSearchMeta {
    font-size: 0.92rem;
}

/* Article detail page polish using existing ids */
#feedbackButtons button,
#saveNoteBtn,
#likeBtn,
#reportBtn {
    border-radius: var(--ui-radius-sm);
}

#noteInput {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
}

#relatedArticles > .col-12.text-muted {
    border: 1px dashed var(--ui-border-strong);
    border-radius: var(--ui-radius-sm);
    padding: var(--ui-space-3);
    color: var(--ui-muted);
    background: #fcfcfc;
}

#actionTip {
    border-radius: var(--ui-radius-sm);
}

/* Admin page polish using existing classes/ids */
.admin-wrap .btn {
    border-radius: var(--ui-radius-sm);
}

.admin-wrap .table {
    border-color: var(--ui-border);
}

.admin-wrap .table > :not(caption) > * > * {
    border-color: var(--ui-border);
}

.admin-wrap .table thead.table-light th {
    background: #f8fafc;
}

.admin-wrap .panel {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    padding: var(--ui-space-4);
    margin-top: var(--ui-space-3);
    background: var(--ui-bg);
}

.admin-wrap .toast-item {
    border-radius: var(--ui-radius-sm);
}
