       /* 额外样式 */
        .max-w-7xl { max-width: 80rem; }
        .max-w-3xl { max-width: 48rem; }
        .max-w-md { max-width: 28rem; }
        .mx-auto { margin-left: auto; margin-right: auto; }
        .mx-4 { margin-left: 1rem; margin-right: 1rem; }
        .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
        .px-4 { padding-left: 1rem; padding-right: 1rem; }
        .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
        .px-8 { padding-left: 2rem; padding-right: 2rem; }
        .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
        .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
        .py-4 { padding-top: 1rem; padding-bottom: 1rem; }
        .py-12 { padding-top: 3rem; padding-bottom: 3rem; }
        .p-3 { padding: 0.75rem; }
        .p-4 { padding: 1rem; }
        .p-6 { padding: 1.5rem; }
        .mb-1 { margin-bottom: 0.25rem; }
        .mb-2 { margin-bottom: 0.5rem; }
        .mb-4 { margin-bottom: 1rem; }
        .mb-6 { margin-bottom: 1.5rem; }
        .mb-8 { margin-bottom: 2rem; }
        .mb-12 { margin-bottom: 3rem; }
        .mr-1 { margin-right: 0.25rem; }
        .mr-2 { margin-right: 0.5rem; }
        .mt-1 { margin-top: 0.25rem; }
        .mt-2 { margin-top: 0.5rem; }
        .gap-2 { gap: 0.5rem; }
        .gap-3 { gap: 0.75rem; }
        .gap-6 { gap: 1.5rem; }
        .space-y-3 > * + * { margin-top: 0.75rem; }
        .space-y-4 > * + * { margin-top: 1rem; }
        .flex { display: flex; }
        .inline-flex { display: inline-flex; }
        .grid { display: grid; }
        .items-center { align-items: center; }
        .items-start { align-items: flex-start; }
        .justify-between { justify-content: space-between; }
        .justify-center { justify-content: center; }
        .text-center { text-align: center; }
        .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
        .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
        .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
        .text-2xl { font-size: 1.5rem; line-height: 2rem; }
        .text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
        .font-medium { font-weight: 500; }
        .font-bold { font-weight: 700; }
        .rounded-lg { border-radius: 0.5rem; }
        .rounded-xl { border-radius: 0.75rem; }
        .rounded-2xl { border-radius: 1rem; }
        .rounded-full { border-radius: 9999px; }
        .w-full { width: 100%; }
        .w-16 { width: 4rem; }
        .h-16 { height: 4rem; }
        .resize-none { resize: none; }
        .sticky { position: sticky; }
        .top-0 { top: 0; }
        .z-50 { z-index: 50; }
        .z-40 { z-index: 40; }
        .relative { position: relative; }
        .absolute { position: absolute; }
        .fixed { position: fixed; }
        .inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
        .inset-y-0 { top: 0; bottom: 0; }
        .right-0 { right: 0; }
        .top-4 { top: 1rem; }
        .right-4 { right: 1rem; }
        .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .cursor-pointer { cursor: pointer; }
        .transition { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
        .transform { transform: translateX(0); }
        .translate-x-full { transform: translateX(100%); }
        .flex-1 { flex: 1 1 0%; }
        .flex-col { flex-direction: column; }
        .overflow-y-auto { overflow-y: auto; }
        .line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
        .block { display: block; }
        .border-b { border-bottom-width: 1px; }
        .text-white { color: #fff; }
        .text-slate-300 { color: #cbd5e1; }
        .text-slate-400 { color: #94a3b8; }
        .text-slate-500 { color: #64748b; }
        .text-slate-600 { color: #475569; }
        .text-slate-700 { color: #334155; }
        .text-sky-400 { color: #38bdf8; }
        .text-emerald-400 { color: #34d399; }
        .text-emerald-300 { color: #6ee7b7; }
        .text-pink-400 { color: #f472b6; }
        .text-amber-400 { color: #fbbf24; }
        .text-amber-300 { color: #fcd34d; }
        .text-violet-400 { color: #a78bfa; }
        .bg-emerald-600 { background-color: #059669; }
        .bg-emerald-500 { background-color: #10b981; }
        .bg-red-600 { background-color: #dc2626; }
        .bg-red-500 { background-color: #ef4444; }
        .hover\:text-white:hover { color: #fff; }
        .hover\:text-emerald-300:hover { color: #6ee7b7; }
        .hover\:text-sky-400:hover { color: #38bdf8; }
        .hover\:bg-emerald-500:hover { background-color: #10b981; }
        .hover\:bg-red-500:hover { background-color: #ef4444; }
        .group:hover .group-hover\:text-sky-400 { color: #38bdf8; }
        .border-slate-700 { border-color: #334155; }