:root{--primary:#7367f0;--secondary:#ff9f43;--success:#28c76f;--danger:#ea5455;--info:#00cfe8;--dark:#283046;--light:#f8f8f8;--text:#6e6b7b;--border:#ebe9f1}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,Microsoft YaHei,sans-serif}body{background:#f5f7fa;color:var(--text);padding:20px;transition:all .3s ease}.dashboard{margin:0 auto}h1,h2,h3,h4{color:var(--dark);font-weight:600}h1{margin-bottom:20px;font-size:24px;display:flex;align-items:center}h1:before{content:"";display:inline-block;width:5px;height:20px;background:var(--primary);margin-right:10px;border-radius:3px}h3{margin-bottom:15px;font-size:16px;position:relative;padding-left:12px}h3:before{content:"";position:absolute;left:0;top:5px;height:15px;width:3px;background:var(--primary);border-radius:3px}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-bottom:25px}.stat-card{padding:25px;border-radius:10px;color:#fff;text-align:center;font-weight:500;box-shadow:0 4px 20px rgba(0,0,0,.08);transition:all .4s cubic-bezier(.175,.885,.32,1.1);position:relative;overflow:hidden;cursor:pointer}.stat-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,.12)}.stat-card:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0));opacity:0;transition:opacity .3s ease}.stat-card:hover:after{opacity:1}.stat-card h2{font-size:28px;margin-bottom:5px;color:#fff;font-weight:600}.stat-card p{font-size:16px;opacity:.9}.stat-card .icon{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:50px;opacity:.2}.charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px;margin-bottom:20px}.chart-container{background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.05);transition:all .3s ease}.chart-container:hover{box-shadow:0 8px 25px rgba(0,0,0,.08)}.chart{width:100%;height:300px}.recent-orders{background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.05);margin-top:20px;transition:all .3s ease}.recent-orders:hover{box-shadow:0 8px 25px rgba(0,0,0,.08)}table{width:100%;border-collapse:collapse;font-size:14px}td,th{padding:12px 15px;text-align:left;border-bottom:1px solid var(--border)}th{background:var(--light);font-weight:600;color:var(--dark);text-transform:uppercase;font-size:12px;letter-spacing:.5px}tr:hover td{background:rgba(115,103,240,.05)}.status{display:inline-block;padding:5px 10px;border-radius:20px;font-size:12px;font-weight:500}.status.completed{background:rgba(40,199,111,.12);color:var(--success)}.status.pending{background:rgba(255,159,67,.12);color:var(--secondary)}.status.waiting{background:rgba(0,207,232,.12);color:var(--info)}@media (max-width:768px){.stats{grid-template-columns:1fr 1fr}.charts{grid-template-columns:1fr}}@media (max-width:480px){.stats{grid-template-columns:1fr}body{padding:15px}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.chart-container,.recent-orders,.stat-card{animation:fadeIn .6s ease forwards;opacity:0}.stat-card:first-child{animation-delay:.1s}.stat-card:nth-child(2){animation-delay:.2s}.stat-card:nth-child(3){animation-delay:.3s}.stat-card:nth-child(4){animation-delay:.4s}.chart-container:first-child{animation-delay:.5s}.chart-container:nth-child(2){animation-delay:.6s}.chart-container:nth-child(3){animation-delay:.7s}.recent-orders{animation-delay:.8s}