/* Cloud.moda 共用樣式 */
:root {
  --bg: #0b1220;
  --card: #121a2b;
  --muted: #7c8aa5;
  --primary: #3b82f6;
  --primary-600: #2563eb;
  --accent: #22d3ee;
  --ok: #10b981;
  --warn: #f59e0b;
  --danger: #ef4444;
}

body { 
  font-family: "Noto Sans TC","Roboto",system-ui,-apple-system,Segoe UI,Arial,sans-serif; 
  background: radial-gradient(1200px 600px at 20% 0%, #0d1630 0%, var(--bg) 50%), linear-gradient(160deg,#0b1220 0%, #0b1220 60%, #0e1830 100%); 
  color: #e8efff; 
}

.glass { 
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.04)); 
  border: 1px solid rgba(255,255,255,0.08); 
  backdrop-filter: blur(10px); 
}

.card { 
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.04)); 
  border: 1px solid rgba(255,255,255,0.08); 
}

.shadow-glow { 
  box-shadow: 0 10px 30px rgba(0,0,0,0.35), inset 0 0 0 1px rgba(255,255,255,0.04); 
}

.btn { 
  transition: transform .12s ease, box-shadow .2s ease, background .2s ease; 
}

.btn:active { 
  transform: translateY(1px) scale(0.99); 
}

.grad { 
  background: linear-gradient(135deg, var(--primary) 0%, #60a5fa 40%, var(--accent) 100%); 
}

.pill { 
  border: 1px solid rgba(255,255,255,0.12); 
}

.dot { 
  width:10px; 
  height:10px; 
  border-radius:9999px; 
  display:inline-block; 
}

.scrollbar::-webkit-scrollbar { 
  height: 8px; 
  width: 8px; 
}

.scrollbar::-webkit-scrollbar-thumb { 
  background: rgba(255,255,255,0.15); 
  border-radius: 9999px; 
}

.kpi { 
  background: linear-gradient(180deg, rgba(34,211,238,0.08), rgba(59,130,246,0.08)); 
}

.chip { 
  background: rgba(255,255,255,0.06); 
  border: 1px solid rgba(255,255,255,0.12); 
}