:root{--bg-color: #f3f4f6;--card-bg: #ffffff;--text-main: #1f2937;--text-muted: #6b7280;--accent-color: #3b82f6;--shadow-color: rgba(0, 0, 0, .05);--border-radius: 12px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-main);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dashboard-container{max-width:1200px;margin:0 auto;padding:2rem 1rem}.dashboard-grid{display:flex;flex-wrap:wrap;gap:1.5rem}.card{flex:1 1 260px;background-color:var(--card-bg);border-radius:var(--border-radius);padding:1.5rem;box-shadow:0 4px 6px -1px var(--shadow-color),0 2px 4px -1px var(--shadow-color);transition:transform .2s ease,box-shadow .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px var(--shadow-color),0 4px 6px -2px var(--shadow-color)}.card-title{font-size:.875rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.5rem}.card-value{font-size:2.25rem;font-weight:700;color:var(--text-main)}.chart-card{flex:1 1 100%;background-color:var(--card-bg);border-radius:var(--border-radius);padding:1.5rem;box-shadow:0 4px 6px -1px var(--shadow-color),0 2px 4px -1px var(--shadow-color);display:flex;flex-direction:column}.chart-title{font-size:1.125rem;font-weight:700;margin-bottom:1.5rem;color:var(--text-main);text-align:left}