.metric-card{background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px;display:flex;align-items:flex-start;gap:20px;transition:all .3s ease;position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(173,30,222,.1),transparent);transition:left .5s}.metric-card:hover:before{left:100%}.metric-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(173,30,222,.3);border-color:rgba(173,30,222,.4)}.metric-icon-wrapper{width:64px;height:64px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;overflow:hidden}.metric-gradient .metric-icon-wrapper{background:linear-gradient(135deg,#0d58e4,#ad1ede 50%,#ff00db);box-shadow:0 8px 24px rgba(173,30,222,.4)}.metric-success .metric-icon-wrapper{background:linear-gradient(135deg,#10b981,#34d399);box-shadow:0 8px 24px rgba(16,185,129,.4)}.metric-warning .metric-icon-wrapper{background:linear-gradient(135deg,#f59e0b,#fbbf24);box-shadow:0 8px 24px rgba(245,158,11,.4)}.metric-danger .metric-icon-wrapper{background:linear-gradient(135deg,#ef4444,#f87171);box-shadow:0 8px 24px rgba(239,68,68,.4)}.metric-icon{font-size:32px;animation:pulse 3s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.metric-content{flex:1 1;display:flex;flex-direction:column;gap:8px}.metric-title{margin:0;font-size:14px;font-weight:600;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:32px;font-weight:700;color:white;line-height:1}.metric-gradient .metric-value{background:linear-gradient(92deg,#0d58e4,#ad1ede 52%,#ff00db);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.metric-change{display:flex;align-items:center;gap:6px;margin-top:8px;padding:6px 12px;background:rgba(255,255,255,.05);border-radius:8px;width:-moz-fit-content;width:fit-content}.metric-change.positive{background:rgba(16,185,129,.15);border:1px solid rgba(16,185,129,.3)}.metric-change.negative{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3)}.change-icon,.change-value{font-size:14px}.change-value{font-weight:700}.metric-change.positive .change-value{color:#4ade80}.metric-change.negative .change-value{color:#fb7185}.change-label{font-size:12px;color:rgba(255,255,255,.6)}@media (max-width:768px){.metric-card{padding:20px;gap:16px}.metric-icon-wrapper{width:56px;height:56px}.metric-icon,.metric-value{font-size:28px}.metric-title{font-size:12px}.change-label,.change-value{font-size:11px}}