:root{--bg-dark: #0a0a0a;--bg-card: rgba(30, 30, 35, .6);--bg-card-hover: rgba(40, 40, 45, .8);--text-primary: #ffffff;--text-secondary: #a1a1aa;--accent-blue: #3b82f6;--accent-yellow: #eab308;--accent-red: #ef4444;--accent-green: #22c55e;--glass-border: 1px solid rgba(255, 255, 255, .1);--font-family: "Inter", system-ui, -apple-system, sans-serif}body{margin:0;padding:0;background-color:var(--bg-dark);color:var(--text-primary);font-family:var(--font-family);background-image:radial-gradient(circle at 10% 20%,rgba(59,130,246,.15) 0%,transparent 20%),radial-gradient(circle at 90% 80%,rgba(234,179,8,.1) 0%,transparent 20%);min-height:100vh;-webkit-font-smoothing:antialiased}#root{max-width:1400px;margin:0 auto;padding:2rem}.dashboard-header{margin-bottom:2rem}.dashboard-header h1{font-size:2.5rem;font-weight:700;margin:0;background:linear-gradient(to right,#fff,#94a3b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.dashboard-header p{color:var(--text-secondary);font-size:1.1rem;margin-top:.5rem}.bento-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;grid-auto-rows:minmax(180px,auto)}.card{background:var(--bg-card);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:var(--glass-border);border-radius:1.5rem;padding:1.5rem;transition:transform .2s,background .2s;overflow:hidden;display:flex;flex-direction:column}.card:hover{background:var(--bg-card-hover);transform:translateY(-2px)}.card-title{color:var(--text-secondary);font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.card-value-big{font-size:2.5rem;font-weight:700;margin-top:auto}.card-value-sub{font-size:1rem;color:var(--text-secondary);font-weight:400}.col-span-2{grid-column:span 2}.col-span-4{grid-column:span 4}.row-span-2{grid-row:span 2}@media(max-width:1024px){.bento-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.bento-grid{grid-template-columns:1fr}.col-span-2,.col-span-4{grid-column:span 1}}.loading-container{height:100vh;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);font-size:1.5rem}.weather-icon-large{width:64px;height:64px;margin-bottom:1rem}