/* 自定义样式 - 增强专业感 */
:root {
    --shadow-sm: 0 1px 2px 0 rgba(0,0,0,0.04);
    --shadow-md: 0 1px 3px 0 rgba(0,0,0,0.06), 0 4px 8px -2px rgba(0,0,0,0.05);
    --shadow-lg: 0 4px 6px -1px rgba(0,0,0,0.06), 0 10px 20px -4px rgba(0,0,0,0.08);
}

.card { background: white; border-radius: 12px; box-shadow: var(--shadow-md); border: 1px solid rgba(15,23,42,0.04); }
.card-hover { transition: all .2s ease; }
.card-hover:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }

.btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
    color: white; font-weight: 500; padding: 10px 20px; border-radius: 8px;
    transition: all .2s; box-shadow: 0 1px 2px rgba(59,130,246,0.3);
    cursor: pointer; border: none;
}
.btn-primary:hover { box-shadow: 0 4px 12px rgba(59,130,246,0.4); transform: translateY(-1px); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; }

.btn-ghost {
    background: white; color: #475569; border: 1px solid #e2e8f0;
    padding: 8px 16px; border-radius: 8px; transition: all .2s;
    cursor: pointer;
}
.btn-ghost:hover { border-color: #cbd5e1; background: #f8fafc; }

.input-field {
    width: 100%; padding: 10px 14px; border: 1px solid #e2e8f0;
    border-radius: 8px; transition: all .2s; background: white;
    font-size: 14px; box-sizing: border-box;
}
.input-field:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,0.12); }

.label { display: block; font-size: 13px; font-weight: 500; color: #475569; margin-bottom: 6px; }

.progress-ring { transform: rotate(-90deg); }
.progress-ring__circle { transition: stroke-dashoffset 0.5s ease; }

.tag { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 9999px; font-size: 11px; font-weight: 500; }
.tag-blue { background: #dbeafe; color: #1e40af; }
.tag-green { background: #d1fae5; color: #065f46; }
.tag-amber { background: #fef3c7; color: #92400e; }
.tag-slate { background: #f1f5f9; color: #475569; }

html { scroll-behavior: smooth; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.skeleton { background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%); background-size: 200% 100%; animation: skeleton 1.5s infinite; }
@keyframes skeleton { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }