.skyspeed-wrapper { max-width: 1200px; margin: 20px auto; }
.skyspeed-card { background: #fff; padding: 20px; border: 1px solid #dcdcde; box-shadow: 0 1px 1px rgba(0,0,0,0.04); margin-bottom: 20px; border-radius: 4px; }
.skyspeed-dashboard { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.skyspeed-stats { text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.skyspeed-stat-number { font-size: 3em; font-weight: bold; color: #2271b1; }
.skyspeed-stat-number .unit { font-size: 0.4em; color: #646970; }
.skyspeed-hidden { display: none; }

/* Circular Progress */
.skyspeed-bulk-actions { display: flex; align-items: center; gap: 20px; margin-top: 20px; }
.circular-chart { display: block; margin: 0 auto; max-width: 80%; max-height: 250px; }
.circle-bg { fill: none; stroke: #eee; stroke-width: 3.8; }
.circle { fill: none; stroke-width: 2.8; stroke-linecap: round; animation: progress 1s ease-out forwards; transition: stroke-dasharray 0.3s; }
.percentage { fill: #666; font-family: sans-serif; font-weight: bold; font-size: 0.5em; text-anchor: middle; }
.green .circle { stroke: #4caf50; }
#skyspeed-circular-progress { width: 100px; height: 100px; }