*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #667eea;--primary-dark: #764ba2;--secondary-color: #f8f9fa;--success-color: #27ae60;--danger-color: #e74c3c;--warning-color: #f39c12;--info-color: #3498db;--dark-color: #333333;--light-color: #ffffff;--gray-color: #6c757d;--gray-light: #e9ecef;--gray-lighter: #f8f9fa;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-xxl: 3rem;--font-xs: .75rem;--font-sm: .875rem;--font-md: 1rem;--font-lg: 1.125rem;--font-xl: 1.25rem;--font-xxl: 1.5rem;--font-xxxl: 2rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 8px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .1);--shadow-xl: 0 16px 32px rgba(0, 0, 0, .15)}html{font-size:16px;line-height:1.6}body{font-family:Microsoft YaHei,PingFang SC,Hiragino Sans GB,Helvetica Neue,Arial,sans-serif;background:linear-gradient(135deg,var(--primary-color) 0%,var(--primary-dark) 100%);min-height:100vh;color:var(--dark-color);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--primary-color);text-decoration:none;transition:color .3s ease}a:hover{color:var(--primary-dark);text-decoration:underline}button{font-family:inherit;cursor:pointer;border:none;outline:none;transition:all .3s ease;font-weight:500}button:disabled{opacity:.6;cursor:not-allowed}input,textarea,select{font-family:inherit;border:2px solid var(--gray-light);border-radius:var(--radius-md);padding:var(--spacing-md);font-size:var(--font-md);transition:border-color .3s ease,box-shadow .3s ease;background:var(--light-color)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a}input::placeholder,textarea::placeholder{color:var(--gray-color)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--gray-lighter);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb{background:var(--gray-color);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--dark-color)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.min-h-screen{min-height:100vh}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.space-x-2>*+*{margin-left:.5rem}.space-x-3>*+*{margin-left:.75rem}.space-x-4>*+*{margin-left:1rem}.space-y-2>*+*{margin-top:.5rem}.space-y-4>*+*{margin-top:1rem}.space-y-6>*+*{margin-top:1.5rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-full{width:100%}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.max-w-md{max-width:28rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-center{text-align:center}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-white{color:#fff}.text-gray-500{color:#6b7280}.text-gray-600{color:#4b5563}.text-gray-900{color:#111827}.text-blue-600{color:#2563eb}.text-red-600{color:#dc2626}.text-green-600{color:#16a34a}.text-purple-600{color:#9333ea}.text-orange-600{color:#ea580c}.bg-white{background-color:#fff}.bg-gray-50{background-color:#f9fafb}.bg-blue-50{background-color:#eff6ff}.bg-blue-100{background-color:#dbeafe}.bg-blue-500{background-color:#3b82f6}.bg-purple-600{background-color:#9333ea}.bg-gradient-to-br{background:linear-gradient(to bottom right,#667eea,#764ba2)}.bg-gradient-to-r{background:linear-gradient(to right,#667eea,#764ba2)}.from-blue-50.to-purple-50{background:linear-gradient(to bottom right,#eff6ff,#faf5ff)}.from-blue-500.to-purple-600{background:linear-gradient(to bottom right,#3b82f6,#9333ea)}.from-blue-50{background:#eff6ff}.to-purple-50{background:#faf5ff}.from-blue-500{background:#3b82f6}.to-purple-600{background:#9333ea}.border{border-width:1px}.border-gray-200{border-color:#e5e7eb}.border-blue-200{border-color:#c3ddfd}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.shadow-sm{box-shadow:0 1px 2px #0000000d}.shadow-md{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.hover\:text-blue-600:hover{color:#2563eb}.hover\:bg-gray-50:hover{background-color:#f9fafb}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:0}.left-0{left:0}.right-0{right:0}.bottom-0{bottom:0}.inset-y-0{top:0;bottom:0}.z-1000{z-index:1000}.hidden{display:none}.block{display:block}.inline-flex{display:inline-flex}.min-w-0{min-width:0px}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.w-90{width:90%}.max-w-2xl{max-width:42rem}.max-w-5xl{max-width:64rem}.opacity-90{opacity:.9}.opacity-95{opacity:.95}.bg-transparent{background-color:transparent}.break-all{word-break:break-all}.break-words{word-wrap:break-word}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lg\:w-64{width:16rem}.lg\:flex-row{flex-direction:row}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3,.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:space-y-0>*+*{margin-top:0}.sm\:inline{display:inline}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.space-y-1>*+*{margin-top:.25rem}.space-y-3>*+*{margin-top:.75rem}.space-x-1>*+*{margin-left:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.p-3{padding:.75rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pr-3{padding-right:.75rem}.pr-10{padding-right:2.5rem}.mt-8{margin-top:2rem}.mt-12{margin-top:3rem}.mb-8{margin-bottom:2rem}.w-3{width:.75rem}.h-3{height:.75rem}.w-24{width:6rem}.h-24{height:6rem}.h-40{height:10rem}.max-h-90vh{max-height:90vh}.text-blue-100{color:#dbeafe}.text-blue-700{color:#1d4ed8}.text-blue-800{color:#1e40af}.text-blue-900{color:#1e3a8a}.text-red-800{color:#991b1b}.text-green-800{color:#166534}.text-yellow-600{color:#d97706}.text-yellow-700{color:#b45309}.text-yellow-800{color:#92400e}.text-gray-300{color:#d1d5db}.text-gray-400{color:#9ca3af}.text-gray-700{color:#374151}.text-gray-800{color:#1f2937}.bg-gray-100{background-color:#f3f4f6}.bg-gray-200{background-color:#e5e7eb}.bg-green-50{background-color:#f0fdf4}.bg-green-100{background-color:#dcfce7}.bg-yellow-50{background-color:#fefce8}.bg-red-50{background-color:#fef2f2}.bg-red-100{background-color:#fee2e2}.bg-purple-100{background-color:#f3e8ff}.bg-orange-100{background-color:#ffedd5}.border-red-300{border-color:#fca5a5}.border-yellow-200{border-color:#fde68a}.border-green-200{border-color:#bbf7d0}.border-0{border-width:0}.border-2{border-width:2px}.border-4{border-width:4px}.border-solid{border-style:solid}.border-dashed{border-style:dashed}.border-dotted{border-style:dotted}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-l-4{border-left-width:4px}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-spin{animation:spin 1s linear infinite}.blur-sm{filter:blur(4px)}.bg-opacity-10{background-color:#ffffff1a}.bg-opacity-20{background-color:#fff3}.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.backdrop-blur-md{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.backdrop-blur-lg{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.divide-y>*+*{border-top-width:1px}.divide-gray-200>*+*{border-top-color:#e5e7eb}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.items-end{align-items:flex-end}.justify-end{justify-content:flex-end}.font-mono{font-family:ui-monospace,SFMono-Regular,SF Mono,Consolas,Liberation Mono,Menlo,monospace}@media (min-width: 640px){.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:space-y-0>*+*{margin-top:0}.sm\:inline{display:inline}.sm\:mt-0{margin-top:0}}@media (min-width: 768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width: 1024px){.lg\:w-64{width:16rem}.lg\:flex-row{flex-direction:row}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:col-span-2{grid-column:span 2 / span 2}}@media (min-width: 1280px){.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.card{background:var(--light-color);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-lg);margin-bottom:var(--spacing-lg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-md);font-size:var(--font-md);font-weight:500;text-decoration:none;transition:all .3s ease;min-height:44px;border:none;cursor:pointer}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-primary{background:linear-gradient(45deg,var(--primary-color),var(--primary-dark));color:var(--light-color)}.btn-secondary{background:var(--secondary-color);color:var(--dark-color);border:1px solid var(--gray-light)}.btn-success{background:linear-gradient(45deg,var(--success-color),#2ecc71);color:var(--light-color)}.btn-danger{background:linear-gradient(45deg,var(--danger-color),#c0392b);color:var(--light-color)}.btn-warning{background:linear-gradient(45deg,var(--warning-color),#e67e22);color:var(--light-color)}.btn-outline{background:transparent;border:2px solid var(--primary-color);color:var(--primary-color)}.btn-outline:hover{background:var(--primary-color);color:var(--light-color)}.btn-sm{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-sm);min-height:36px}.btn-lg{padding:var(--spacing-lg) var(--spacing-xxl);font-size:var(--font-lg);min-height:52px}.form-group{margin-bottom:var(--spacing-lg)}.form-label{display:block;margin-bottom:var(--spacing-sm);font-weight:500;color:var(--dark-color)}.form-control{width:100%;padding:var(--spacing-md);border:2px solid var(--gray-light);border-radius:var(--radius-md);font-size:var(--font-md);transition:all .3s ease}.form-control:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a}.form-error{color:var(--danger-color);font-size:var(--font-sm);margin-top:var(--spacing-xs)}.alert{padding:var(--spacing-md);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.alert-success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.alert-danger{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.alert-warning{background:#fff3cd;color:#856404;border:1px solid #ffeaa7}.alert-info{background:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-md)}.modal-content{background:var(--light-color);border-radius:var(--radius-xl);padding:var(--spacing-xl);max-width:600px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-xl)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--gray-light)}.modal-title{font-size:var(--font-xl);font-weight:600;color:var(--dark-color)}.modal-close{background:none;border:none;font-size:var(--font-xxl);cursor:pointer;color:var(--gray-color);padding:var(--spacing-sm);border-radius:var(--radius-sm);transition:all .3s ease}.modal-close:hover{color:var(--dark-color);background:var(--gray-lighter)}.table{width:100%;border-collapse:collapse;margin-bottom:var(--spacing-lg)}.table th,.table td{padding:var(--spacing-md);text-align:left;border-bottom:1px solid var(--gray-light)}.table th{background:var(--gray-lighter);font-weight:600;color:var(--dark-color)}.table tr:hover{background:var(--gray-lighter)}.badge{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-xs);font-weight:500;border-radius:var(--radius-lg);text-transform:uppercase;letter-spacing:.5px}.badge-primary{background:var(--primary-color);color:var(--light-color)}.badge-success{background:var(--success-color);color:var(--light-color)}.badge-danger{background:var(--danger-color);color:var(--light-color)}.badge-warning{background:var(--warning-color);color:var(--light-color)}.badge-secondary{background:var(--gray-color);color:var(--light-color)}.spinner{width:20px;height:20px;border:2px solid var(--gray-light);border-top:2px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.loading{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);color:var(--gray-color)}@media (max-width: 768px){.container{padding:0 var(--spacing-sm)}.card{padding:var(--spacing-lg);margin-bottom:var(--spacing-md)}.btn{width:100%;margin-bottom:var(--spacing-sm)}.modal-content{padding:var(--spacing-lg);margin:var(--spacing-sm)}.table{font-size:var(--font-sm)}.table th,.table td{padding:var(--spacing-sm)}}@media (max-width: 480px){html{font-size:14px}.card{padding:var(--spacing-md);border-radius:var(--radius-md)}.btn{padding:var(--spacing-md);font-size:var(--font-sm)}}